/* =========================================================
   LIENEX Blog Pro
   Scope: /blog only
   Load AFTER ../css/styles.css
   ========================================================= */

:root{
  --lx-navy:#0b2e4b;
  --lx-blue:#145f91;
  --lx-cyan:#53c9e6;
  --lx-teal:#46b9b8;
  --lx-mint:#a9eadb;
  --lx-ink:#102a43;
  --lx-muted:#5f7183;
  --lx-line:rgba(16,42,67,.12);
  --lx-paper:#f7fbfe;
  --lx-white:#fff;
  --lx-radius-xl:32px;
  --lx-radius-lg:24px;
  --lx-radius-md:18px;
  --lx-shadow:0 24px 70px rgba(9,42,68,.16);
  --lx-shadow-soft:0 12px 35px rgba(9,42,68,.10);
}

html{scroll-behavior:smooth}

body.lx-blog{
  background:
    radial-gradient(circle at 10% 4%, rgba(83,201,230,.16), transparent 30rem),
    radial-gradient(circle at 88% 22%, rgba(70,185,184,.12), transparent 28rem),
    linear-gradient(180deg,#f8fcff 0%,#eef8fc 48%,#f8fbfd 100%);
  color:var(--lx-ink);
  min-height:100vh;
}

body.lx-blog::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  opacity:.28;
  background-image:
    linear-gradient(rgba(20,95,145,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(20,95,145,.04) 1px,transparent 1px);
  background-size:38px 38px;
  mask-image:linear-gradient(to bottom,black,transparent 70%);
}

/* Keep the real LIENEX logo and existing nav structure */
body.lx-blog nav{
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  background:rgba(255,255,255,.86);
  border-bottom:1px solid rgba(16,42,67,.08);
}

body.lx-blog nav .logo img{
  height:48px;
  width:auto;
}

body.lx-blog .nav-links a[aria-current="page"]{
  color:var(--lx-navy);
}

body.lx-blog .nav-links a[aria-current="page"]::after{
  width:100%;
}

.lx-blog-main{
  width:min(1320px,calc(100% - 40px));
  margin:0 auto;
  padding:122px 0 80px;
}

/* ---------- Shared buttons ---------- */
.lx-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.65rem;
  min-height:48px;
  padding:.8rem 1.15rem;
  border-radius:999px;
  text-decoration:none;
  font-weight:700;
  letter-spacing:-.01em;
  border:1px solid transparent;
  transition:transform .22s ease,box-shadow .22s ease,background .22s ease;
}

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

.lx-btn-primary{
  color:#fff;
  background:linear-gradient(135deg,var(--lx-blue),var(--lx-teal));
  box-shadow:0 12px 28px rgba(20,95,145,.24);
}

.lx-btn-primary:hover{
  box-shadow:0 18px 38px rgba(20,95,145,.32);
}

.lx-btn-secondary{
  color:var(--lx-navy);
  background:rgba(255,255,255,.74);
  border-color:rgba(20,95,145,.18);
}

.lx-arrow{
  display:inline-grid;
  place-items:center;
  width:26px;
  aspect-ratio:1;
  border-radius:50%;
  background:rgba(255,255,255,.18);
  transition:transform .22s ease;
}

.lx-btn:hover .lx-arrow{transform:translateX(3px)}

/* ---------- Blog index hero ---------- */
.lx-index-hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);
  gap:34px;
  align-items:center;
  min-height:430px;
  padding:clamp(34px,6vw,72px);
  border-radius:var(--lx-radius-xl);
  color:#fff;
  background:
    radial-gradient(circle at 84% 18%,rgba(169,234,219,.38),transparent 25rem),
    linear-gradient(135deg,#0a2d49 0%,#145f91 52%,#46b9b8 100%);
  box-shadow:var(--lx-shadow);
}

.lx-index-hero::before,
.lx-index-hero::after{
  content:"";
  position:absolute;
  border-radius:50%;
  pointer-events:none;
  z-index:-1;
}

.lx-index-hero::before{
  width:340px;
  height:340px;
  right:-100px;
  top:-140px;
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 0 0 36px rgba(255,255,255,.04),0 0 0 72px rgba(255,255,255,.025);
  animation:lxFloat 8s ease-in-out infinite;
}

.lx-index-hero::after{
  width:180px;
  height:180px;
  left:44%;
  bottom:-120px;
  background:rgba(255,255,255,.08);
  filter:blur(2px);
  animation:lxFloat 10s ease-in-out infinite reverse;
}

.lx-kicker{
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  margin-bottom:1rem;
  font-size:.78rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.15em;
}

.lx-kicker::before{
  content:"";
  width:28px;
  height:2px;
  border-radius:999px;
  background:currentColor;
  opacity:.65;
}

.lx-index-hero h1{
  max-width:820px;
  margin:0 0 1rem;
  color:#fff;
  font-size:clamp(2.6rem,5vw,5.4rem);
  line-height:.98;
  letter-spacing:-.055em;
}

.lx-index-hero p{
  max-width:710px;
  margin:0 0 1.6rem;
  color:rgba(255,255,255,.86);
  font-size:clamp(1rem,1.5vw,1.18rem);
}

.lx-hero-panel{
  position:relative;
  min-height:290px;
  display:grid;
  place-items:center;
}

.lx-orbit{
  position:absolute;
  width:min(340px,85%);
  aspect-ratio:1;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.2);
  box-shadow:0 0 0 24px rgba(255,255,255,.04),0 0 0 48px rgba(255,255,255,.025);
  animation:lxSpin 24s linear infinite;
}

.lx-orbit::before,
.lx-orbit::after{
  content:"";
  position:absolute;
  width:18px;
  aspect-ratio:1;
  border-radius:50%;
  background:var(--lx-mint);
  box-shadow:0 0 24px rgba(169,234,219,.8);
}

.lx-orbit::before{top:18px;left:52px}
.lx-orbit::after{bottom:24px;right:42px}

.lx-hero-stat{
  position:relative;
  z-index:1;
  width:min(280px,90%);
  padding:26px;
  border-radius:24px;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.18);
  backdrop-filter:blur(16px);
  box-shadow:0 20px 50px rgba(0,0,0,.14);
}

.lx-hero-stat strong{
  display:block;
  margin-bottom:.35rem;
  font-size:2.5rem;
  line-height:1;
}

.lx-hero-stat span{
  color:rgba(255,255,255,.78);
}

/* ---------- Feature cards ---------- */
.lx-section-head{
  display:flex;
  justify-content:space-between;
  gap:24px;
  align-items:end;
  margin:64px 0 24px;
}

.lx-section-head h2{
  margin:0;
  color:var(--lx-navy);
  font-size:clamp(1.9rem,3vw,3.2rem);
  letter-spacing:-.04em;
  line-height:1.02;
}

.lx-section-head p{
  max-width:620px;
  margin:0;
  color:var(--lx-muted);
  font-size:1rem;
}

.lx-feature-grid{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:22px;
}

.lx-card{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:360px;
  border:1px solid rgba(16,42,67,.09);
  border-radius:var(--lx-radius-lg);
  background:#fff;
  box-shadow:var(--lx-shadow-soft);
  transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease;
}

.lx-card:hover{
  transform:translateY(-7px);
  box-shadow:0 28px 65px rgba(9,42,68,.18);
  border-color:rgba(20,95,145,.2);
}

.lx-card--wide{grid-column:span 7}
.lx-card--narrow{grid-column:span 5}
.lx-card--third{grid-column:span 4}

.lx-card-media{
  position:absolute;
  inset:0;
  z-index:-2;
  background:#dbeaf3;
}

.lx-card-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .7s cubic-bezier(.2,.7,.2,1);
}

.lx-card:hover .lx-card-media img{
  transform:scale(1.055);
}

.lx-card-overlay{
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    linear-gradient(180deg,rgba(5,28,46,.03) 10%,rgba(5,28,46,.84) 88%),
    linear-gradient(90deg,rgba(5,28,46,.32),transparent 65%);
}

.lx-card-content{
  min-height:inherit;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:28px;
  color:#fff;
}

.lx-card-badge{
  align-self:flex-start;
  margin-bottom:auto;
  padding:.46rem .72rem;
  border-radius:999px;
  background:rgba(255,255,255,.15);
  border:1px solid rgba(255,255,255,.24);
  backdrop-filter:blur(10px);
  color:#fff;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.lx-card h3{
  margin:0 0 .65rem;
  color:#fff;
  font-size:clamp(1.45rem,2.4vw,2.45rem);
  line-height:1.02;
  letter-spacing:-.035em;
}

.lx-card p{
  max-width:620px;
  margin:0 0 1rem;
  color:rgba(255,255,255,.8);
  font-size:.98rem;
}

.lx-card-link{
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  width:max-content;
  color:#fff;
  font-weight:800;
  text-decoration:none;
}

.lx-card-link::after{
  content:"→";
  transition:transform .22s ease;
}

.lx-card:hover .lx-card-link::after{transform:translateX(4px)}

.lx-card--light .lx-card-overlay{
  background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(11,46,75,.82));
}

/* Secondary article list */
.lx-notes-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}

.lx-note{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:18px;
  align-items:center;
  min-height:150px;
  padding:22px;
  border-radius:20px;
  background:rgba(255,255,255,.82);
  border:1px solid var(--lx-line);
  box-shadow:0 10px 30px rgba(9,42,68,.07);
  text-decoration:none;
  color:var(--lx-ink);
  transition:transform .22s ease,box-shadow .22s ease;
}

.lx-note:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 38px rgba(9,42,68,.12);
}

.lx-note-icon{
  width:52px;
  aspect-ratio:1;
  display:grid;
  place-items:center;
  border-radius:16px;
  color:#fff;
  background:linear-gradient(135deg,var(--lx-blue),var(--lx-teal));
  font-weight:900;
}

.lx-note h3{
  margin:0 0 .35rem;
  color:var(--lx-navy);
  font-size:1.08rem;
  line-height:1.25;
}

.lx-note p{
  margin:0;
  color:var(--lx-muted);
  font-size:.9rem;
}

.lx-note-go{
  width:38px;
  aspect-ratio:1;
  display:grid;
  place-items:center;
  border-radius:50%;
  border:1px solid var(--lx-line);
}

/* ---------- Article hero ---------- */
.lx-article-hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0,1.03fr) minmax(320px,.97fr);
  gap:30px;
  align-items:center;
  min-height:520px;
  padding:clamp(30px,5vw,64px);
  border-radius:var(--lx-radius-xl);
  color:#fff;
  background:
    radial-gradient(circle at 86% 18%,rgba(169,234,219,.26),transparent 28rem),
    linear-gradient(135deg,#0a2d49 0%,#145f91 56%,#46b9b8 100%);
  box-shadow:var(--lx-shadow);
}

.lx-article-hero::after{
  content:"";
  position:absolute;
  width:480px;
  height:480px;
  right:-220px;
  bottom:-260px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 0 0 40px rgba(255,255,255,.035),0 0 0 80px rgba(255,255,255,.025);
  z-index:-1;
}

.lx-breadcrumb{
  display:flex;
  flex-wrap:wrap;
  gap:.45rem;
  margin-bottom:1rem;
  color:rgba(255,255,255,.66);
  font-size:.82rem;
  font-weight:700;
}

.lx-breadcrumb a{
  color:#fff;
  text-decoration:none;
}

.lx-article-hero h1{
  margin:0 0 1rem;
  color:#fff;
  font-size:clamp(2.5rem,4.8vw,5.1rem);
  line-height:.99;
  letter-spacing:-.055em;
}

.lx-article-hero .lx-deck{
  max-width:720px;
  margin:0 0 1.5rem;
  color:rgba(255,255,255,.83);
  font-size:clamp(1rem,1.5vw,1.17rem);
}

.lx-hero-facts{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:1.2rem;
}

.lx-hero-fact{
  padding:.55rem .72rem;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.09);
  color:#fff;
  font-size:.82rem;
  font-weight:700;
}

.lx-hero-visual{
  position:relative;
  min-height:410px;
  border-radius:26px;
}

.lx-hero-photo{
  position:absolute;
  inset:0;
  overflow:hidden;
  border-radius:26px;
  border:1px solid rgba(255,255,255,.24);
  background:#dbeaf3;
  box-shadow:0 24px 55px rgba(0,0,0,.22);
  transform:rotate(1.2deg);
}

.lx-hero-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  animation:lxKenBurns 15s ease-in-out infinite alternate;
}

.lx-provider-chip{
  position:absolute;
  left:-18px;
  bottom:22px;
  z-index:2;
  display:flex;
  align-items:center;
  gap:12px;
  max-width:78%;
  padding:13px 16px;
  border-radius:18px;
  color:var(--lx-ink);
  background:rgba(255,255,255,.93);
  box-shadow:0 16px 38px rgba(0,0,0,.18);
  backdrop-filter:blur(12px);
}

.lx-provider-chip img{
  max-width:116px;
  max-height:44px;
  object-fit:contain;
}

.lx-provider-chip strong{
  display:block;
  font-size:.88rem;
}

.lx-provider-chip span{
  display:block;
  color:var(--lx-muted);
  font-size:.74rem;
}

/* ---------- Article body ---------- */
.lx-article-shell{
  display:grid;
  grid-template-columns:minmax(0,1fr) 330px;
  gap:28px;
  align-items:start;
  margin-top:28px;
}

.lx-article{
  padding:clamp(28px,4.2vw,58px);
  border-radius:var(--lx-radius-lg);
  background:rgba(255,255,255,.94);
  border:1px solid var(--lx-line);
  box-shadow:var(--lx-shadow-soft);
}

.lx-article .lx-lead{
  margin:0 0 1.6rem;
  color:var(--lx-navy);
  font-size:clamp(1.18rem,1.8vw,1.45rem);
  line-height:1.55;
}

.lx-article h2{
  margin:2.3rem 0 .8rem;
  color:var(--lx-navy);
  font-size:clamp(1.65rem,2.8vw,2.45rem);
  line-height:1.08;
  letter-spacing:-.035em;
}

.lx-article h3{
  margin:1.65rem 0 .55rem;
  color:var(--lx-navy);
  font-size:1.22rem;
}

.lx-article p,
.lx-article li{
  color:#344f65;
  font-size:1.02rem;
}

.lx-article ul,
.lx-article ol{
  margin:0 0 1.2rem 1.2rem;
}

.lx-article a{
  color:var(--lx-blue);
  font-weight:700;
}

.lx-disclaimer{
  margin-bottom:1.7rem;
  padding:16px 18px;
  border-radius:16px;
  border:1px solid rgba(20,95,145,.14);
  background:linear-gradient(135deg,rgba(83,201,230,.11),rgba(169,234,219,.14));
}

.lx-disclaimer strong{
  display:block;
  margin-bottom:.25rem;
  color:var(--lx-navy);
}

.lx-disclaimer p{
  margin:0;
  color:#526b7f;
  font-size:.86rem;
}

.lx-feature-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  margin:1.25rem 0 1.8rem;
}

.lx-feature-item{
  padding:18px;
  border-radius:17px;
  border:1px solid var(--lx-line);
  background:linear-gradient(180deg,#fff,#f6fbfe);
}

.lx-feature-item strong{
  display:block;
  margin-bottom:.35rem;
  color:var(--lx-navy);
}

.lx-feature-item span{
  display:block;
  color:var(--lx-muted);
  font-size:.9rem;
  line-height:1.5;
}

.lx-article-figure{
  overflow:hidden;
  margin:1.8rem 0;
  border-radius:22px;
  background:#dbeaf3;
  box-shadow:0 16px 36px rgba(9,42,68,.13);
}

.lx-article-figure img{
  display:block;
  width:100%;
  max-height:480px;
  object-fit:cover;
  transition:transform .8s cubic-bezier(.2,.7,.2,1);
}

.lx-article-figure:hover img{transform:scale(1.035)}

.lx-article-figure figcaption{
  padding:12px 16px;
  background:#fff;
  color:var(--lx-muted);
  font-size:.8rem;
}

.lx-quote{
  margin:2rem 0;
  padding:24px 26px;
  border-left:4px solid var(--lx-teal);
  border-radius:0 18px 18px 0;
  background:#f2fbfb;
}

.lx-quote p{
  margin:0;
  color:var(--lx-navy);
  font-size:1.18rem;
  font-weight:700;
}

.lx-process{
  display:grid;
  gap:13px;
  margin:1.2rem 0 1.8rem;
  counter-reset:lxstep;
}

.lx-step{
  position:relative;
  display:grid;
  grid-template-columns:46px 1fr;
  gap:14px;
  align-items:start;
  padding:17px;
  border-radius:17px;
  border:1px solid var(--lx-line);
  background:#fff;
  counter-increment:lxstep;
}

.lx-step::before{
  content:counter(lxstep);
  display:grid;
  place-items:center;
  width:42px;
  aspect-ratio:1;
  border-radius:14px;
  color:#fff;
  font-weight:900;
  background:linear-gradient(135deg,var(--lx-blue),var(--lx-teal));
}

.lx-step strong{
  display:block;
  margin-bottom:.25rem;
  color:var(--lx-navy);
}

.lx-step p{
  margin:0;
  color:var(--lx-muted);
  font-size:.91rem;
}

/* ---------- Sidebar ---------- */
.lx-sidebar{
  position:sticky;
  top:104px;
  display:grid;
  gap:18px;
}

.lx-side-card{
  padding:22px;
  border-radius:20px;
  border:1px solid var(--lx-line);
  background:rgba(255,255,255,.9);
  box-shadow:0 12px 30px rgba(9,42,68,.08);
}

.lx-side-card h3{
  margin:0 0 .85rem;
  color:var(--lx-navy);
  font-size:1.12rem;
}

.lx-side-card p,
.lx-side-card li{
  color:var(--lx-muted);
  font-size:.9rem;
}

.lx-side-card ul{
  list-style:none;
  margin:0;
  padding:0;
}

.lx-side-card li{
  padding:.58rem 0;
  border-bottom:1px solid var(--lx-line);
}

.lx-side-card li:last-child{border-bottom:0}

.lx-side-cta{
  color:#fff;
  background:
    radial-gradient(circle at 90% 10%,rgba(169,234,219,.34),transparent 12rem),
    linear-gradient(135deg,var(--lx-navy),var(--lx-blue));
}

.lx-side-cta h3,
.lx-side-cta p{color:#fff}

.lx-side-cta p{opacity:.78}

/* ---------- CTA band ---------- */
.lx-cta-band{
  position:relative;
  overflow:hidden;
  display:flex;
  justify-content:space-between;
  gap:24px;
  align-items:center;
  margin-top:30px;
  padding:28px 32px;
  border-radius:22px;
  color:#fff;
  background:linear-gradient(135deg,var(--lx-navy),var(--lx-blue),var(--lx-teal));
  background-size:180% 180%;
  animation:lxGradient 10s ease infinite;
  box-shadow:var(--lx-shadow-soft);
}

.lx-cta-band h2{
  margin:0 0 .35rem;
  color:#fff;
  font-size:clamp(1.55rem,2.5vw,2.3rem);
}

.lx-cta-band p{
  margin:0;
  color:rgba(255,255,255,.78);
  font-size:.95rem;
}

/* ---------- Footer ---------- */
.lx-footer{
  margin-top:72px;
  padding:42px 0 24px;
  color:rgba(255,255,255,.82);
  background:#08263e;
}

.lx-footer-inner{
  width:min(1320px,calc(100% - 40px));
  margin:0 auto;
  display:grid;
  grid-template-columns:1.2fr .8fr .8fr;
  gap:36px;
}

.lx-footer h4{
  margin:0 0 .75rem;
  color:#fff;
}

.lx-footer p,
.lx-footer a{
  color:rgba(255,255,255,.68);
  font-size:.9rem;
}

.lx-footer a{text-decoration:none}
.lx-footer a:hover{color:#fff}

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

.lx-footer li{margin:.45rem 0}

.lx-footer-bottom{
  width:min(1320px,calc(100% - 40px));
  margin:26px auto 0;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.1);
  color:rgba(255,255,255,.55);
  font-size:.8rem;
}

/* ---------- Legacy blog compatibility ---------- */
/* Add blog-pro.css to the four existing article files.
   This overrides the washed-out hero without rewriting them. */
body.blog{
  background:
    radial-gradient(circle at 10% 4%,rgba(83,201,230,.15),transparent 30rem),
    linear-gradient(180deg,#f8fcff,#eef8fc);
}

body.blog .blog-page{
  width:min(1320px,calc(100% - 40px));
  margin:0 auto;
  padding:122px 0 72px;
}

body.blog header.blog-hero,
body.blog section.blog-hero{
  height:auto !important;
  min-height:330px;
  display:block;
  text-align:left;
  margin:0 0 28px;
  padding:clamp(30px,5vw,58px);
  overflow:hidden;
  border-radius:30px;
  color:#fff;
  background:
    radial-gradient(circle at 88% 18%,rgba(169,234,219,.30),transparent 24rem),
    linear-gradient(135deg,#0a2d49 0%,#145f91 56%,#46b9b8 100%) !important;
  box-shadow:var(--lx-shadow);
}

body.blog header.blog-hero::before,
body.blog section.blog-hero::before{
  content:none !important;
}

body.blog .blog-hero h1,
body.blog .blog-hero h2,
body.blog .blog-hero p,
body.blog .blog-hero .blog-meta,
body.blog .blog-hero .breadcrumb,
body.blog .blog-hero .breadcrumb a{
  position:relative;
  z-index:2;
  color:#fff !important;
  opacity:1 !important;
  text-shadow:none !important;
}

body.blog .blog-hero h1{
  max-width:980px;
  font-size:clamp(2.45rem,4.6vw,4.9rem);
  line-height:1;
  letter-spacing:-.05em;
}

body.blog .blog-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) 330px;
  gap:28px;
  align-items:start;
}

body.blog .blog-content,
body.blog .blog-sidebar{
  border:1px solid var(--lx-line);
  border-radius:24px;
  background:rgba(255,255,255,.94);
  box-shadow:var(--lx-shadow-soft);
}

body.blog .blog-content{
  padding:clamp(28px,4.2vw,56px);
}

body.blog .blog-sidebar{
  padding:22px;
}

body.blog .blog-callout{
  border-radius:16px;
  border:1px solid rgba(20,95,145,.14);
  background:linear-gradient(135deg,rgba(83,201,230,.10),rgba(169,234,219,.15));
}

/* ---------- Reveal and motion ---------- */
.lx-reveal{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .72s ease,transform .72s cubic-bezier(.2,.7,.2,1);
}

.lx-reveal.is-visible{
  opacity:1;
  transform:none;
}

.lx-reveal[data-delay="1"]{transition-delay:.08s}
.lx-reveal[data-delay="2"]{transition-delay:.16s}
.lx-reveal[data-delay="3"]{transition-delay:.24s}

@keyframes lxFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(16px)}
}

@keyframes lxSpin{
  to{transform:rotate(360deg)}
}

@keyframes lxKenBurns{
  from{transform:scale(1)}
  to{transform:scale(1.06)}
}

@keyframes lxGradient{
  0%,100%{background-position:0 50%}
  50%{background-position:100% 50%}
}

/* ---------- Responsive ---------- */
@media (max-width:1050px){
  .lx-index-hero,
  .lx-article-hero{
    grid-template-columns:1fr;
  }

  .lx-hero-panel{min-height:230px}
  .lx-hero-visual{min-height:380px}
  .lx-article-shell,
  body.blog .blog-layout{
    grid-template-columns:1fr;
  }

  .lx-sidebar{
    position:static;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .lx-card--wide,
  .lx-card--narrow{
    grid-column:span 6;
  }

  .lx-card--third{
    grid-column:span 6;
  }
}

@media (max-width:760px){
  .lx-blog-main,
  body.blog .blog-page{
    width:min(100% - 24px,1320px);
    padding-top:98px;
  }

  body.lx-blog nav{padding:12px 16px}

  .lx-index-hero,
  .lx-article-hero{
    padding:28px 22px;
    border-radius:24px;
  }

  .lx-index-hero h1,
  .lx-article-hero h1{
    font-size:clamp(2.3rem,12vw,3.7rem);
  }

  .lx-hero-visual{min-height:300px}

  .lx-provider-chip{
    left:12px;
    right:12px;
    max-width:none;
  }

  .lx-section-head{
    align-items:start;
    flex-direction:column;
    margin-top:46px;
  }

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

  .lx-card--wide,
  .lx-card--narrow,
  .lx-card--third{
    grid-column:auto;
  }

  .lx-card{min-height:380px}

  .lx-notes-grid{grid-template-columns:1fr}
  .lx-feature-list{grid-template-columns:1fr}
  .lx-sidebar{grid-template-columns:1fr}

  .lx-article{
    padding:26px 20px;
    border-radius:20px;
  }

  .lx-cta-band{
    align-items:flex-start;
    flex-direction:column;
    padding:24px;
  }

  .lx-footer-inner{
    grid-template-columns:1fr;
  }

  body.blog header.blog-hero,
  body.blog section.blog-hero{
    border-radius:22px;
    padding:28px 22px;
  }
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}

  .lx-orbit,
  .lx-hero-photo img,
  .lx-cta-band{
    animation:none !important;
  }

  .lx-reveal{
    opacity:1;
    transform:none;
    transition:none;
  }

  .lx-card,
  .lx-card-media img,
  .lx-btn,
  .lx-arrow,
  .lx-article-figure img{
    transition:none;
  }
}

/* ---------- Provider image collage on the blog landing page ---------- */

.lx-hero-collage{
  position:relative;
  min-height:330px;
  perspective:1100px;
}

.lx-collage-card{
  position:absolute;
  overflow:hidden;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.24);
  background:linear-gradient(135deg,#dbeef6,#b9dce8);
  box-shadow:0 24px 55px rgba(0,0,0,.2);
  transition:transform .45s cubic-bezier(.2,.75,.2,1), box-shadow .45s ease;
}

.lx-collage-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform 1s cubic-bezier(.2,.75,.2,1);
}

.lx-collage-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 48%,rgba(5,31,51,.76));
  pointer-events:none;
}

.lx-collage-card span{
  position:absolute;
  z-index:2;
  left:16px;
  bottom:14px;
  color:#fff;
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.05em;
}

.lx-collage-card--star{
  width:58%;
  height:68%;
  left:0;
  top:12%;
  transform:rotate(-5deg);
}

.lx-collage-card--excel{
  width:55%;
  height:62%;
  right:0;
  top:0;
  transform:rotate(5deg);
}

.lx-collage-card--oracle{
  width:58%;
  height:58%;
  right:10%;
  bottom:0;
  transform:rotate(-1deg);
}

.lx-hero-collage:hover .lx-collage-card--star{
  transform:translate(-6px,-7px) rotate(-6deg);
}

.lx-hero-collage:hover .lx-collage-card--excel{
  transform:translate(7px,-8px) rotate(6deg);
}

.lx-hero-collage:hover .lx-collage-card--oracle{
  transform:translateY(7px) rotate(1deg);
}

.lx-hero-collage:hover img{
  transform:scale(1.05);
}

/* ---------- Editorial visual used on non-provider workflow articles ---------- */

.lx-topic-visual{
  position:relative;
  min-height:380px;
  display:grid;
  place-items:center;
}

.lx-topic-ring{
  position:absolute;
  width:min(330px,86%);
  aspect-ratio:1;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.22);
  box-shadow:
    0 0 0 28px rgba(255,255,255,.045),
    0 0 0 56px rgba(255,255,255,.025);
  animation:lxSpin 28s linear infinite;
}

.lx-topic-ring::before,
.lx-topic-ring::after{
  content:"";
  position:absolute;
  width:17px;
  aspect-ratio:1;
  border-radius:50%;
  background:var(--lx-mint);
  box-shadow:0 0 24px rgba(169,234,219,.75);
}

.lx-topic-ring::before{left:48px;top:12px}
.lx-topic-ring::after{right:34px;bottom:20px}

.lx-topic-stack{
  position:relative;
  z-index:2;
  width:min(315px,92%);
  display:grid;
  gap:12px;
}

.lx-topic-card{
  padding:17px 18px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.11);
  box-shadow:0 15px 40px rgba(0,0,0,.12);
  backdrop-filter:blur(13px);
}

.lx-topic-card:nth-child(2){transform:translateX(18px)}
.lx-topic-card:nth-child(3){transform:translateX(-12px)}

.lx-topic-card strong,
.lx-topic-card span{
  display:block;
}

.lx-topic-card strong{
  margin-bottom:.18rem;
  color:#fff;
  font-size:.95rem;
}

.lx-topic-card span{
  color:rgba(255,255,255,.72);
  font-size:.78rem;
}

/* ---------- Static article and legacy content details ---------- */

.lx-article .blog-callout{
  margin:1.7rem 0;
  padding:20px 22px;
  border-radius:17px;
  border:1px solid rgba(20,95,145,.15);
  background:linear-gradient(135deg,rgba(83,201,230,.10),rgba(169,234,219,.16));
}

.lx-article .blog-callout h3{
  margin:0 0 .45rem;
  color:var(--lx-navy);
}

.lx-article .blog-callout p:last-child{
  margin-bottom:0;
}

.lx-article ul{
  padding-left:1.3rem;
}

.lx-article li{
  margin:.45rem 0;
}

.lx-article .btn,
.lx-article .btn-modern,
.lx-article .btn-blog-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:.75rem 1.05rem;
  border-radius:999px;
  color:#fff;
  background:linear-gradient(135deg,var(--lx-blue),var(--lx-teal));
  text-decoration:none;
  box-shadow:0 12px 28px rgba(20,95,145,.2);
}

.lx-related-links{
  display:grid;
  gap:9px;
}

.lx-related-links a{
  display:block;
  padding:11px 12px;
  border-radius:12px;
  color:var(--lx-navy);
  background:#f4f9fc;
  border:1px solid var(--lx-line);
  text-decoration:none;
  font-size:.86rem;
  font-weight:700;
  transition:.2s ease;
}

.lx-related-links a:hover{
  transform:translateX(3px);
  background:#edf8fb;
}

.lx-source-link{
  display:inline-flex;
  margin-top:.55rem;
  color:var(--lx-blue);
  font-weight:800;
  text-decoration:none;
}

.lx-source-link:hover{
  text-decoration:underline;
}

.lx-image-fallback{
  display:grid!important;
  place-items:center;
  min-height:100%;
  padding:24px;
  text-align:center;
  color:#fff;
  background:
    radial-gradient(circle at 80% 15%,rgba(169,234,219,.34),transparent 14rem),
    linear-gradient(135deg,#0b2e4b,#145f91,#46b9b8);
}

.lx-image-fallback strong{
  display:block;
  font-size:1.35rem;
}

.lx-image-fallback span{
  display:block;
  margin-top:.35rem;
  color:rgba(255,255,255,.72);
  font-size:.82rem;
}

.lx-provider-source{
  margin-top:1.7rem;
  padding-top:1rem;
  border-top:1px solid var(--lx-line);
  color:var(--lx-muted);
  font-size:.8rem;
}

.lx-provider-source a{
  color:var(--lx-blue);
}

@media(max-width:760px){
  .lx-hero-collage{min-height:285px}
  .lx-topic-visual{min-height:300px}
  .lx-topic-card:nth-child(2),
  .lx-topic-card:nth-child(3){transform:none}
}



/* =========================================================
   V4 refinements
   ========================================================= */

/* Remove the soft decorative circles from the blog hero. */
.lx-index-hero::before,
.lx-index-hero::after{
  content:none!important;
  display:none!important;
}

/* Keep every card perfectly rounded during hover and image scaling. */
.lx-card{
  overflow:hidden;
  border-radius:var(--lx-radius-lg);
  clip-path:inset(0 round var(--lx-radius-lg));
  -webkit-mask-image:-webkit-radial-gradient(white,black);
  transform:translateZ(0);
  backface-visibility:hidden;
}

.lx-card:hover{
  transform:translateY(-7px);
}

.lx-card-media,
.lx-card-media img,
.lx-card-overlay,
.lx-card-content{
  border-radius:inherit;
}

.lx-card-media,
.lx-card-overlay{
  overflow:hidden;
}

/* Stable hover animation without 3D corner artifacts. */
.lx-card:hover .lx-card-media img{
  transform:scale(1.045);
}

/* Fourth card in the opening collage. */
.lx-collage-card--wu{
  width:48%;
  height:55%;
  left:12%;
  bottom:-1%;
  transform:rotate(3deg);
}

.lx-hero-collage:hover .lx-collage-card--wu{
  transform:translate(-2px,7px) rotate(4deg);
}

/* Branded visual panels for providers without reusable photography. */
.lx-brand-hero{
  position:relative;
  overflow:hidden;
  min-height:410px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:34px;
  border-radius:26px;
  border:1px solid rgba(255,255,255,.22);
  box-shadow:0 24px 55px rgba(0,0,0,.20);
  isolation:isolate;
}

.lx-brand-hero::before{
  content:"";
  position:absolute;
  inset:20px;
  z-index:-1;
  border:1px solid rgba(255,255,255,.14);
  border-radius:20px;
}

.lx-brand-hero::after{
  content:"";
  position:absolute;
  width:230px;
  height:230px;
  right:-70px;
  top:-70px;
  z-index:-1;
  background:linear-gradient(135deg,rgba(255,255,255,.18),transparent);
  transform:rotate(35deg);
}

.lx-brand-hero__eyebrow{
  margin-bottom:auto;
  color:rgba(255,255,255,.72);
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.lx-brand-hero__mark{
  display:block;
  color:#fff;
  font-size:clamp(4rem,9vw,7.6rem);
  line-height:.82;
  letter-spacing:-.08em;
}

.lx-brand-hero__name{
  display:block;
  max-width:460px;
  margin-top:1rem;
  color:#fff;
  font-size:clamp(1.3rem,2.2vw,2rem);
  font-weight:800;
  line-height:1.1;
}

.lx-brand-hero__line{
  display:block;
  width:88px;
  height:4px;
  margin-top:1.1rem;
  border-radius:999px;
  background:#fff;
  opacity:.6;
}

.lx-brand-hero--cppc{
  background:
    linear-gradient(145deg,rgba(5,30,53,.12),rgba(5,30,53,.6)),
    linear-gradient(135deg,#274c77,#6096ba,#a3cef1);
}

.lx-brand-hero--lienscripts{
  background:
    linear-gradient(145deg,rgba(5,30,53,.08),rgba(5,30,53,.5)),
    linear-gradient(135deg,#063c4a,#0f7c83,#39b9a7);
}

.lx-brand-hero--rams{
  background:
    linear-gradient(145deg,rgba(5,30,53,.12),rgba(5,30,53,.55)),
    linear-gradient(135deg,#203a43,#2c5364,#4f8a8b);
}

/* Brand-only media cards on the blog index. */
.lx-brand-card{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:28px;
  color:#fff;
  border-radius:inherit;
  overflow:hidden;
}

.lx-brand-card::before{
  content:"";
  position:absolute;
  inset:18px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:18px;
}

.lx-brand-card__mark{
  position:relative;
  z-index:1;
  margin-bottom:auto;
  font-size:clamp(3.4rem,7vw,6.3rem);
  line-height:.85;
  font-weight:800;
  letter-spacing:-.07em;
}

.lx-brand-card__name{
  position:relative;
  z-index:1;
  max-width:85%;
  font-size:1.25rem;
  font-weight:800;
  line-height:1.15;
}

.lx-brand-card--cppc{
  background:linear-gradient(135deg,#274c77,#6096ba,#a3cef1);
}

.lx-brand-card--lienscripts{
  background:linear-gradient(135deg,#063c4a,#0f7c83,#39b9a7);
}

.lx-brand-card--rams{
  background:linear-gradient(135deg,#203a43,#2c5364,#4f8a8b);
}

/* Small logo treatment within provider cards. */
.lx-card-logo{
  position:absolute;
  top:20px;
  left:20px;
  z-index:4;
  display:grid;
  place-items:center;
  min-width:110px;
  max-width:170px;
  height:52px;
  padding:9px 12px;
  border-radius:14px;
  background:rgba(255,255,255,.92);
  box-shadow:0 10px 24px rgba(5,28,46,.18);
  backdrop-filter:blur(10px);
}

.lx-card-logo img{
  width:100%;
  height:100%;
  object-fit:contain;
}

/* Slightly denser provider grid on large screens. */
.lx-card--quarter{
  grid-column:span 3;
  min-height:335px;
}

@media(max-width:1100px){
  .lx-card--quarter{grid-column:span 6}
}

@media(max-width:760px){
  .lx-card--quarter{grid-column:auto}
  .lx-collage-card--wu{
    width:46%;
    height:51%;
    left:8%;
    bottom:1%;
  }
  .lx-brand-hero{min-height:320px}
}


/* =========================================================
   FINAL POLISH — smoother CTA, contained logos, footer logo,
   Anna cover fit, Oracle image presentation
   ========================================================= */

/* Softer CTA button inside article bands */
.lx-cta-band .lx-btn,
.lx-cta-band .lx-btn-secondary{
  min-height:52px !important;
  padding:.85rem 1.08rem .85rem 1.22rem !important;
  border-radius:999px !important;
  color:#12344c !important;
  background:rgba(255,255,255,.82) !important;
  border:1px solid rgba(255,255,255,.55) !important;
  box-shadow:0 10px 28px rgba(4,27,45,.12) !important;
  transform:translateY(0) scale(1) !important;
  transition:
    transform .38s cubic-bezier(.22,.8,.25,1),
    box-shadow .38s ease,
    background-color .38s ease,
    color .38s ease !important;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}

.lx-cta-band .lx-btn:hover,
.lx-cta-band .lx-btn-secondary:hover{
  transform:translateY(-2px) scale(1.006) !important;
  background:rgba(255,255,255,.94) !important;
  box-shadow:0 16px 38px rgba(4,27,45,.16) !important;
}

.lx-cta-band .lx-arrow{
  width:28px !important;
  height:28px !important;
  color:#145f91 !important;
  background:rgba(20,95,145,.09) !important;
  box-shadow:none !important;
  transition:
    transform .38s cubic-bezier(.22,.8,.25,1),
    background-color .38s ease !important;
}

.lx-cta-band .lx-btn:hover .lx-arrow{
  transform:translateX(2px) !important;
  background:rgba(20,95,145,.14) !important;
}

/* Footer logo: never stretch the LIENEX logo */
.lx-footer img[alt="LIENEX"],
.lx-footer .lx-lienex-logo{
  display:block !important;
  width:auto !important;
  height:46px !important;
  max-width:170px !important;
  max-height:46px !important;
  object-fit:contain !important;
  object-position:left center !important;
  image-rendering:auto;
}

/* Card hover should be soft on every featured/resource card */
.lx-card{
  border-radius:26px !important;
  overflow:hidden !important;
  isolation:isolate;
  transform:translateY(0) scale(1);
  transform-origin:center;
  will-change:transform, box-shadow;
  clip-path:inset(0 round 26px) !important;
  transition:
    transform .46s cubic-bezier(.18,.78,.25,1),
    box-shadow .46s ease,
    border-color .46s ease !important;
}

.lx-card:hover{
  transform:translateY(-8px) scale(1.008) !important;
  border-radius:26px !important;
  border-color:rgba(83,201,230,.34) !important;
  box-shadow:
    0 28px 66px rgba(9,42,68,.18),
    0 8px 24px rgba(9,42,68,.11) !important;
}

.lx-card::after{
  content:"";
  position:absolute;
  z-index:5;
  top:-40%;
  left:-85%;
  width:38%;
  height:180%;
  pointer-events:none;
  opacity:0;
  background:linear-gradient(
    110deg,
    transparent 0%,
    rgba(255,255,255,.06) 28%,
    rgba(255,255,255,.26) 50%,
    rgba(255,255,255,.06) 72%,
    transparent 100%
  );
  transform:rotate(10deg);
  transition:
    left .9s cubic-bezier(.2,.72,.22,1),
    opacity .35s ease;
}

.lx-card:hover::after{
  left:145%;
  opacity:1;
}

.lx-card .lx-card-media img{
  transition:
    transform 1.05s cubic-bezier(.18,.78,.25,1),
    filter .55s ease !important;
}

.lx-card:hover .lx-card-media img{
  transform:scale(1.048) !important;
  filter:saturate(1.04) contrast(1.025);
}

.lx-card .lx-card-content{
  z-index:4;
  transition:transform .46s cubic-bezier(.18,.78,.25,1);
}

.lx-card:hover .lx-card-content{
  transform:translateY(-3px);
}

.lx-card:hover .lx-card-link::after{
  transform:translateX(5px);
}

/* Keep the logo boxes classy and small instead of dominating the card */
.lx-card-logo{
  position:absolute !important;
  top:22px !important;
  left:22px !important;
  z-index:6 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:auto !important;
  min-width:96px !important;
  max-width:156px !important;
  height:48px !important;
  padding:9px 12px !important;
  overflow:hidden !important;
  border:1px solid rgba(255,255,255,.58) !important;
  border-radius:14px !important;
  background:rgba(255,255,255,.95) !important;
  box-shadow:0 12px 28px rgba(4,27,45,.16) !important;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}

.lx-card-logo img{
  display:block !important;
  width:auto !important;
  height:auto !important;
  max-width:128px !important;
  max-height:30px !important;
  object-fit:contain !important;
  object-position:center !important;
  transform:none !important;
  filter:none !important;
}

.lx-card-logo--star{
  max-width:148px !important;
}

.lx-card-logo--star img{
  max-width:120px !important;
  max-height:28px !important;
}

.lx-card-logo--premier{
  max-width:154px !important;
}

.lx-card-logo--premier img{
  max-width:126px !important;
  max-height:32px !important;
}

.lx-card-logo--pacific{
  max-width:150px !important;
}

.lx-card-logo--pacific img{
  max-width:122px !important;
  max-height:31px !important;
}

.lx-card-logo--aamp{
  max-width:144px !important;
}

.lx-card-logo--aamp img{
  max-width:106px !important;
  max-height:32px !important;
}

.lx-card-logo-fallback{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:100%;
  color:#15344f;
  font-size:.7rem;
  font-weight:800;
  line-height:1.08;
  letter-spacing:.01em;
  text-align:center;
  text-transform:uppercase;
}

.lx-card-logo-fallback[hidden]{
  display:none !important;
}

/* Badges stay readable and do not fight logo boxes */
.lx-card .lx-card-badge{
  max-width:calc(100% - 10px);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.lx-card:has(.lx-card-logo) .lx-card-badge{
  margin-top:54px;
}

/* Anna book cover: show the full book instead of cutting it off */
.lx-book-cover-image,
.lx-card-media img[src*="9798870747545"],
.lx-hero-photo img[src*="9798870747545"]{
  object-fit:contain !important;
  object-position:center !important;
  padding:24px !important;
  background:
    radial-gradient(circle at 50% 12%,rgba(83,201,230,.14),transparent 20rem),
    linear-gradient(135deg,#08263e,#123b5a 58%,#0e5961) !important;
  transform:none !important;
}

.lx-card:hover .lx-card-media img[src*="9798870747545"],
.lx-card:hover .lx-book-cover-image{
  transform:scale(1.018) !important;
}

.lx-hero-photo:has(img[src*="9798870747545"]){
  background:
    radial-gradient(circle at 50% 18%,rgba(83,201,230,.16),transparent 22rem),
    linear-gradient(135deg,#08263e,#123b5a 58%,#0e5961) !important;
}

/* Oracle imaging photo: use the clean x-ray visual nicely */
.lx-card-media img[src*="Doctor-Looking-At-X-Ray-HP"],
.lx-hero-photo img[src*="Doctor-Looking-At-X-Ray-HP"]{
  object-position:center center !important;
}

/* Better spacing in quarter cards with a logo */
.lx-card--quarter{
  min-height:360px !important;
}

.lx-card--quarter .lx-card-content{
  padding-top:86px !important;
}

/* Avoid badge/text collisions on smaller cards */
.lx-card--quarter .lx-card-badge{
  font-size:.66rem !important;
  letter-spacing:.09em !important;
}

@media(max-width:760px){
  .lx-card-logo{
    top:18px !important;
    left:18px !important;
    height:44px !important;
    min-width:88px !important;
    max-width:138px !important;
    padding:8px 10px !important;
  }

  .lx-card-logo img{
    max-width:112px !important;
    max-height:28px !important;
  }

  .lx-card--quarter .lx-card-content{
    padding-top:78px !important;
  }

  .lx-book-cover-image,
  .lx-card-media img[src*="9798870747545"],
  .lx-hero-photo img[src*="9798870747545"]{
    padding:18px !important;
  }
}

@media(hover:none){
  .lx-card:hover{
    transform:none !important;
  }
}

@media(prefers-reduced-motion:reduce){
  .lx-card,
  .lx-card::after,
  .lx-card-content,
  .lx-card-media img,
  .lx-cta-band .lx-btn,
  .lx-cta-band .lx-arrow{
    transition:none !important;
  }

  .lx-card::after{
    display:none !important;
  }

  .lx-card:hover,
  .lx-cta-band .lx-btn:hover{
    transform:none !important;
  }
}
