:root{
  --bg:#f4f8fd;
  --panel:#ffffff;
  --panel-soft:#f8fbff;
  --line:#d7e6f7;
  --line-strong:#b7d7f6;
  --text:#102033;
  --muted:#5f718a;
  --blue:#0078d4;
  --blue2:#005a9e;
  --cyan:#10b7e8;
  --green:#16a34a;
  --amber:#f59e0b;
  --shadow:0 14px 40px rgba(23,70,120,.10);
  --shadow-soft:0 6px 18px rgba(23,70,120,.08);
  --radius:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:"Segoe UI",system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
  background:
    radial-gradient(circle at 70px 40px,rgba(0,120,212,.10),transparent 28%),
    radial-gradient(circle at 90% 5%,rgba(16,183,232,.13),transparent 25%),
    var(--bg);
  color:var(--text);
}
a{text-decoration:none;color:inherit}
img{max-width:100%;height:auto}
.topbar{
  height:58px;
  position:sticky;
  top:0;
  z-index:50;
  display:flex;
  align-items:center;
  gap:16px;
  padding:0 20px;
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line);
}
.hamburger{
  width:40px;height:40px;border:1px solid var(--line);
  border-radius:12px;background:#fff;color:var(--blue2);
  font-size:20px;box-shadow:var(--shadow-soft);cursor:pointer;
}
.brand{display:flex;align-items:center;gap:10px;min-width:190px;font-size:22px;font-weight:900;color:#0b2440}
.brand-badge{
  width:38px;height:38px;border-radius:12px;
  display:grid;place-items:center;
  background:linear-gradient(135deg,#0078d4,#60a5fa);
  color:white;font-weight:900;
  box-shadow:0 10px 26px rgba(0,120,212,.25);
}
.search{flex:1;max-width:760px;position:relative}
.search span{position:absolute;left:14px;top:10px;color:var(--blue2)}
.search input{
  width:100%;height:42px;border:1px solid var(--line-strong);
  background:#fff;border-radius:12px;padding:0 14px 0 40px;
  font:inherit;outline:none;box-shadow:var(--shadow-soft);
}
.top-icons{display:flex;align-items:center;gap:10px;margin-left:auto}
.top-icon-btn{
  width:40px;height:40px;border:1px solid var(--line);border-radius:12px;
  background:#fff;color:var(--blue2);box-shadow:var(--shadow-soft);cursor:pointer;
}
.avatar{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#0078d4,#60a5fa);color:#fff;font-weight:900}
.layout{display:grid;grid-template-columns:280px 1fr;min-height:calc(100vh - 58px)}
.sidebar{
  position:sticky;top:58px;height:calc(100vh - 58px);overflow:auto;
  background:rgba(255,255,255,.90);backdrop-filter:blur(18px);
  border-right:1px solid var(--line);padding:18px 12px;
}
.side-label{margin:22px 10px 9px;color:#6e829b;text-transform:uppercase;letter-spacing:.08em;font-size:12px}
.nav-item{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  min-height:42px;padding:10px 12px;border-radius:12px;color:#1a314d;font-size:14px;
}
.nav-item:hover,.nav-item.active{background:#e9f4ff;color:var(--blue2);box-shadow:inset 3px 0 0 var(--blue)}
.nav-left{display:flex;align-items:center;gap:10px;min-width:0}
.cat-count{background:#eaf5ff;color:var(--blue2);border:1px solid #bde0fb;border-radius:999px;min-width:28px;height:24px;display:grid;place-items:center;font-size:12px;font-weight:900}
.more-cats{display:none}.more-cats.open{display:block}
.toggle-btn{width:100%;height:38px;border:1px solid var(--line);background:#fff;color:var(--blue2);border-radius:12px;font-weight:800;cursor:pointer;margin-top:8px}
.main{padding:28px 32px 44px;min-width:0}
.page-wrap{max-width:1380px;margin:0 auto}
.breadcrumb{font-size:13px;color:#5c7188;margin-bottom:22px;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.breadcrumb a{color:var(--blue2)}
.current-section{background:#eaf5ff;border:1px solid #b9def8;color:var(--blue2);border-radius:999px;padding:3px 9px;font-weight:800}
.hero{
  display:grid;grid-template-columns:minmax(0,1.1fr) 390px;gap:24px;align-items:center;
  padding:38px;border:1px solid var(--line-strong);border-radius:24px;
  background:radial-gradient(circle at 88% 14%,rgba(0,120,212,.13),transparent 22%),linear-gradient(135deg,#ffffff 0%,#f4fbff 45%,#e8f5ff 100%);
  box-shadow:var(--shadow);overflow:hidden;margin-bottom:24px;
}
.kicker,.pill{display:inline-flex;border:1px solid #b9def8;color:var(--blue2);background:#eaf5ff;border-radius:999px;padding:8px 14px;font-weight:900;letter-spacing:.04em;font-size:12px;text-transform:uppercase}
h1{font-size:48px;line-height:1.08;margin:24px 0 14px;letter-spacing:-1.4px;color:#0b2440}
.hero-title-gradient{background:linear-gradient(90deg,#0b2440,#0078d4,#2f80ed);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p,.hero-main p{color:var(--muted);line-height:1.75;font-size:17px;max-width:740px}
.hero-actions{display:flex;gap:12px;margin-top:24px}
.btn,.primary,.secondary{
  height:44px;padding:0 18px;border-radius:12px;font-weight:800;display:inline-flex;align-items:center;gap:8px;cursor:pointer;
}
.btn.primary,.primary{border:0;background:linear-gradient(135deg,#0078d4,#2563eb);color:white;box-shadow:0 12px 24px rgba(0,120,212,.22)}
.btn.secondary,.secondary{background:#fff;border:1px solid var(--line-strong);color:var(--blue2)}
.hero-side-map{
  background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px;box-shadow:var(--shadow-soft);
}
.map-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;font-weight:900;color:var(--blue2)}
.map-path{display:grid;gap:10px}
.map-step{display:grid;grid-template-columns:38px 1fr;gap:10px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:14px;background:#f8fbff}
.map-step span:first-child{width:38px;height:38px;border-radius:12px;background:#eaf5ff;display:grid;place-items:center}
.map-step strong{display:block;font-size:14px}.map-step small{color:var(--muted)}
.home-feature-grid,.feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:22px 0}
.home-feature-card,.feature{
  display:grid;grid-template-columns:58px 1fr;gap:16px;align-items:center;
  min-height:122px;padding:20px;border-radius:18px;border:1px solid var(--line);background:#fff;box-shadow:var(--shadow-soft);transition:.15s;
}
.home-feature-card:hover,.feature:hover,.featured-article:hover,.news-card:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.feature-icon,.article-icon,.list-icon{
  width:56px;height:56px;border-radius:16px;background:#eaf5ff;color:var(--blue2);display:grid;place-items:center;font-size:25px;
}
.home-feature-card strong,.feature strong,.feature h3{display:block;margin:0 0 6px;color:#0b2440;font-size:17px}
.home-feature-card span,.feature p{color:var(--muted);line-height:1.5;font-size:14px;margin:0}
.content-grid,.content-layout{display:grid;grid-template-columns:minmax(0,1.45fr) 390px;gap:18px;margin-top:24px}
.panel{background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow-soft);overflow:hidden}
.panel-header,.panel-head{display:flex;justify-content:space-between;align-items:center;padding:20px 22px;border-bottom:1px solid var(--line)}
.panel-header h2,.panel-head h2{margin:0;font-size:24px;color:#0b2440}
.panel-header a,.panel-head a{display:none!important}
.eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--blue2);font-weight:900}
.featured-list{display:grid;gap:12px;padding:16px}
.featured-article{
  display:grid;grid-template-columns:58px minmax(0,1fr) 24px;gap:16px;align-items:start;
  padding:16px;border:1px solid var(--line);border-radius:16px;background:#fff;transition:.15s;
}
.featured-article h3{margin:0 0 7px;color:#0b2440;line-height:1.3}
.article-meta{display:flex;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:13px;margin-bottom:7px}
.article-category,.tag,.news-tag{display:inline-flex;width:max-content;padding:5px 9px;border-radius:999px;background:#eaf5ff;color:var(--blue2);border:1px solid #b9def8;font-size:12px;font-weight:900}
.article-summary{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.55;min-height:calc(1.55em * 2);max-height:calc(1.55em * 2);color:var(--muted);font-size:14px}
.article-arrow{color:var(--blue2);font-size:23px;font-weight:900}
.news-card{display:grid;grid-template-columns:1fr;gap:6px;padding:17px 20px;border-bottom:1px solid var(--line);transition:.15s}
.news-card strong{line-height:1.35;color:#0b2440}
.news-card span:not(.news-tag){color:var(--muted);font-size:13px}
.news-tag{background:#fff3d8;color:#946000;border-color:#f5d186}
.pagination{display:flex;align-items:center;justify-content:center;gap:12px;padding:16px;border-top:1px solid var(--line)}
.page-btn{height:36px;padding:0 14px;border:1px solid var(--line);background:#fff;border-radius:10px;color:var(--blue2);font-weight:800}
.start-panel,.accordion-panel{margin-top:22px;border:1px solid var(--line);border-radius:22px;background:#fff;box-shadow:var(--shadow-soft);overflow:hidden}
.accordion-trigger{width:100%;display:flex;justify-content:space-between;align-items:center;padding:22px;border:0;background:#fff;color:#0b2440;font:inherit;font-weight:900;font-size:22px;cursor:pointer}
.accordion-trigger small{display:block;color:var(--muted);font-size:14px;font-weight:400;margin-top:4px;text-align:left}
.accordion-content{display:none;padding:0 22px 22px}
.accordion-panel.open .accordion-content{display:block}
.start-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.start-grid a{display:grid;grid-template-columns:50px 1fr;gap:14px;align-items:center;padding:16px;border:1px solid var(--line);border-radius:16px;background:#f8fbff}
.start-grid span{width:50px;height:50px;border-radius:15px;background:#eaf5ff;display:grid;place-items:center;font-size:24px}
.start-grid strong{display:block}.start-grid small{display:block;margin-top:5px;color:var(--muted);line-height:1.4}
.article-layout{display:grid;grid-template-columns:minmax(0,900px) 340px;gap:24px;justify-content:center;align-items:start}
.article-shell{background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow-soft);padding:34px;max-width:900px;width:100%;overflow:hidden}
.article-title{font-size:42px;margin:14px 0;line-height:1.12}
.article-subtitle{font-size:18px;color:var(--muted);line-height:1.65;margin-bottom:20px}
.meta{display:flex;flex-wrap:wrap;gap:12px;color:var(--muted);font-size:14px;border-bottom:1px solid var(--line);padding-bottom:22px;margin-bottom:26px}
.article-body{font-size:17px;line-height:1.78;color:#243247}
.article-body h2{font-size:28px;margin:34px 0 12px;color:#0b2440}
.article-body h3{font-size:22px;color:#0b2440}
.article-body p{margin:0 0 18px}
.article-body img{display:block;margin:20px auto;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow-soft)}
.article-body pre{display:block;width:100%;overflow:auto;white-space:pre;background:#0f172a;color:#e5f2ff;border-radius:14px;padding:18px 20px;font-family:Consolas,Monaco,monospace;font-size:14px;line-height:1.65}
.right-rail{position:sticky;top:82px;display:grid;gap:18px}
.rail-item{display:grid;grid-template-columns:38px 1fr;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line)}
.rail-icon{width:34px;height:34px;border-radius:10px;background:#eaf5ff;color:var(--blue2);display:grid;place-items:center}
.related a{display:block;padding:14px 18px;border-bottom:1px solid var(--line)}
.related strong{display:block;font-size:14px;margin-bottom:4px}.related span{font-size:13px;color:var(--muted)}
.share-bottom{margin-top:32px;padding:16px;border:1px solid var(--line);border-radius:14px;background:#f8fbff;display:flex;gap:10px;flex-wrap:wrap;align-items:center;color:var(--muted)}
.share-btn{width:38px;height:38px;border:1px solid #b9d8ef;background:#fff;color:var(--blue2);border-radius:10px;display:grid;place-items:center}
.footer{margin-top:40px;color:var(--muted);font-size:13px}
.command-palette,.notification-panel{display:none}
body.menu-collapsed .sidebar{display:none}
body.menu-collapsed .layout{grid-template-columns:1fr}
@media(max-width:1180px){
  .layout{grid-template-columns:1fr}.sidebar{display:none}.hero,.content-grid,.content-layout,.article-layout{grid-template-columns:1fr}.right-rail{position:static}
  .home-feature-grid,.feature-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:720px){
  .main{padding:18px}.brand{min-width:auto}.search{display:none}.hero{padding:24px}.hero h1,h1,.article-title{font-size:34px}
  .home-feature-grid,.feature-grid,.start-grid{grid-template-columns:1fr}
  .featured-article{grid-template-columns:56px 1fr}.article-arrow{display:none}
}


/* v14 fixes */
.feature-grid{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  align-items:stretch;
}
.feature{
  min-height:128px;
  border:1px solid var(--line-strong);
  background:linear-gradient(135deg,#fff,#f8fbff);
}
.feature h3{margin:0 0 6px!important;color:#0b2440}
.feature p{font-size:14px}

.article-meta{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:8px;
}
.article-meta .article-category{order:3}
.article-meta span:not(.article-category){white-space:nowrap}

.news-card{
  display:block!important;
}
.news-card .news-line{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  color:var(--muted);
  font-size:13px;
  margin-top:6px;
}
.news-card .news-tag{
  font-size:11px;
  padding:4px 8px;
}

.accordion-panel .accordion-content{
  display:block!important;
}
.accordion-trigger span:last-child{display:none}
.sidebar .more-cats{
  display:none;
}
.sidebar .more-cats.open{
  display:block;
}
.about-profile,.contact-layout{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:24px;
}
.about-panel,.contact-panel{
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  padding:24px;
  box-shadow:var(--shadow-soft);
}
.about-panel h2,.contact-panel h2{margin-top:0}
.about-panel p,.about-panel li,.contact-panel p{color:var(--muted);line-height:1.65}
.contact-form{display:grid;gap:16px}
.form-row{display:grid;gap:7px}
.form-row label{font-weight:800;color:#243247}
.form-row input,.form-row select,.form-row textarea{
  width:100%;border:1px solid var(--line);border-radius:12px;min-height:42px;
  padding:10px 12px;font:inherit;background:#fff;
}
.form-row textarea{min-height:150px;resize:vertical}
.form-help{color:var(--muted);font-size:13px}

@media(max-width:1180px){
  .feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:760px){
  .feature-grid,.about-profile,.contact-layout{grid-template-columns:1fr!important}
}


/* v15 fixes */
.sidebar-greeting{
  padding:16px 18px;
  border:1px solid var(--line-strong);
  border-radius:18px;
  background:linear-gradient(135deg,#fff,#f1f8ff);
  margin:0 0 22px;
  box-shadow:var(--shadow-soft);
}
.sidebar-greeting .hello-line{
  display:flex;
  align-items:center;
  gap:8px;
  color:#263f5d;
  margin-bottom:8px;
}
.sidebar-greeting strong{
  color:var(--blue2);
  font-size:17px;
  line-height:1.25;
}
.home-feature-grid{
  display:none!important;
}
.login-panel{
  position:fixed;
  top:70px;
  right:18px;
  width:min(360px, calc(100vw - 32px));
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  box-shadow:var(--shadow);
  padding:18px;
  z-index:120;
  display:none;
}
.login-panel.open{display:block}
.login-panel h3{margin:0 0 12px}
.login-panel input{
  width:100%;
  min-height:42px;
  border:1px solid var(--line);
  border-radius:12px;
  padding:10px 12px;
  margin-bottom:10px;
  font:inherit;
}
.login-panel .btn{width:100%;justify-content:center}
.top-icon-btn:hover,.hamburger:hover{
  transform:translateY(-1px);
}
.notification-panel{
  position:fixed;
  top:70px;
  right:18px;
  width:min(420px, calc(100vw - 32px));
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  box-shadow:var(--shadow);
  z-index:110;
  overflow:hidden;
}
.notification-panel h3{
  margin:0;
  padding:16px 18px;
  border-bottom:1px solid var(--line);
}
.notification-panel a,.notification-panel .note-row{
  display:block;
  padding:14px 18px;
  border-bottom:1px solid var(--line);
}
.notification-panel strong{display:block;margin-bottom:4px}
.notification-panel span{color:var(--muted);font-size:13px}
.news-sidebar-list{
  display:grid;
  gap:10px;
  padding:14px;
}
.news-sidebar-list a{
  display:block;
  padding:12px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#f8fbff;
}
.news-sidebar-list strong{
  display:block;
  font-size:14px;
  margin-bottom:5px;
}
.news-sidebar-list span{
  color:var(--muted);
  font-size:13px;
}


/* v16 layout + page fixes */
.layout{grid-template-columns:260px 1fr!important}
.sidebar{width:260px!important}
.main{padding:22px 22px 42px!important}
.page-wrap{max-width:none!important;margin:0!important}
.nav-item{font-size:15.5px!important;min-height:45px!important}
.nav-left span:first-child{font-size:17px!important}
.side-label{font-size:12.5px!important}
.cat-count{font-size:12.5px!important;min-width:30px!important;height:25px!important}
.top-icons .top-icon-btn:not([data-action="login"]){display:none!important}

.content-card-grid,.card-grid,.tool-grid,.glossary-grid,.comparison-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  margin-top:22px;
}
.content-card,.article-card-page,.tool-card,.glossary-card,.comparison-card,.category-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  padding:22px;
  box-shadow:var(--shadow-soft);
}
.content-card h2,.tool-card h2,.glossary-card h2,.comparison-card h2,.category-card h3{margin-top:0;color:#0b2440}
.content-card p,.content-card li,.tool-card p,.glossary-card p,.comparison-card p,.category-card p{
  color:var(--muted);
  line-height:1.65;
}
.page-list{
  display:grid;
  gap:14px;
  margin-top:22px;
}
.page-list a{
  display:grid;
  grid-template-columns:56px 1fr 24px;
  gap:16px;
  align-items:center;
  padding:18px;
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  box-shadow:var(--shadow-soft);
  transition:.15s;
}
.page-list a:hover,.category-card:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.page-list .list-icon{
  width:56px;height:56px;border-radius:16px;background:#eaf5ff;color:var(--blue2);display:grid;place-items:center;font-size:25px;
}
.page-list strong{display:block;margin-bottom:5px;color:#0b2440}
.page-list span{color:var(--muted);font-size:14px}
.category-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  margin-top:22px;
}
.category-card{
  display:grid;
  grid-template-columns:56px 1fr;
  gap:16px;
  align-items:start;
  transition:.15s;
}
.category-card .article-icon{width:56px;height:56px}
.category-card h3{margin:0 0 7px;line-height:1.3}
.category-card .article-meta{margin:0 0 8px}
.category-card .article-summary{
  display:-webkit-box!important;
  -webkit-line-clamp:3!important;
  -webkit-box-orient:vertical!important;
  overflow:hidden!important;
  max-height:calc(1.55em * 3)!important;
}
.article-header-tag{display:none!important}
.quick-tag{
  display:inline-flex;
  width:max-content;
  padding:5px 9px;
  border-radius:999px;
  background:#eaf5ff;
  color:var(--blue2);
  border:1px solid #b9def8;
  font-size:12px;
  font-weight:900;
}
.share-btn{cursor:pointer}
@media(max-width:1180px){
  .layout{grid-template-columns:1fr!important}
  .sidebar{width:auto!important}
  .category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .content-card-grid,.card-grid,.tool-grid,.glossary-grid,.comparison-grid,.category-grid{grid-template-columns:1fr!important}
  .page-list a{grid-template-columns:48px 1fr}
}


/* v17 fixes */
.login-icon{
  font-size:20px!important;
}
body.menu-collapsed .layout{
  grid-template-columns:1fr!important;
}
body.menu-collapsed .sidebar{
  display:none!important;
}
body.menu-collapsed .main{
  padding-left:22px!important;
}
.quick-tag{
  text-decoration:none;
  cursor:pointer;
}
.quick-tag:hover{
  background:#dff1ff;
  border-color:#7ec7f3;
}
.contact-info-list{
  display:grid;
  gap:12px;
  margin-top:16px;
}
.contact-info-list div{
  padding:14px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#f8fbff;
}
.contact-info-list strong{
  display:block;
  color:#0b2440;
  margin-bottom:4px;
}
.contact-info-list span{
  color:var(--muted);
  line-height:1.55;
}


/* v18 fixes */
.article-layout{
  justify-content:stretch!important;
  grid-template-columns:minmax(0,1fr) 340px!important;
  gap:18px!important;
}
.article-shell{
  max-width:none!important;
}
.flashcard-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  margin-top:22px;
}
.flashcard{
  position:relative;
  min-height:220px;
  perspective:1000px;
}
.flashcard-inner{
  position:absolute;
  inset:0;
  transition:transform .45s;
  transform-style:preserve-3d;
}
.flashcard:hover .flashcard-inner{
  transform:rotateY(180deg);
}
.flashcard-front,.flashcard-back{
  position:absolute;
  inset:0;
  backface-visibility:hidden;
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  padding:22px;
  box-shadow:var(--shadow-soft);
}
.flashcard-front{
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.flashcard-front h2{
  margin:0;
  color:#0b2440;
}
.flashcard-front span{
  color:var(--blue2);
  font-weight:900;
  font-size:13px;
}
.flashcard-back{
  transform:rotateY(180deg);
  overflow:auto;
}
.flashcard-back p{
  color:var(--muted);
  line-height:1.6;
}
.flashcard-back a{
  color:var(--blue2);
  font-weight:800;
}
.external-ref-box{
  margin-top:26px;
  padding:18px;
  border:1px solid var(--line);
  border-left:4px solid var(--blue);
  border-radius:14px;
  background:#f8fbff;
}
.external-ref-box a{
  color:var(--blue2);
  font-weight:800;
  overflow-wrap:anywhere;
}
.path-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  margin-top:22px;
}
.path-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  padding:22px;
  box-shadow:var(--shadow-soft);
  transition:.15s;
}
.path-card:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow);
}
.path-card h2{
  margin-top:0;
  color:#0b2440;
}
.path-card p{
  color:var(--muted);
  line-height:1.65;
}
@media(max-width:1180px){
  .article-layout{grid-template-columns:1fr!important}
  .flashcard-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .flashcard-grid,.path-grid{grid-template-columns:1fr}
}


/* article v4 refinements */
.article-meta-line {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.article-meta-line strong {
  font-weight: 900;
  color: #102033;
}

.rail-inline {
  grid-template-columns: 38px 1fr;
  align-items: center;
}

.rail-inline > div {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.rail-inline strong {
  color: #102033;
}

.related-panel {
  margin-top: 18px;
}

.compact-related a {
  display: block;
  padding: 14px 18px;
  border-bottom: 1px solid var(--line);
}

.compact-related strong {
  display: block;
  margin-bottom: 5px;
  color: #102033;
  line-height: 1.35;
}

.compact-related span,
.rail-empty {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.5;
}

.rail-empty {
  padding: 14px 18px;
  margin: 0;
}


/* article v5 refinements */
.article-meta-line {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.article-meta-line strong {
  font-weight: 900;
  color: #102033;
}

.rail-inline {
  grid-template-columns: 38px 1fr;
  align-items: center;
}

.rail-inline > div {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.rail-inline strong {
  color: #102033;
}

.related-panel {
  margin-top: 18px;
}

.compact-related a {
  display: block;
  padding: 14px 18px;
  border-bottom: 1px solid var(--line);
}

.compact-related strong {
  display: block;
  margin-bottom: 5px;
  color: #102033;
  line-height: 1.35;
}

.compact-related span,
.rail-empty {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.5;
}

.rail-empty {
  padding: 14px 18px;
  margin: 0;
}


/* v7 category clean */
.category-hero-clean{
  grid-template-columns:1fr!important;
  min-height:auto!important;
}
.category-hero-clean h1{
  margin-bottom:14px;
}
.category-hero-clean p{
  max-width:900px;
}


/* v8 sidebar and azure image */
.sidebar-greeting{
  padding:16px 18px;
  border:1px solid var(--line-strong);
  border-radius:18px;
  background:linear-gradient(135deg,#fff,#f1f8ff);
  margin:0 0 18px;
  box-shadow:var(--shadow-soft);
}
.sidebar-greeting strong{
  display:block;
  font-size:18px;
  line-height:1.3;
  color:#0b2440;
}
.side-label strong{
  font-weight:900;
  color:#506784;
}
.sidebar-dynamic-list{
  display:grid;
  gap:4px;
}
.hero-azure-image{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:220px;
}
.hero-azure-image img{
  width:min(380px, 100%);
  max-height:260px;
  object-fit:contain;
  filter:drop-shadow(0 24px 34px rgba(0,97,190,.22));
}
.category-hero-visual{
  grid-template-columns:minmax(0,1fr) 420px!important;
}
@media(max-width:980px){
  .category-hero-visual{
    grid-template-columns:1fr!important;
  }
  .hero-azure-image{
    min-height:160px;
  }
}


/* v9 requested fixes */
.side-loading{
  color:var(--muted);
  font-size:14px;
  padding:10px 14px;
}
#sidebarMoreCategories{
  display:none;
}
#sidebarMoreCategories.open{
  display:grid;
}
.hero-cloud-console{
  position:relative;
  min-height:260px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.console-window{
  width:min(420px,100%);
  background:#0d1730;
  border:1px solid rgba(255,255,255,.16);
  border-radius:22px;
  box-shadow:0 24px 50px rgba(13,23,48,.28);
  padding:18px;
  transform:rotate(-1deg);
}
.console-top{
  display:flex;
  gap:8px;
  margin-bottom:16px;
}
.console-top span{
  width:11px;
  height:11px;
  border-radius:50%;
  background:#38bdf8;
}
.console-top span:nth-child(2){background:#60a5fa}
.console-top span:nth-child(3){background:#93c5fd}
.console-window pre{
  margin:0;
  color:#e8f4ff;
  font-size:15px;
  line-height:1.8;
  overflow:hidden;
}
.floating-pill{
  position:absolute;
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  padding:12px 16px;
  font-weight:900;
  color:#005a9e;
  box-shadow:var(--shadow-soft);
}
.pill-one{left:8%;top:18%}
.pill-two{left:2%;bottom:18%}
.pill-three{right:3%;bottom:24%}
.category-hero-clean,.category-hero-visual{
  display:none!important;
}
.login-panel{
  position:fixed;
  top:70px;
  right:22px;
  width:300px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  box-shadow:0 24px 60px rgba(15,35,60,.22);
  padding:18px;
  z-index:9999;
}
.login-panel input{
  width:100%;
  box-sizing:border-box;
  margin:8px 0;
  padding:12px;
  border:1px solid var(--line);
  border-radius:12px;
}
@media(max-width:980px){
  .hero-cloud-console{min-height:220px}
  .floating-pill{display:none}
}


/* v10 sidebar + login modal + hero visual */
.sidebar-greeting strong{
  font-size:18px;
}
.hero-saas-visual{
  position:relative;
  min-height:300px;
  display:grid;
  place-items:center;
  isolation:isolate;
}
.hero-saas-visual:before{
  content:"";
  position:absolute;
  width:360px;
  height:360px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(0,120,212,.20), rgba(0,120,212,0) 65%);
  filter:blur(2px);
  z-index:-1;
}
.visual-grid-card{
  position:absolute;
  background:rgba(255,255,255,.86);
  border:1px solid rgba(145,195,235,.8);
  border-radius:22px;
  box-shadow:0 24px 55px rgba(25,79,130,.18);
  backdrop-filter:blur(14px);
}
.main-metric{
  width:300px;
  min-height:150px;
  padding:26px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  transform:translateY(-8px);
}
.metric-kicker{
  display:inline-flex;
  width:max-content;
  padding:7px 12px;
  border-radius:999px;
  background:#e3f2ff;
  color:#005a9e;
  font-size:12px;
  font-weight:900;
  margin-bottom:12px;
}
.main-metric strong{
  font-size:30px;
  line-height:1.1;
  color:#0b2440;
}
.main-metric small,
.mini-card small{
  color:var(--muted);
  margin-top:8px;
}
.mini-card{
  width:150px;
  padding:17px;
  display:grid;
  gap:4px;
}
.mini-card span{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:#e9f5ff;
  font-size:22px;
}
.mini-card strong{
  color:#0b2440;
}
.mini-card.one{left:4%;top:14%}
.mini-card.two{right:2%;top:22%}
.mini-card.three{right:13%;bottom:7%}
.visual-pulse{
  position:absolute;
  width:18px;
  height:18px;
  border-radius:50%;
  background:#0078d4;
  left:48%;
  top:16%;
  box-shadow:0 0 0 12px rgba(0,120,212,.12),0 0 0 26px rgba(0,120,212,.06);
}
.login-modal-overlay{
  position:fixed;
  inset:0;
  display:grid;
  place-items:center;
  background:rgba(10,24,42,.42);
  backdrop-filter:blur(4px);
  z-index:10000;
}
.login-modal-overlay[hidden]{
  display:none!important;
}
.login-modal{
  width:min(420px, calc(100vw - 32px));
  background:#fff;
  border:1px solid var(--line);
  border-radius:24px;
  padding:26px;
  box-shadow:0 30px 80px rgba(10,24,42,.30);
  position:relative;
}
.login-close{
  position:absolute;
  top:14px;
  right:14px;
  width:34px;
  height:34px;
  border:1px solid var(--line);
  background:#f7fbff;
  border-radius:999px;
  cursor:pointer;
  font-size:22px;
}
.login-avatar{
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  border-radius:18px;
  background:#e6f4ff;
  font-size:30px;
  margin-bottom:12px;
}
.login-modal h2{
  margin:0 0 6px;
  color:#0b2440;
}
.login-modal p{
  margin:0 0 18px;
  color:var(--muted);
  line-height:1.5;
}
.login-modal label{
  display:block;
  font-weight:800;
  color:#0b2440;
  margin:12px 0 6px;
}
.login-modal input{
  width:100%;
  box-sizing:border-box;
  padding:13px 14px;
  border:1px solid var(--line);
  border-radius:14px;
  font-size:15px;
}
.login-modal .btn{
  width:100%;
  margin-top:16px;
  justify-content:center;
}
.login-modal small{
  display:block;
  margin-top:12px;
  color:var(--muted);
}
body.modal-open{
  overflow:hidden;
}
@media(max-width:980px){
  .hero-saas-visual{min-height:230px}
  .mini-card{display:none}
  .main-metric{position:relative;width:100%}
}


/* v11 sidebar ordered + expanded hero */
.nav-cat-icon{
  width:24px;
  display:inline-grid;
  place-items:center;
  font-size:18px;
}
.hero-saas-visual-wide{
  min-height:340px;
  overflow:visible;
}
.hero-saas-visual-wide .main-metric{
  width:360px;
  min-height:180px;
  padding:30px;
  z-index:2;
}
.hero-saas-visual-wide .main-metric strong{
  font-size:32px;
  max-width:310px;
}
.hero-saas-visual-wide .main-metric small{
  line-height:1.55;
}
.hero-saas-visual-wide .mini-card{
  width:175px;
  min-height:100px;
  padding:18px;
  z-index:3;
}
.hero-saas-visual-wide .mini-card.one{
  left:0%;
  top:7%;
}
.hero-saas-visual-wide .mini-card.two{
  right:0%;
  top:13%;
}
.hero-saas-visual-wide .mini-card.three{
  right:8%;
  bottom:2%;
}
.hero-saas-visual-wide .mini-card.four{
  left:6%;
  bottom:5%;
}
.hero-saas-visual-wide .visual-pulse{
  left:50%;
  top:8%;
}
@media(max-width:1180px){
  .hero-saas-visual-wide .mini-card{
    width:150px;
  }
  .hero-saas-visual-wide .main-metric{
    width:300px;
  }
}
@media(max-width:980px){
  .hero-saas-visual-wide{
    min-height:250px;
  }
  .hero-saas-visual-wide .main-metric{
    width:100%;
  }
}


/* v12 hero spacing + active sidebar */
.hero-saas-visual-wide{
  min-height:420px!important;
  overflow:visible!important;
  padding:18px!important;
}
.hero-saas-visual-wide:before{
  width:440px!important;
  height:440px!important;
}
.hero-saas-visual-wide .main-metric{
  width:330px!important;
  min-height:170px!important;
  padding:28px!important;
  z-index:1!important;
  transform:translateY(4px)!important;
}
.hero-saas-visual-wide .main-metric strong{
  font-size:28px!important;
  max-width:300px!important;
}
.hero-saas-visual-wide .mini-card{
  width:160px!important;
  min-height:98px!important;
  padding:18px!important;
  z-index:4!important;
}
.hero-saas-visual-wide .mini-card.one{
  left:-4%!important;
  top:0%!important;
}
.hero-saas-visual-wide .mini-card.two{
  right:-3%!important;
  top:4%!important;
}
.hero-saas-visual-wide .mini-card.four{
  left:-1%!important;
  bottom:0%!important;
}
.hero-saas-visual-wide .mini-card.three{
  right:3%!important;
  bottom:-2%!important;
}
.hero-saas-visual-wide .visual-pulse{
  left:50%!important;
  top:2%!important;
  z-index:2!important;
}
.nav-item.active,
.nav-item[aria-current="page"]{
  background:#e9f4ff!important;
  border-color:#9dd2ff!important;
  color:#005a9e!important;
  box-shadow:inset 3px 0 0 #0078d4;
}
.nav-item.active .cat-count,
.nav-item[aria-current="page"] .cat-count{
  background:#dff0ff!important;
  border-color:#9dd2ff!important;
  color:#005a9e!important;
}
@media(max-width:1180px){
  .hero-saas-visual-wide{
    min-height:360px!important;
  }
  .hero-saas-visual-wide .mini-card{
    width:145px!important;
  }
  .hero-saas-visual-wide .main-metric{
    width:290px!important;
  }
}
@media(max-width:980px){
  .hero-saas-visual-wide{
    min-height:250px!important;
  }
  .hero-saas-visual-wide .mini-card{
    display:none!important;
  }
  .hero-saas-visual-wide .main-metric{
    width:100%!important;
  }
}


/* v13 compact hero visual */
.hero{
  min-height:260px;
}
.hero-compact-stack{
  position:relative;
  min-height:230px;
  display:grid;
  place-items:center;
  overflow:visible;
}
.hero-compact-stack:before{
  content:"";
  position:absolute;
  width:300px;
  height:220px;
  border-radius:999px;
  background:radial-gradient(circle, rgba(0,120,212,.20), rgba(0,120,212,0) 68%);
  filter:blur(2px);
}
.compact-orb{
  position:absolute;
  width:112px;
  height:112px;
  border-radius:32px;
  display:grid;
  place-items:center;
  font-size:58px;
  font-weight:950;
  color:white;
  background:linear-gradient(135deg,#0078d4,#55a8f6);
  box-shadow:0 24px 50px rgba(0,120,212,.28);
  z-index:2;
}
.compact-card{
  position:absolute;
  min-width:178px;
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 16px;
  border:1px solid rgba(147,197,253,.85);
  border-radius:20px;
  background:rgba(255,255,255,.92);
  box-shadow:0 18px 38px rgba(18,67,118,.14);
  backdrop-filter:blur(12px);
  z-index:3;
}
.compact-card span{
  width:42px;
  height:42px;
  border-radius:14px;
  display:grid;
  place-items:center;
  background:#eaf6ff;
  font-size:22px;
}
.compact-card strong{
  display:block;
  color:#0b2440;
  font-weight:950;
}
.compact-card small{
  color:var(--muted);
  display:block;
  margin-top:3px;
}
.compact-card.card-a{
  left:2%;
  top:8%;
}
.compact-card.card-b{
  right:0;
  top:18%;
}
.compact-card.card-c{
  left:22%;
  bottom:2%;
}
@media(max-width:1180px){
  .hero-compact-stack{min-height:220px}
  .compact-card{min-width:150px}
  .compact-orb{width:96px;height:96px;font-size:48px}
}
@media(max-width:980px){
  .hero{min-height:auto}
  .hero-compact-stack{min-height:190px}
  .compact-card{display:none}
}


/* v14 login dropdown only + category counts */
.login-modal-overlay,
.login-modal,
.login-panel{
  display:none!important;
}
body.modal-open{
  overflow:auto!important;
}
.login-dropdown-panel{
  position:absolute;
  width:300px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:20px;
  padding:16px;
  box-shadow:0 24px 60px rgba(10,35,70,.22);
  z-index:10000;
}
.login-dropdown-panel[hidden]{
  display:none!important;
}
.login-dropdown-head{
  display:flex;
  gap:12px;
  align-items:center;
  margin-bottom:12px;
}
.login-dropdown-head strong{
  display:block;
  color:#0b2440;
}
.login-dropdown-head span{
  color:var(--muted);
  font-size:13px;
}
.login-avatar-small{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:#e8f4ff;
  font-size:22px;
}
.login-dropdown-panel label{
  display:block;
  font-weight:800;
  color:#0b2440;
  margin:10px 0 5px;
}
.login-dropdown-panel input{
  width:100%;
  box-sizing:border-box;
  padding:12px 13px;
  border:1px solid var(--line);
  border-radius:13px;
}
.login-dropdown-panel .btn{
  width:100%;
  margin-top:14px;
  justify-content:center;
}


/* v17 proposal: more visual, dynamic latest articles */
.latest-pro-panel{
  border:1px solid rgba(140,190,235,.9);
  background:linear-gradient(180deg,#ffffff 0%,#f8fcff 100%);
  overflow:hidden;
}
.latest-pro-head{
  background:linear-gradient(90deg,#ffffff 0%,#eef7ff 100%);
}
.latest-pro-grid{
  display:grid;
  gap:16px;
  padding:18px;
}
.article-card-pro{
  position:relative;
  display:grid;
  grid-template-columns:68px minmax(0,1fr) 34px;
  gap:18px;
  align-items:center;
  padding:18px;
  border:1px solid rgba(145,195,235,.85);
  border-radius:22px;
  background:
    radial-gradient(circle at 10% 10%, rgba(0,120,212,.10), transparent 30%),
    linear-gradient(135deg,#ffffff 0%,#f7fbff 100%);
  box-shadow:0 14px 34px rgba(22,74,130,.10);
  overflow:hidden;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.article-card-pro:before{
  content:"";
  position:absolute;
  inset:-80px auto auto -120px;
  width:220px;
  height:220px;
  background:linear-gradient(135deg, rgba(0,120,212,.18), rgba(255,255,255,0));
  transform:rotate(18deg);
  opacity:.65;
}
.article-card-pro:hover{
  transform:translateY(-4px);
  box-shadow:0 24px 50px rgba(22,74,130,.16);
  border-color:#75bfff;
}
.article-card-accent{
  position:absolute;
  left:0;
  top:18px;
  bottom:18px;
  width:5px;
  border-radius:0 999px 999px 0;
  background:linear-gradient(180deg,#0078d4,#60a5fa);
}
.article-card-icon{
  width:62px;
  height:62px;
  display:grid;
  place-items:center;
  border-radius:18px;
  background:#e8f4ff;
  font-size:30px;
  z-index:1;
  box-shadow:inset 0 0 0 1px rgba(117,191,255,.55);
}
.article-card-main{
  min-width:0;
  z-index:1;
}
.article-card-top,
.article-card-bottom{
  display:flex;
  gap:12px;
  align-items:center;
  flex-wrap:wrap;
  color:var(--muted);
  font-size:13px;
}
.article-pill{
  display:inline-flex;
  align-items:center;
  padding:5px 10px;
  border-radius:999px;
  background:#e2f2ff;
  color:#005a9e;
  border:1px solid #afd9ff;
  font-weight:900;
}
.article-card-pro h3{
  margin:8px 0 8px;
  font-size:20px;
  line-height:1.28;
  color:#0b2440;
}
.article-card-pro p{
  margin:0 0 10px;
  color:#526987;
  line-height:1.55;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.article-card-arrow{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:#eaf6ff;
  color:#005a9e;
  font-size:28px;
  font-weight:900;
  z-index:1;
}
.latest-pagination{
  padding:0 18px 18px;
}
@keyframes articleFadeUp{
  from{opacity:0; transform:translateY(10px)}
  to{opacity:1; transform:translateY(0)}
}
.hero-compact-stack .compact-orb{
  animation:azureFloat 5s ease-in-out infinite;
}
.compact-card{
  animation:softFloat 6s ease-in-out infinite;
}
.compact-card.card-b{animation-delay:.8s}
.compact-card.card-c{animation-delay:1.4s}
@keyframes azureFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-8px)}
}
@keyframes softFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-5px)}
}
@media(max-width:760px){
  .article-card-pro{
    grid-template-columns:52px minmax(0,1fr);
  }
  .article-card-arrow{
    display:none;
  }
  .article-card-icon{
    width:50px;
    height:50px;
    font-size:24px;
  }
}


/* v18 FORCE latest articles proposal + pagination */
.latest-pro-panel{
  border:1px solid rgba(140,190,235,.95)!important;
  background:linear-gradient(180deg,#ffffff 0%,#f5fbff 100%)!important;
  overflow:hidden!important;
  box-shadow:0 20px 55px rgba(18,74,130,.10)!important;
}
.latest-pro-head{
  background:linear-gradient(90deg,#ffffff 0%,#eaf6ff 100%)!important;
  border-bottom:1px solid var(--line)!important;
}
.latest-pro-grid{
  display:grid!important;
  gap:16px!important;
  padding:18px!important;
}
.article-card-pro{
  position:relative!important;
  display:grid;
  grid-template-columns:72px minmax(0,1fr) 36px!important;
  gap:18px!important;
  align-items:center!important;
  padding:18px 20px!important;
  border:1px solid rgba(145,195,235,.9)!important;
  border-radius:24px!important;
  background:radial-gradient(circle at 8% 15%, rgba(0,120,212,.12), transparent 32%),linear-gradient(135deg,#ffffff 0%,#f7fbff 100%)!important;
  box-shadow:0 16px 38px rgba(22,74,130,.11)!important;
  overflow:hidden!important;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease!important;
  text-decoration:none!important;
}
.article-card-pro:before{
  content:""!important;
  position:absolute!important;
  inset:-90px auto auto -120px!important;
  width:230px!important;
  height:230px!important;
  background:linear-gradient(135deg, rgba(0,120,212,.20), rgba(255,255,255,0))!important;
  transform:rotate(18deg)!important;
  opacity:.7!important;
}
.article-card-pro:hover{
  transform:translateY(-5px)!important;
  box-shadow:0 26px 58px rgba(22,74,130,.18)!important;
  border-color:#68baff!important;
}
.article-card-accent{
  position:absolute!important;
  left:0!important;
  top:18px!important;
  bottom:18px!important;
  width:5px!important;
  border-radius:0 999px 999px 0!important;
  background:linear-gradient(180deg,#0078d4,#60a5fa)!important;
}
.article-card-icon{
  width:64px!important;
  height:64px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:19px!important;
  background:#e7f4ff!important;
  font-size:30px!important;
  z-index:1!important;
  box-shadow:inset 0 0 0 1px rgba(117,191,255,.6)!important;
}
.article-card-main{min-width:0!important;z-index:1!important}
.article-card-top,.article-card-bottom{
  display:flex!important;
  gap:12px!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  color:var(--muted)!important;
  font-size:13px!important;
}
.article-pill{
  display:inline-flex!important;
  align-items:center!important;
  padding:5px 10px!important;
  border-radius:999px!important;
  background:#e2f2ff!important;
  color:#005a9e!important;
  border:1px solid #afd9ff!important;
  font-weight:900!important;
}
.article-card-pro h3{
  margin:8px 0!important;
  font-size:20px!important;
  line-height:1.28!important;
  color:#0b2440!important;
}
.article-card-pro p{
  margin:0 0 10px!important;
  color:#526987!important;
  line-height:1.55!important;
  display:-webkit-box!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
  overflow:hidden!important;
}
.article-card-arrow{
  width:34px!important;
  height:34px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:999px!important;
  background:#eaf6ff!important;
  color:#005a9e!important;
  font-size:28px!important;
  font-weight:900!important;
  z-index:1!important;
}
.latest-pagination{padding:0 18px 18px!important}
@keyframes articleFadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:760px){
  .article-card-pro{grid-template-columns:54px minmax(0,1fr)!important}
  .article-card-arrow{display:none!important}
  .article-card-icon{width:52px!important;height:52px!important;font-size:24px!important}
}


/* v19 restore latest + news two-column layout */
.home-content-grid{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 360px;
  gap:24px;
  align-items:start;
}
.news-side-panel{
  position:sticky;
  top:88px;
  overflow:hidden;
}
.news-list{
  display:grid;
}
.news-item{
  display:grid;
  gap:8px;
  padding:16px 18px;
  border-bottom:1px solid var(--line);
  text-decoration:none;
  background:linear-gradient(90deg,#fff,#f8fcff);
  transition:background .2s ease, transform .2s ease;
}
.news-item:hover{
  background:#eef7ff;
  transform:translateX(3px);
}
.news-tag{
  width:max-content;
  padding:5px 10px;
  border-radius:999px;
  border:1px solid #ffd08a;
  background:#fff7e8;
  color:#6b4b12;
  font-weight:900;
  font-size:12px;
}
.news-item strong{
  color:#0b2440;
  line-height:1.35;
  font-size:15px;
}
.news-item small{
  color:var(--muted);
}
@media(max-width:1120px){
  .home-content-grid{
    grid-template-columns:1fr;
  }
  .news-side-panel{
    position:static;
  }
}

/* v20 home carousel proposal */
.home-learning-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:24px;align-items:start}
.home-main-column{display:grid;gap:22px}
.latest-carousel-panel{background:#fff;border:1px solid rgba(145,195,235,.85);border-radius:24px;box-shadow:0 18px 45px rgba(15,66,120,.08);overflow:hidden}
.carousel-head{display:flex;justify-content:space-between;align-items:center;padding:22px 24px;border-bottom:1px solid var(--line);background:linear-gradient(90deg,#fff,#eef7ff)}
.carousel-head h2{margin:4px 0 0}
.carousel-actions{display:flex;gap:10px}
.carousel-btn{width:42px;height:42px;border-radius:999px;border:1px solid #b8dcff;background:#fff;color:#005a9e;font-size:30px;line-height:1;cursor:pointer;box-shadow:0 10px 24px rgba(15,66,120,.10)}
.carousel-btn:disabled{opacity:.35;cursor:not-allowed}
.carousel-shell{overflow:hidden;padding:22px}
.carousel-track{display:flex;gap:20px;transition:transform .42s cubic-bezier(.22,.9,.24,1);will-change:transform}
.carousel-card{min-width:calc((100% - 40px) / 3);border:1px solid var(--line);border-radius:20px;overflow:hidden;background:#fff;text-decoration:none;color:inherit;box-shadow:0 14px 30px rgba(15,66,120,.10);transition:transform .22s ease,box-shadow .22s ease}
.carousel-card:hover{transform:translateY(-6px);box-shadow:0 25px 50px rgba(15,66,120,.16)}
.carousel-visual{height:150px;position:relative;overflow:hidden}
.carousel-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(0deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:28px 28px;opacity:.8}
.carousel-badge{position:absolute;top:16px;left:16px;z-index:2;padding:7px 11px;border-radius:10px;background:#1689e8;color:white;font-weight:900;font-size:12px;text-transform:uppercase}
.carousel-big-icon{position:absolute;right:24px;bottom:18px;z-index:2;font-size:60px;filter:drop-shadow(0 14px 18px rgba(0,0,0,.22))}
.carousel-body{padding:18px}.carousel-date{color:var(--muted);font-size:13px}
.carousel-card h3{margin:10px 0 8px;color:#0b2440;line-height:1.28;font-size:19px}
.carousel-card p{color:#526987;line-height:1.55;margin:0 0 16px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.carousel-meta{display:flex;justify-content:space-between;align-items:center;color:#435773;font-size:13px}
.carousel-dots{display:flex;justify-content:center;gap:10px;padding:0 0 22px}
.carousel-dots button{width:10px;height:10px;border-radius:999px;border:0;background:#c7d4e6}.carousel-dots button.active{width:24px;background:#0078d4}
.learning-useful-panel{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:18px;border:1px solid rgba(145,195,235,.75);border-radius:22px;background:linear-gradient(90deg,#fff,#f4faff)}
.learning-tile{display:grid;grid-template-columns:42px 1fr;column-gap:12px;align-items:start}
.learning-tile span{grid-row:span 2;width:42px;height:42px;display:grid;place-items:center;border-radius:14px;background:#e8f4ff;font-size:24px}
.learning-tile strong{color:#0b2440}.learning-tile p{grid-column:2;margin:4px 0 0;color:var(--muted);font-size:13px;line-height:1.45}
.path-panel{border:1px solid rgba(145,195,235,.75);border-radius:22px;background:#fff;padding:20px}.path-head h2{margin:4px 0 16px}
.path-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.path-card{display:grid;gap:8px;padding:16px;border:1px solid var(--line);border-radius:18px;text-decoration:none;background:#f8fcff}
.path-card span{font-size:28px}.path-card strong{color:#0b2440}.path-card small{color:var(--muted)}
.home-news-column{min-width:0}
@media(max-width:1180px){.home-learning-grid{grid-template-columns:1fr}.carousel-card{min-width:calc((100% - 20px) / 2)}.learning-useful-panel,.path-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.carousel-card{min-width:100%}.learning-useful-panel,.path-grid{grid-template-columns:1fr}}

.carousel-bg-img{
  width:100%;
  height:100%;
  object-fit:contain;
  opacity:0.25;
}
.carousel-meta{
  display:flex;
  justify-content:space-between;
  font-size:12px;
  color:#666;
}

/* v22 SaaS carousel */
.saas-carousel-panel{
  position:relative;
  overflow:hidden;
  background:linear-gradient(180deg,#ffffff 0%,#f7fbff 100%)!important;
  border:1px solid rgba(141,196,244,.9)!important;
  box-shadow:0 22px 60px rgba(16,78,140,.10)!important;
}
.saas-carousel-panel:before{
  content:"";
  position:absolute;
  width:360px;
  height:360px;
  right:-120px;
  top:-150px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(0,120,212,.16), transparent 65%);
}
.saas-carousel-head{
  position:relative;
  z-index:1;
  background:linear-gradient(90deg,#fff,#eef7ff)!important;
}
.saas-carousel-head p{
  margin:6px 0 0;
  color:var(--muted);
  line-height:1.45;
}
.saas-card{
  min-width:calc((100% - 40px) / 3);
  border:1px solid rgba(177,213,247,.95);
  border-radius:24px;
  overflow:hidden;
  background:rgba(255,255,255,.92);
  text-decoration:none;
  color:inherit;
  box-shadow:0 18px 44px rgba(15,66,120,.12);
  transition:transform .24s ease, box-shadow .24s ease, border-color .24s ease;
}
.saas-card:hover{
  transform:translateY(-7px) scale(1.01);
  box-shadow:0 30px 68px rgba(15,66,120,.20);
  border-color:#65baff;
}
.saas-card-visual{
  height:162px;
  position:relative;
  overflow:hidden;
}
.saas-grid{
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px),
    linear-gradient(0deg,rgba(255,255,255,.06) 1px,transparent 1px);
  background-size:28px 28px;
}
.saas-card-visual:after{
  content:"";
  position:absolute;
  width:210px;
  height:210px;
  right:-55px;
  bottom:-85px;
  border-radius:50%;
  background:rgba(255,255,255,.16);
  filter:blur(1px);
}
.saas-badge,.saas-status{
  position:absolute;
  z-index:2;
  top:16px;
  padding:7px 11px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
}
.saas-badge{
  left:16px;
  color:white;
  background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.25);
  backdrop-filter:blur(8px);
  text-transform:uppercase;
}
.saas-status{
  right:16px;
  color:#08345f;
  background:#fff;
}
.saas-icon{
  position:absolute;
  right:24px;
  bottom:18px;
  z-index:2;
  font-size:64px;
  filter:drop-shadow(0 18px 20px rgba(0,0,0,.28));
}
.saas-card-body{
  padding:20px;
}
.saas-card-line{
  display:flex;
  justify-content:space-between;
  gap:12px;
  color:#005a9e;
  font-weight:900;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.saas-card h3{
  margin:10px 0 9px;
  color:#0b2440;
  font-size:20px;
  line-height:1.28;
}
.saas-card p{
  color:#536b88;
  line-height:1.55;
  margin:0 0 16px;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.saas-card-meta{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:center;
  padding-top:14px;
  border-top:1px solid #e5eef7;
  color:#506784;
  font-size:13px;
}
.saas-value-strip{
  box-shadow:0 18px 44px rgba(15,66,120,.08);
}
@media(max-width:1180px){
  .saas-card{min-width:calc((100% - 20px) / 2)}
}
@media(max-width:740px){
  .saas-card{min-width:100%}
}

/* v23 spacing fix */
.hero{
  padding-top: 30px !important;
  padding-bottom: 30px !important;
}
.hero h1{
  margin-top: 0 !important;
  margin-bottom: 10px !important;
}
.hero p{
  margin-bottom: 15px !important;
}

/* ideas sections */
.ideas-panel{
  margin-top:40px;
}
.ideas-panel h2{
  margin-bottom:20px;
}
.ideas-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:20px;
}
.idea-card{
  background:#fff;
  border-radius:16px;
  padding:20px;
  text-align:center;
  font-weight:600;
  box-shadow:0 10px 25px rgba(0,0,0,0.08);
  transition:.2s;
}
.idea-card:hover{
  transform:translateY(-5px);
}
.ideas-panel.dark{
  background:#0f172a;
  color:#fff;
  padding:30px;
  border-radius:20px;
}
.ideas-panel.dark .idea-card{
  background:#1e293b;
  color:#fff;
}


/* v24 full learning homepage */
[data-reveal]{
  opacity:0;
  transform:translateY(18px);
  transition:opacity .55s ease, transform .55s ease;
}
[data-reveal].is-visible{
  opacity:1;
  transform:translateY(0);
}

.section-title{
  margin-bottom:20px;
}
.section-title h2{
  margin:6px 0 8px;
  font-size:28px;
  color:#0b2440;
}
.section-title p{
  margin:0;
  color:var(--muted);
  max-width:760px;
  line-height:1.6;
}

.learning-roadmap{
  margin-top:26px;
  padding:26px;
  border:1px solid rgba(145,195,235,.8);
  border-radius:26px;
  background:linear-gradient(135deg,#ffffff 0%,#f3faff 100%);
  box-shadow:0 18px 48px rgba(15,66,120,.08);
}
.roadmap-line{
  position:relative;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
}
.roadmap-line:before{
  content:"";
  position:absolute;
  left:8%;
  right:8%;
  top:30px;
  height:3px;
  background:linear-gradient(90deg,#0078d4,#65baff);
  opacity:.35;
}
.roadmap-step{
  position:relative;
  z-index:1;
  display:grid;
  gap:8px;
  padding:18px;
  border:1px solid rgba(145,195,235,.85);
  border-radius:20px;
  background:rgba(255,255,255,.88);
  text-decoration:none;
  box-shadow:0 14px 34px rgba(15,66,120,.08);
  transition:transform .2s ease, box-shadow .2s ease;
}
.roadmap-step:hover{
  transform:translateY(-5px);
  box-shadow:0 24px 50px rgba(15,66,120,.14);
}
.step-number{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:16px;
  background:#0078d4;
  color:white;
  font-weight:950;
}
.roadmap-step strong{
  color:#0b2440;
  font-size:17px;
}
.roadmap-step small{
  color:var(--muted);
  line-height:1.45;
}

.smart-learning-grid{
  margin-top:24px;
  display:grid;
  grid-template-columns:1.35fr 1fr 1fr;
  gap:18px;
}
.smart-card{
  position:relative;
  padding:22px;
  min-height:180px;
  border:1px solid rgba(145,195,235,.8);
  border-radius:24px;
  background:#fff;
  box-shadow:0 16px 42px rgba(15,66,120,.08);
  overflow:hidden;
}
.smart-card.large{
  grid-row:span 2;
  background:linear-gradient(135deg,#0b2440,#0078d4);
  color:white;
}
.smart-card:before{
  content:"";
  position:absolute;
  right:-60px;
  top:-60px;
  width:170px;
  height:170px;
  border-radius:50%;
  background:rgba(0,120,212,.08);
}
.smart-card.large:before{
  background:rgba(255,255,255,.12);
}
.smart-icon{
  width:52px;
  height:52px;
  display:grid;
  place-items:center;
  border-radius:17px;
  background:#e8f4ff;
  font-size:28px;
  margin-bottom:14px;
}
.smart-card.large .smart-icon{
  background:rgba(255,255,255,.18);
}
.smart-card h3{
  margin:0 0 10px;
  color:#0b2440;
  font-size:22px;
}
.smart-card.large h3{
  color:white;
  font-size:28px;
}
.smart-card p{
  color:var(--muted);
  line-height:1.55;
  margin:0 0 16px;
}
.smart-card.large p{
  color:#dceeff;
}
.smart-card a{
  color:#0067b8;
  font-weight:900;
  text-decoration:none;
}
.smart-card.large a{
  color:white;
}

.exam-strip{
  margin-top:24px;
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:center;
  padding:26px;
  border-radius:26px;
  background:linear-gradient(135deg,#ffffff,#eef7ff);
  border:1px solid rgba(145,195,235,.8);
}
.exam-strip h2{
  margin:6px 0 8px;
  color:#0b2440;
}
.exam-strip p{
  margin:0;
  color:var(--muted);
  line-height:1.55;
}
.exam-pills{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:flex-end;
}
.exam-pills a{
  padding:12px 16px;
  border-radius:999px;
  background:white;
  border:1px solid #b8dcff;
  color:#005a9e;
  text-decoration:none;
  font-weight:950;
  box-shadow:0 10px 24px rgba(15,66,120,.08);
}

.community-band{
  margin-top:24px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 360px;
  gap:20px;
  align-items:center;
  padding:28px;
  border-radius:28px;
  background:linear-gradient(135deg,#0b2440,#0b5cab);
  color:white;
  box-shadow:0 24px 60px rgba(11,36,64,.20);
}
.community-copy h2{
  margin:6px 0 10px;
  color:white;
}
.community-copy p{
  margin:0;
  color:#dceeff;
  line-height:1.6;
}
.community-band .eyebrow{
  color:#c7e5ff;
}
.community-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}
.community-stats div{
  padding:18px;
  border-radius:20px;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.16);
  text-align:center;
}
.community-stats strong{
  display:block;
  font-size:30px;
  color:white;
}
.community-stats span{
  color:#dceeff;
  font-size:13px;
}

@media(max-width:1100px){
  .roadmap-line,
  .smart-learning-grid,
  .community-band{
    grid-template-columns:1fr 1fr;
  }
  .exam-strip{
    flex-direction:column;
    align-items:flex-start;
  }
  .exam-pills{
    justify-content:flex-start;
  }
}
@media(max-width:760px){
  .roadmap-line,
  .smart-learning-grid,
  .community-band,
  .community-stats{
    grid-template-columns:1fr;
  }
  .roadmap-line:before{
    display:none;
  }
}


/* v25 requested fixes */
/* Hide/remove old 4-card category strip if any duplicate survives */
.quick-routes,
.home-category-strip,
.category-strip,
.route-cards,
.feature-cards{
  display:none!important;
}

/* Make hero and carousel gradient tighter */
.hero{
  padding-top:22px!important;
  padding-bottom:22px!important;
  margin-bottom:18px!important;
}
.hero h1{
  margin-top:0!important;
  margin-bottom:10px!important;
}
.hero p{
  margin-bottom:14px!important;
}

.saas-carousel-panel,
.latest-carousel-panel{
  padding-bottom:0!important;
  background:linear-gradient(180deg,#ffffff 0%,#f7fbff 88%,#ffffff 100%)!important;
}
.carousel-shell{
  padding-bottom:16px!important;
}
.carousel-dots{
  padding:0 0 12px!important;
  margin-top:-2px!important;
}

/* Carousel metadata as readable row */
.saas-card-meta{
  display:grid!important;
  grid-template-columns:1fr 1fr 1fr;
  gap:8px!important;
  align-items:center!important;
}
.saas-card-meta span{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* Roadmap closer to top */
.learning-roadmap{
  margin-top:18px!important;
}

/* Smart grid after removing automation card */
.smart-learning-grid{
  grid-template-columns:1.35fr 1fr 1fr!important;
}
.smart-learning-grid .smart-card.large{
  grid-row:span 2;
}

/* Most viewed page */
.ranking-hero{
  padding:30px;
  border:1px solid rgba(145,195,235,.85);
  border-radius:26px;
  background:linear-gradient(135deg,#ffffff,#eef7ff);
  box-shadow:0 18px 48px rgba(15,66,120,.08);
  margin-bottom:22px;
}
.ranking-hero h1{
  margin:8px 0 10px;
  font-size:42px;
  color:#0b2440;
}
.ranking-hero p{
  margin:0;
  color:var(--muted);
  line-height:1.6;
  max-width:900px;
}
.ranking-panel{
  border:1px solid rgba(145,195,235,.85);
  border-radius:24px;
  background:#fff;
  overflow:hidden;
  box-shadow:0 18px 48px rgba(15,66,120,.08);
}
.ranking-controls{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  padding:18px;
  background:linear-gradient(90deg,#fff,#eef7ff);
  border-bottom:1px solid var(--line);
}
.ranking-filter{
  border:1px solid #b8dcff;
  background:#fff;
  color:#005a9e;
  border-radius:999px;
  padding:10px 14px;
  font-weight:900;
  cursor:pointer;
}
.ranking-filter.active{
  background:#0078d4;
  color:#fff;
  border-color:#0078d4;
}
.ranking-list{
  display:grid;
}
.ranking-item{
  display:grid;
  grid-template-columns:52px 54px minmax(0,1fr);
  gap:14px;
  align-items:center;
  padding:18px 20px;
  text-decoration:none;
  border-bottom:1px solid var(--line);
  background:#fff;
  transition:background .2s ease, transform .2s ease;
}
.ranking-item:hover{
  background:#f4faff;
  transform:translateX(4px);
}
.ranking-number{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:#e8f4ff;
  color:#005a9e;
  font-weight:950;
}
.ranking-icon{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:16px;
  background:#f0f8ff;
  font-size:26px;
}
.ranking-copy{
  min-width:0;
}
.ranking-copy strong{
  display:block;
  color:#0b2440;
  font-size:18px;
  line-height:1.35;
}
.ranking-copy small{
  display:block;
  color:#506784;
  margin-top:5px;
}
.ranking-copy em{
  display:block;
  color:var(--muted);
  margin-top:6px;
  font-style:normal;
  line-height:1.45;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

@media(max-width:900px){
  .saas-card-meta{
    grid-template-columns:1fr!important;
  }
  .ranking-item{
    grid-template-columns:42px minmax(0,1fr);
  }
  .ranking-icon{
    display:none;
  }
  .smart-learning-grid{
    grid-template-columns:1fr!important;
  }
}


/* v26 ranking and homepage fixes */
.ranking-breadcrumb{
  margin:0 0 18px!important;
  padding:10px 14px!important;
  width:max-content;
  max-width:100%;
  border:1px solid var(--line);
  border-radius:999px;
  background:#f7fbff;
}
.ranking-hero,
.ranking-panel{
  margin-left:0!important;
}
.ranking-pager{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:14px;
  padding:18px;
  border-top:1px solid var(--line);
  background:#f8fcff;
}
.smart-learning-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  align-items:stretch!important;
}
.smart-learning-grid .smart-card,
.smart-learning-grid .smart-card.large{
  grid-row:auto!important;
  min-height:230px!important;
  height:100%!important;
}
.smart-learning-grid .smart-card.large h3{
  font-size:22px!important;
}
.quick-routes,
.home-category-strip,
.category-strip,
.route-cards,
.feature-cards,
.home-routes,
.routes-grid{
  display:none!important;
}
@media(max-width:1100px){
  .smart-learning-grid{
    grid-template-columns:1fr!important;
  }
}


/* v27 lab page */
.lab-article{
  display:grid;
  gap:22px;
}
.lab-hero{
  padding:34px;
  border:1px solid rgba(145,195,235,.85);
  border-radius:28px;
  background:linear-gradient(135deg,#ffffff,#eef7ff);
  box-shadow:0 18px 48px rgba(15,66,120,.08);
}
.lab-hero h1{
  margin:8px 0 12px;
  font-size:44px;
  line-height:1.08;
  color:#0b2440;
}
.lab-hero p{
  max-width:900px;
  color:#506784;
  font-size:18px;
  line-height:1.65;
}
.lab-meta{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
}
.lab-meta span{
  padding:9px 13px;
  border:1px solid #b8dcff;
  border-radius:999px;
  background:#fff;
  color:#005a9e;
  font-weight:850;
}
.lab-card,
.lab-result{
  padding:26px;
  border:1px solid rgba(145,195,235,.85);
  border-radius:24px;
  background:#fff;
  box-shadow:0 14px 36px rgba(15,66,120,.07);
}
.lab-card h2,
.lab-result h2{
  margin:0 0 12px;
  color:#0b2440;
}
.lab-card p,
.lab-result p,
.lab-card li{
  color:#506784;
  line-height:1.65;
}
.lab-step{
  display:grid;
  grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
  gap:24px;
  align-items:start;
  padding:24px;
  border:1px solid rgba(145,195,235,.85);
  border-radius:26px;
  background:linear-gradient(135deg,#ffffff,#f7fbff);
  box-shadow:0 16px 42px rgba(15,66,120,.08);
}
.step-chip{
  display:inline-flex;
  padding:7px 11px;
  border-radius:999px;
  background:#0078d4;
  color:#fff;
  font-weight:950;
  margin-bottom:12px;
}
.lab-step h2{
  color:#0b2440;
  margin:0 0 12px;
}
.lab-step p{
  color:#506784;
  line-height:1.65;
}
.lab-step figure{
  margin:0;
}
.lab-step img{
  width:100%;
  border-radius:18px;
  border:1px solid #bfdcf5;
  box-shadow:0 18px 42px rgba(15,66,120,.13);
  background:#eef6ff;
}
.lab-step figcaption{
  color:#607795;
  font-size:13px;
  margin-top:10px;
}
.code-lite{
  padding:14px 16px;
  border-radius:16px;
  background:#0b1730;
  color:#e8f4ff;
  margin-top:14px;
  overflow:auto;
}
.code-lite code{
  color:#e8f4ff;
}
.lab-result{
  background:linear-gradient(135deg,#0b2440,#0b5cab);
  color:white;
}
.lab-result h2,
.lab-result p{
  color:white;
}
@media(max-width:980px){
  .lab-step{
    grid-template-columns:1fr;
  }
  .lab-hero h1{
    font-size:34px;
  }
}


/* v28 requested fixes */
section:has(.feature-card),
section:has(.route-card),
section:has(.quick-card){
  display:none!important;
}

/* Hide old 4 category row by content fallback classes */
.home-features,
.hero-routes,
.category-cards-row,
.home-quick-categories{
  display:none!important;
}

.vpn-lab-hero{
  background:
    radial-gradient(circle at 85% 20%, rgba(0,120,212,.18), transparent 32%),
    linear-gradient(135deg,#ffffff,#eef7ff)!important;
}


/* v30 fixes over v28 */
/* Force hide the 4 category cards row if any survives */
.home-features,
.hero-routes,
.category-cards-row,
.home-quick-categories,
.quick-routes,
.route-cards,
.feature-cards,
.home-feature-grid,
.quick-category-grid,
section:has(.feature-card),
section:has(.route-card),
section:has(.quick-card){
  display:none!important;
}

/* Certification block like requested screenshot */
.cert-collab-strip{
  padding:26px!important;
  border-radius:26px!important;
  background:linear-gradient(135deg,#ffffff,#eef7ff)!important;
  border:1px solid rgba(145,195,235,.85)!important;
  box-shadow:0 18px 48px rgba(15,66,120,.08)!important;
}
.cert-collab-strip h2{
  margin:6px 0 8px!important;
  color:#0b2440!important;
  font-size:26px!important;
}
.cert-collab-strip p{
  margin:0!important;
  color:#506784!important;
}
.cert-collab-strip .exam-pills a{
  font-size:17px!important;
  padding:13px 18px!important;
}

/* Community two boxes only */
.community-stats-two{
  grid-template-columns:repeat(2,1fr)!important;
}

/* Lab step: give text more presence and reduce empty feel */
.lab-step{
  grid-template-columns:minmax(0,1fr) minmax(0,1.05fr)!important;
  gap:22px!important;
}
.lab-step .step-copy{
  align-self:stretch;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
}
.lab-step .step-copy p,
.lab-step .step-copy li{
  font-size:16px!important;
  line-height:1.66!important;
}
.lab-step .step-copy ul{
  margin-top:6px!important;
  padding-left:20px!important;
}
.lab-step h2{
  font-size:27px!important;
  line-height:1.2!important;
}
.lab-step figure{
  align-self:start;
}
@media(max-width:980px){
  .lab-step{
    grid-template-columns:1fr!important;
  }
}


/* v31 restore compact homepage header */
.hero-azurehub-compact{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 420px!important;
  gap:32px!important;
  align-items:center!important;
  min-height:0!important;
  padding:32px 38px!important;
  margin:0 0 18px!important;
  border:1px solid rgba(145,195,235,.9)!important;
  border-radius:26px!important;
  background:
    radial-gradient(circle at 88% 15%, rgba(0,120,212,.16), transparent 30%),
    linear-gradient(135deg,#ffffff 0%,#eef7ff 100%)!important;
  box-shadow:0 18px 48px rgba(15,66,120,.08)!important;
  overflow:hidden!important;
}
.hero-azurehub-compact .hero-copy{
  max-width:850px;
}
.hero-badge{
  display:inline-flex;
  align-items:center;
  width:max-content;
  padding:7px 12px;
  border-radius:999px;
  border:1px solid #b8dcff;
  background:#e8f4ff;
  color:#005a9e;
  font-size:12px;
  font-weight:950;
  letter-spacing:.04em;
}
.hero-azurehub-compact h1{
  margin:16px 0 12px!important;
  font-size:44px!important;
  line-height:1.08!important;
  color:#0b2440!important;
}
.hero-azurehub-compact p{
  margin:0 0 18px!important;
  color:#526987!important;
  font-size:17px!important;
  line-height:1.65!important;
}
.hero-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.hero-visual-mini{
  position:relative;
  min-height:210px;
  display:grid;
  place-items:center;
}
.hero-visual-mini:before{
  content:"";
  position:absolute;
  width:320px;
  height:230px;
  border-radius:999px;
  background:radial-gradient(circle, rgba(0,120,212,.18), rgba(0,120,212,0) 68%);
}
.hero-orb{
  position:absolute;
  width:112px;
  height:112px;
  border-radius:30px;
  display:grid;
  place-items:center;
  font-size:58px;
  font-weight:950;
  color:white;
  background:linear-gradient(135deg,#0078d4,#55a8f6);
  box-shadow:0 24px 50px rgba(0,120,212,.28);
  z-index:2;
}
.mini-card{
  position:absolute;
  z-index:3;
  display:grid;
  grid-template-columns:42px 1fr;
  column-gap:10px;
  align-items:center;
  min-width:164px;
  padding:12px 14px;
  border:1px solid rgba(147,197,253,.9);
  border-radius:18px;
  background:rgba(255,255,255,.92);
  box-shadow:0 18px 38px rgba(18,67,118,.14);
  backdrop-filter:blur(12px);
}
.mini-card span{
  grid-row:span 2;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:#eaf6ff;
  font-size:21px;
}
.mini-card strong{
  color:#0b2440;
  font-weight:950;
}
.mini-card small{
  color:#526987;
  margin-top:2px;
}
.mini-card-1{left:0;top:10px}
.mini-card-2{right:0;top:42px}
.mini-card-3{left:86px;bottom:6px}
@media(max-width:1100px){
  .hero-azurehub-compact{
    grid-template-columns:1fr!important;
  }
  .hero-visual-mini{
    min-height:185px;
  }
}
@media(max-width:760px){
  .hero-azurehub-compact{
    padding:24px!important;
  }
  .hero-azurehub-compact h1{
    font-size:34px!important;
  }
  .mini-card{
    display:none;
  }
}


/* v32 restore guided roadmap */
.learning-roadmap{
  display:block!important;
  margin:18px 0 22px!important;
  padding:26px!important;
  border:1px solid rgba(145,195,235,.85)!important;
  border-radius:26px!important;
  background:linear-gradient(135deg,#ffffff 0%,#f3faff 100%)!important;
  box-shadow:0 18px 48px rgba(15,66,120,.08)!important;
}
.learning-roadmap .section-title{
  margin-bottom:20px!important;
}
.learning-roadmap .section-title h2{
  margin:6px 0 8px!important;
  color:#0b2440!important;
}
.learning-roadmap .section-title p{
  margin:0!important;
  color:#506784!important;
  line-height:1.6!important;
}
.learning-roadmap .roadmap-line{
  position:relative!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:16px!important;
}
.learning-roadmap .roadmap-line:before{
  content:""!important;
  position:absolute!important;
  left:8%!important;
  right:8%!important;
  top:30px!important;
  height:3px!important;
  background:linear-gradient(90deg,#0078d4,#65baff)!important;
  opacity:.35!important;
}
.learning-roadmap .roadmap-step{
  position:relative!important;
  z-index:1!important;
  display:grid!important;
  gap:8px!important;
  padding:18px!important;
  border:1px solid rgba(145,195,235,.85)!important;
  border-radius:20px!important;
  background:rgba(255,255,255,.92)!important;
  text-decoration:none!important;
  box-shadow:0 14px 34px rgba(15,66,120,.08)!important;
}
.learning-roadmap .step-number{
  width:48px!important;
  height:48px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:16px!important;
  background:#0078d4!important;
  color:white!important;
  font-weight:950!important;
}
.learning-roadmap .roadmap-step strong{
  color:#0b2440!important;
}
.learning-roadmap .roadmap-step small{
  color:#506784!important;
  line-height:1.45!important;
}
@media(max-width:1100px){
  .learning-roadmap .roadmap-line{
    grid-template-columns:1fr 1fr!important;
  }
}
@media(max-width:760px){
  .learning-roadmap .roadmap-line{
    grid-template-columns:1fr!important;
  }
  .learning-roadmap .roadmap-line:before{
    display:none!important;
  }
}


/* v33 - Lab page aligned with article styling */
.lab-shell{
  max-width:none!important;
  overflow-x:hidden!important;
}
.lab-article-article-style{
  max-width:1180px!important;
  margin:0 auto!important;
  display:grid!important;
  gap:24px!important;
  padding:0 22px 42px!important;
}
.lab-article-article-style .article-card-like,
.lab-article-article-style .lab-card,
.lab-article-article-style .lab-step,
.lab-article-article-style .lab-result{
  border:1px solid rgba(145,195,235,.85)!important;
  border-radius:26px!important;
  background:#fff!important;
  box-shadow:0 18px 48px rgba(15,66,120,.08)!important;
  overflow:hidden!important;
}
.lab-article-article-style .lab-hero{
  padding:34px 36px!important;
  background:
    radial-gradient(circle at 88% 18%, rgba(0,120,212,.14), transparent 32%),
    linear-gradient(135deg,#ffffff 0%,#eef7ff 100%)!important;
}
.lab-article-article-style .lab-hero h1{
  max-width:1040px!important;
  font-size:42px!important;
  line-height:1.12!important;
  margin:12px 0 16px!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}
.lab-article-article-style .lab-hero p{
  max-width:980px!important;
  font-size:17px!important;
  line-height:1.65!important;
}
.lab-article-article-style .lab-meta{
  gap:10px!important;
  margin-top:18px!important;
}
.lab-article-article-style .lab-card,
.lab-article-article-style .lab-result{
  padding:28px 30px!important;
}
.lab-article-article-style .lab-card h2,
.lab-article-article-style .lab-result h2{
  font-size:28px!important;
  line-height:1.2!important;
}
.lab-article-article-style .lab-card p,
.lab-article-article-style .lab-card li,
.lab-article-article-style .lab-result p{
  font-size:16px!important;
  line-height:1.68!important;
}

/* Step layout: balanced, no central crowding */
.lab-article-article-style .lab-step{
  display:grid!important;
  grid-template-columns:minmax(0, .92fr) minmax(420px, 1.08fr)!important;
  gap:28px!important;
  align-items:start!important;
  padding:28px!important;
}
.lab-article-article-style .lab-step .step-copy{
  min-width:0!important;
}
.lab-article-article-style .lab-step h2{
  font-size:28px!important;
  line-height:1.22!important;
  margin:10px 0 14px!important;
  color:#0b2440!important;
}
.lab-article-article-style .lab-step p,
.lab-article-article-style .lab-step li{
  font-size:16px!important;
  line-height:1.68!important;
  color:#506784!important;
}
.lab-article-article-style .lab-step ul{
  padding-left:20px!important;
}
.lab-article-article-style .lab-step figure{
  margin:0!important;
  min-width:0!important;
}
.lab-article-article-style .lab-step img{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  border-radius:18px!important;
  border:1px solid #bfdcf5!important;
  box-shadow:0 18px 42px rgba(15,66,120,.13)!important;
  background:#eef6ff!important;
}
.lab-article-article-style .lab-step figcaption{
  color:#607795!important;
  font-size:13px!important;
  margin-top:10px!important;
}
.lab-article-article-style .step-chip{
  display:inline-flex!important;
  width:max-content!important;
  padding:7px 12px!important;
  border-radius:999px!important;
  background:#0078d4!important;
  color:#fff!important;
  font-weight:950!important;
}
.lab-article-article-style .code-lite{
  margin-top:14px!important;
  padding:14px 16px!important;
  border-radius:16px!important;
  background:#0b1730!important;
  overflow:auto!important;
}

/* topbar fallback polish for lab if article header is not present */
.topbar{
  z-index:50!important;
}
.top-search{
  flex:1 1 auto;
  max-width:820px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 14px;
  height:42px;
  border:1px solid #b8dcff;
  border-radius:12px;
  background:#fff;
}
.top-search input{
  width:100%;
  border:0;
  outline:0;
  font:inherit;
  background:transparent;
}
.login-trigger{
  width:42px;
  height:42px;
  border-radius:999px;
  border:1px solid #b8dcff;
  background:#fff;
  cursor:pointer;
}
.login-popover{
  position:absolute;
  right:20px;
  top:58px;
  width:240px;
  padding:16px;
  border:1px solid #b8dcff;
  border-radius:18px;
  background:#fff;
  box-shadow:0 18px 42px rgba(15,66,120,.16);
}
.login-popover input{
  width:100%;
  box-sizing:border-box;
  margin-top:10px;
  padding:10px;
  border:1px solid #d7e7f7;
  border-radius:10px;
}
.login-popover button{
  width:100%;
  margin-top:10px;
  padding:10px;
  border:0;
  border-radius:10px;
  background:#0078d4;
  color:#fff;
  font-weight:900;
}

@media(max-width:1180px){
  .lab-article-article-style{
    padding:0 16px 34px!important;
  }
  .lab-article-article-style .lab-step{
    grid-template-columns:1fr!important;
  }
}
@media(max-width:760px){
  .lab-article-article-style .lab-hero h1{
    font-size:32px!important;
  }
  .top-search{
    display:none!important;
  }
}


/* v34 requested homepage cleanup */
.learning-useful-panel{
  display:none!important;
}

/* Keep smart cards clean after removing checklist */
.smart-learning-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  align-items:stretch!important;
}
.smart-learning-grid .smart-card,
.smart-learning-grid .smart-card.large{
  grid-row:auto!important;
  min-height:230px!important;
  height:100%!important;
}
.smart-card-horizontal .smart-icon{
  display:inline-grid!important;
  vertical-align:middle!important;
  margin:0 12px 0 0!important;
}
.smart-card-horizontal h3{
  display:inline!important;
  vertical-align:middle!important;
}
.smart-card-horizontal p{
  margin-top:16px!important;
}
.smart-card-horizontal a{
  display:inline-block!important;
  margin-top:10px!important;
}

/* News: compact only 4 visible if HTML ever contains more */
.news-list .news-item:nth-child(n+5){
  display:none!important;
}

/* v34 lab: reset broken article/grid rules and match article spacing */
.lab-shell{
  max-width:none!important;
  overflow-x:hidden!important;
}
.lab-fixed-layout{
  max-width:1180px!important;
  margin:0 auto!important;
  display:flex!important;
  flex-direction:column!important;
  gap:24px!important;
  padding:0 22px 46px!important;
}
.lab-fixed-layout > *{
  width:100%!important;
  box-sizing:border-box!important;
}
.lab-fixed-layout .lab-card-like,
.lab-fixed-layout .lab-card,
.lab-fixed-layout .lab-step,
.lab-fixed-layout .lab-result{
  border:1px solid rgba(145,195,235,.85)!important;
  border-radius:26px!important;
  background:#fff!important;
  box-shadow:0 18px 48px rgba(15,66,120,.08)!important;
  overflow:hidden!important;
}
.lab-fixed-layout .lab-hero{
  padding:34px 36px!important;
  background:
    radial-gradient(circle at 88% 18%, rgba(0,120,212,.14), transparent 32%),
    linear-gradient(135deg,#ffffff 0%,#eef7ff 100%)!important;
}
.lab-fixed-layout .lab-hero h1{
  max-width:1040px!important;
  font-size:40px!important;
  line-height:1.13!important;
  margin:12px 0 16px!important;
  white-space:normal!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}
.lab-fixed-layout .lab-hero p{
  max-width:980px!important;
  font-size:17px!important;
  line-height:1.65!important;
}
.lab-fixed-layout .lab-card,
.lab-fixed-layout .lab-result{
  padding:28px 30px!important;
}
.lab-fixed-layout .lab-card h2,
.lab-fixed-layout .lab-result h2{
  font-size:28px!important;
  line-height:1.2!important;
  margin:0 0 12px!important;
}
.lab-fixed-layout .lab-card p,
.lab-fixed-layout .lab-card li,
.lab-fixed-layout .lab-result p{
  font-size:16px!important;
  line-height:1.68!important;
  color:#506784!important;
}

/* Lab steps: fixed two-column, image never overlaps, text never narrows too much */
.lab-fixed-layout .lab-step{
  display:grid!important;
  grid-template-columns:minmax(0, 1fr) minmax(460px, 1.15fr)!important;
  gap:30px!important;
  align-items:start!important;
  padding:30px!important;
}
.lab-fixed-layout .lab-step .step-copy{
  min-width:0!important;
  width:100%!important;
  display:block!important;
}
.lab-fixed-layout .lab-step h2{
  font-size:28px!important;
  line-height:1.22!important;
  margin:12px 0 14px!important;
  color:#0b2440!important;
  white-space:normal!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}
.lab-fixed-layout .lab-step p,
.lab-fixed-layout .lab-step li{
  font-size:16px!important;
  line-height:1.68!important;
  color:#506784!important;
  white-space:normal!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}
.lab-fixed-layout .lab-step ul{
  padding-left:20px!important;
  margin:10px 0 0!important;
}
.lab-fixed-layout .lab-step figure{
  margin:0!important;
  min-width:0!important;
  width:100%!important;
}
.lab-fixed-layout .lab-step img{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  border-radius:18px!important;
  border:1px solid #bfdcf5!important;
  box-shadow:0 18px 42px rgba(15,66,120,.13)!important;
  background:#eef6ff!important;
}
.lab-fixed-layout .lab-step figcaption{
  color:#607795!important;
  font-size:13px!important;
  margin-top:10px!important;
  line-height:1.45!important;
}
.lab-fixed-layout .step-chip{
  display:inline-flex!important;
  width:max-content!important;
  padding:7px 12px!important;
  border-radius:999px!important;
  background:#0078d4!important;
  color:#fff!important;
  font-weight:950!important;
}
.lab-fixed-layout .code-lite{
  margin-top:14px!important;
  padding:14px 16px!important;
  border-radius:16px!important;
  background:#0b1730!important;
  overflow:auto!important;
}

@media(max-width:1180px){
  .lab-fixed-layout{
    padding:0 16px 38px!important;
  }
  .lab-fixed-layout .lab-step{
    grid-template-columns:1fr!important;
  }
}
@media(max-width:900px){
  .smart-learning-grid{
    grid-template-columns:1fr!important;
  }
}
@media(max-width:760px){
  .lab-fixed-layout .lab-hero h1{
    font-size:32px!important;
  }
}


/* v35 final polish: header, mobile, community, lab width, share section */

/* Header cleanup */
.hero-azurehub-compact .hero-badge{
  display:none!important;
}
.hero-azurehub-compact{
  padding-top:28px!important;
  padding-bottom:28px!important;
}
.hero-azurehub-compact .btn.secondary{
  display:none!important;
}

/* Guided route without H2 */
.learning-roadmap .section-title h2:empty,
.learning-roadmap .section-title h2{
  display:none!important;
}
.learning-roadmap .section-title{
  margin-bottom:18px!important;
}

/* Community: remove stats strip/line completely */
.community-stats,
.community-stats-two{
  display:none!important;
}
.community-band{
  grid-template-columns:1fr!important;
  padding:28px!important;
}

/* Lab: make right/content area wider by allowing content to use more viewport */
.lab-fixed-layout{
  max-width:1420px!important;
  width:100%!important;
  padding-left:18px!important;
  padding-right:18px!important;
}
.lab-fixed-layout .lab-step{
  grid-template-columns:minmax(390px, .82fr) minmax(620px, 1.35fr)!important;
  gap:34px!important;
}
.lab-fixed-layout .lab-step img{
  width:100%!important;
}
.lab-fixed-layout .lab-step figure{
  max-width:none!important;
}

/* Article share section - more visible */
.share-box-featured,
.article-share,
.share-box,
.social-share{
  margin-top:32px!important;
  padding:22px!important;
  border:1px solid rgba(0,120,212,.35)!important;
  border-radius:22px!important;
  background:
    radial-gradient(circle at 90% 10%, rgba(0,120,212,.14), transparent 30%),
    linear-gradient(135deg,#ffffff,#eef7ff)!important;
  box-shadow:0 18px 42px rgba(15,66,120,.12)!important;
}
.share-box-featured a,
.article-share a,
.share-box a,
.social-share a{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:42px!important;
  height:42px!important;
  margin:4px!important;
  border-radius:14px!important;
  border:1px solid #b8dcff!important;
  background:#fff!important;
  color:#005a9e!important;
  font-weight:900!important;
  text-decoration:none!important;
  box-shadow:0 10px 24px rgba(15,66,120,.08)!important;
  transition:transform .18s ease, box-shadow .18s ease!important;
}
.share-box-featured a:hover,
.article-share a:hover,
.share-box a:hover,
.social-share a:hover{
  transform:translateY(-3px)!important;
  box-shadow:0 16px 30px rgba(15,66,120,.16)!important;
}

/* General mobile optimization */
@media(max-width:1180px){
  .layout{
    grid-template-columns:240px minmax(0,1fr)!important;
  }
  .lab-fixed-layout .lab-step{
    grid-template-columns:1fr!important;
  }
  .lab-fixed-layout{
    max-width:100%!important;
  }
}

@media(max-width:900px){
  body{
    overflow-x:hidden!important;
  }
  .layout{
    display:block!important;
  }
  .sidebar{
    position:relative!important;
    width:auto!important;
    max-width:none!important;
    border-right:0!important;
    border-bottom:1px solid var(--line)!important;
  }
  .content{
    width:100%!important;
    max-width:100%!important;
    padding:14px!important;
    box-sizing:border-box!important;
  }
  .topbar{
    position:sticky!important;
    top:0!important;
    z-index:100!important;
    gap:10px!important;
    padding:10px 12px!important;
  }
  .brand strong{
    font-size:18px!important;
  }
  .top-search{
    display:none!important;
  }
  .hero-azurehub-compact{
    grid-template-columns:1fr!important;
    padding:24px!important;
    margin-bottom:14px!important;
  }
  .hero-azurehub-compact h1{
    font-size:32px!important;
  }
  .hero-visual-mini{
    min-height:140px!important;
  }
  .mini-card{
    display:none!important;
  }
  .learning-roadmap{
    padding:20px!important;
  }
  .learning-roadmap .roadmap-line{
    grid-template-columns:1fr!important;
  }
  .learning-roadmap .roadmap-line:before{
    display:none!important;
  }
  .home-learning-grid{
    grid-template-columns:1fr!important;
  }
  .carousel-card,
  .saas-card{
    min-width:100%!important;
  }
  .smart-learning-grid{
    grid-template-columns:1fr!important;
  }
  .exam-strip,
  .cert-collab-strip{
    display:block!important;
    padding:22px!important;
  }
  .exam-pills{
    justify-content:flex-start!important;
    margin-top:16px!important;
  }
  .community-band{
    padding:22px!important;
  }
  .lab-fixed-layout{
    padding:0 0 32px!important;
  }
  .lab-fixed-layout .lab-hero,
  .lab-fixed-layout .lab-card,
  .lab-fixed-layout .lab-step,
  .lab-fixed-layout .lab-result{
    border-radius:20px!important;
  }
  .lab-fixed-layout .lab-hero{
    padding:24px!important;
  }
  .lab-fixed-layout .lab-hero h1{
    font-size:30px!important;
  }
  .lab-fixed-layout .lab-step{
    padding:22px!important;
    gap:18px!important;
  }
  .lab-fixed-layout .lab-step h2{
    font-size:24px!important;
  }
  .lab-fixed-layout .lab-card,
  .lab-fixed-layout .lab-result{
    padding:22px!important;
  }
  .ranking-hero h1{
    font-size:32px!important;
  }
  .ranking-item{
    grid-template-columns:42px minmax(0,1fr)!important;
  }
}

@media(max-width:520px){
  .hero-azurehub-compact h1{
    font-size:28px!important;
  }
  .hero-actions .btn,
  .btn{
    width:100%!important;
    justify-content:center!important;
    box-sizing:border-box!important;
  }
  .carousel-head{
    align-items:flex-start!important;
    gap:12px!important;
    flex-direction:column!important;
  }
  .lab-meta{
    display:grid!important;
    grid-template-columns:1fr!important;
  }
  .lab-fixed-layout .lab-step p,
  .lab-fixed-layout .lab-step li,
  .lab-fixed-layout .lab-card p,
  .lab-fixed-layout .lab-card li{
    font-size:15px!important;
  }
  .share-box-featured,
  .article-share,
  .share-box,
  .social-share{
    padding:18px!important;
  }
}


/* v36 compact top: hero + ruta guiada in 2 columns / 1 row */
.home-top-grid-v36{
  display:grid!important;
  grid-template-columns:minmax(0,1.05fr) minmax(430px,.95fr)!important;
  gap:18px!important;
  align-items:stretch!important;
  margin:0 0 18px!important;
}
.home-top-grid-v36 .hero-azurehub-compact,
.home-top-grid-v36 .learning-roadmap{
  height:100%!important;
  margin:0!important;
  box-sizing:border-box!important;
}

/* compact hero */
.home-top-grid-v36 .hero-azurehub-compact{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 260px!important;
  gap:18px!important;
  padding:24px 28px!important;
  min-height:300px!important;
}
.home-top-grid-v36 .hero-azurehub-compact .hero-badge{
  display:none!important;
}
.home-top-grid-v36 .hero-azurehub-compact h1{
  font-size:34px!important;
  line-height:1.08!important;
  margin:0 0 10px!important;
}
.home-top-grid-v36 .hero-azurehub-compact p{
  font-size:15.5px!important;
  line-height:1.55!important;
  margin:0 0 15px!important;
}
.home-top-grid-v36 .hero-azurehub-compact .btn.secondary{
  display:none!important;
}
.home-top-grid-v36 .hero-actions .btn.primary{
  padding:11px 16px!important;
}
.home-top-grid-v36 .hero-visual-mini{
  min-height:200px!important;
}
.home-top-grid-v36 .hero-orb{
  width:86px!important;
  height:86px!important;
  font-size:46px!important;
  border-radius:24px!important;
}
.home-top-grid-v36 .mini-card{
  min-width:132px!important;
  padding:10px 11px!important;
  grid-template-columns:34px 1fr!important;
}
.home-top-grid-v36 .mini-card span{
  width:34px!important;
  height:34px!important;
  font-size:18px!important;
}
.home-top-grid-v36 .mini-card strong{
  font-size:14px!important;
}
.home-top-grid-v36 .mini-card small{
  font-size:12px!important;
}
.home-top-grid-v36 .mini-card-1{left:0!important;top:6px!important}
.home-top-grid-v36 .mini-card-2{right:0!important;top:38px!important}
.home-top-grid-v36 .mini-card-3{left:62px!important;bottom:4px!important}

/* compact roadmap */
.home-top-grid-v36 .learning-roadmap{
  padding:22px!important;
  min-height:300px!important;
}
.home-top-grid-v36 .learning-roadmap .section-title{
  margin-bottom:14px!important;
}
.home-top-grid-v36 .learning-roadmap .section-title h2{
  display:none!important;
}
.home-top-grid-v36 .learning-roadmap .section-title p{
  font-size:14.5px!important;
  line-height:1.45!important;
}
.home-top-grid-v36 .learning-roadmap .roadmap-line{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:12px!important;
}
.home-top-grid-v36 .learning-roadmap .roadmap-line:before{
  display:none!important;
}
.home-top-grid-v36 .learning-roadmap .roadmap-step{
  padding:14px!important;
  border-radius:18px!important;
  min-height:104px!important;
  display:grid!important;
  grid-template-columns:42px 1fr!important;
  column-gap:11px!important;
  align-items:start!important;
}
.home-top-grid-v36 .learning-roadmap .step-number{
  width:40px!important;
  height:40px!important;
  border-radius:13px!important;
  grid-row:span 2!important;
}
.home-top-grid-v36 .learning-roadmap .roadmap-step strong{
  font-size:15.5px!important;
}
.home-top-grid-v36 .learning-roadmap .roadmap-step small{
  font-size:12.5px!important;
  line-height:1.35!important;
}

/* tighten following section spacing */
.home-top-grid-v36 + .home-learning-grid,
.home-top-grid-v36 + section{
  margin-top:0!important;
}

/* Mobile optimization for new top grid */
@media(max-width:1180px){
  .home-top-grid-v36{
    grid-template-columns:1fr!important;
  }
  .home-top-grid-v36 .hero-azurehub-compact{
    min-height:auto!important;
  }
  .home-top-grid-v36 .learning-roadmap{
    min-height:auto!important;
  }
}
@media(max-width:760px){
  .home-top-grid-v36{
    gap:14px!important;
  }
  .home-top-grid-v36 .hero-azurehub-compact{
    grid-template-columns:1fr!important;
    padding:22px!important;
  }
  .home-top-grid-v36 .hero-azurehub-compact h1{
    font-size:28px!important;
  }
  .home-top-grid-v36 .hero-visual-mini{
    display:none!important;
  }
  .home-top-grid-v36 .learning-roadmap{
    padding:18px!important;
  }
  .home-top-grid-v36 .learning-roadmap .roadmap-line{
    grid-template-columns:1fr!important;
  }
  .home-top-grid-v36 .learning-roadmap .roadmap-step{
    min-height:auto!important;
  }
}


/* v37 cleanup footer, hero, ranking */
.hero-actions:empty{
  display:none!important;
}
.home-top-grid-v36 .hero-azurehub-compact p{
  font-size:16px!important;
  line-height:1.62!important;
  max-width:760px!important;
}
.community-band,
.community-stats,
.community-stats-two{
  display:none!important;
}
.site-footer{
  display:block!important;
  margin:30px 0 0!important;
  padding:20px 24px!important;
  color:#506784!important;
  border-top:1px solid rgba(145,195,235,.55)!important;
  background:transparent!important;
  font-size:14px!important;
  clear:both!important;
}
.footer{
  display:none!important;
}

/* Ranking page same visual rhythm as lab/article */
.ranking-shell{
  max-width:none!important;
  overflow-x:hidden!important;
}
.ranking-page-wrap{
  max-width:1420px!important;
  width:100%!important;
  margin:0 auto!important;
  padding:0 18px 46px!important;
  box-sizing:border-box!important;
}
.ranking-page-wrap > *{
  box-sizing:border-box!important;
}
.ranking-breadcrumb{
  margin:0 0 18px!important;
  padding:10px 14px!important;
  width:max-content!important;
  max-width:100%!important;
  border:1px solid rgba(145,195,235,.85)!important;
  border-radius:999px!important;
  background:#f7fbff!important;
}
.ranking-hero{
  width:100%!important;
  padding:34px 36px!important;
  border:1px solid rgba(145,195,235,.85)!important;
  border-radius:28px!important;
  background:
    radial-gradient(circle at 88% 18%, rgba(0,120,212,.14), transparent 32%),
    linear-gradient(135deg,#ffffff 0%,#eef7ff 100%)!important;
  box-shadow:0 18px 48px rgba(15,66,120,.08)!important;
  margin:0 0 24px!important;
  overflow:hidden!important;
}
.ranking-hero h1{
  max-width:1040px!important;
  font-size:42px!important;
  line-height:1.12!important;
  margin:12px 0 12px!important;
  color:#0b2440!important;
  white-space:normal!important;
  overflow-wrap:normal!important;
}
.ranking-hero p{
  max-width:980px!important;
  font-size:17px!important;
  line-height:1.65!important;
  color:#506784!important;
}
.ranking-panel{
  width:100%!important;
  border:1px solid rgba(145,195,235,.85)!important;
  border-radius:26px!important;
  background:#fff!important;
  box-shadow:0 18px 48px rgba(15,66,120,.08)!important;
  overflow:hidden!important;
  margin:0!important;
}
.ranking-controls{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:12px!important;
  padding:20px!important;
  background:linear-gradient(90deg,#ffffff,#eef7ff)!important;
  border-bottom:1px solid rgba(145,195,235,.65)!important;
}
.ranking-filter{
  border:1px solid #b8dcff!important;
  background:#fff!important;
  color:#005a9e!important;
  border-radius:999px!important;
  padding:11px 16px!important;
  font-weight:900!important;
}
.ranking-filter.active{
  background:#0078d4!important;
  color:#fff!important;
  border-color:#0078d4!important;
}
.ranking-item{
  display:grid!important;
  grid-template-columns:54px 58px minmax(0,1fr)!important;
  gap:18px!important;
  align-items:center!important;
  padding:20px 24px!important;
  text-decoration:none!important;
  border-bottom:1px solid rgba(145,195,235,.45)!important;
  background:#fff!important;
}
.ranking-item:hover{
  background:#f4faff!important;
}
.ranking-number{
  width:44px!important;
  height:44px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:14px!important;
  background:#e8f4ff!important;
  color:#005a9e!important;
  font-weight:950!important;
}
.ranking-icon{
  width:50px!important;
  height:50px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:16px!important;
  background:#f0f8ff!important;
  font-size:26px!important;
}
.ranking-copy strong{
  display:block!important;
  color:#0b2440!important;
  font-size:19px!important;
  line-height:1.34!important;
  margin-bottom:4px!important;
}
.ranking-copy small{
  display:block!important;
  color:#506784!important;
  line-height:1.45!important;
}
.ranking-copy em{
  display:block!important;
  color:#506784!important;
  font-style:normal!important;
  margin-top:7px!important;
  line-height:1.5!important;
  display:-webkit-box!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
  overflow:hidden!important;
}
.ranking-pager{
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  gap:14px!important;
  padding:18px!important;
  border-top:1px solid rgba(145,195,235,.45)!important;
  background:#f8fcff!important;
}
.page-btn{
  padding:10px 14px!important;
  border-radius:999px!important;
  border:1px solid #b8dcff!important;
  background:#fff!important;
  color:#005a9e!important;
  font-weight:900!important;
}

/* mobile ranking fix */
@media(max-width:900px){
  .ranking-page-wrap{
    padding:0 14px 34px!important;
  }
  .ranking-hero{
    padding:24px!important;
  }
  .ranking-hero h1{
    font-size:32px!important;
  }
  .ranking-controls{
    gap:8px!important;
    padding:14px!important;
  }
  .ranking-filter{
    padding:9px 12px!important;
    font-size:14px!important;
  }
  .ranking-item{
    grid-template-columns:44px minmax(0,1fr)!important;
    gap:12px!important;
    padding:16px!important;
  }
  .ranking-icon{
    display:none!important;
  }
  .ranking-copy strong{
    font-size:17px!important;
  }
}
@media(max-width:520px){
  .ranking-hero h1{
    font-size:28px!important;
  }
  .ranking-copy em{
    -webkit-line-clamp:3!important;
  }
}


/* v38 polish: slimmer guided route, richer cards, stronger social share */

/* Make top guided route narrower so the top area consumes less horizontal space */
.home-top-grid-v36{
  grid-template-columns:minmax(0,1.22fr) minmax(360px,.78fr)!important;
  gap:16px!important;
}
.home-top-grid-v36 .learning-roadmap{
  padding:18px!important;
}
.home-top-grid-v36 .learning-roadmap .section-title{
  margin-bottom:12px!important;
}
.home-top-grid-v36 .learning-roadmap .section-title p{
  font-size:13.5px!important;
  line-height:1.42!important;
}
.home-top-grid-v36 .learning-roadmap .roadmap-line{
  gap:10px!important;
}
.home-top-grid-v36 .learning-roadmap .roadmap-step{
  padding:12px!important;
  min-height:94px!important;
  grid-template-columns:36px 1fr!important;
  column-gap:9px!important;
}
.home-top-grid-v36 .learning-roadmap .step-number{
  width:34px!important;
  height:34px!important;
  border-radius:12px!important;
  font-size:13px!important;
}
.home-top-grid-v36 .learning-roadmap .roadmap-step strong{
  font-size:14px!important;
}
.home-top-grid-v36 .learning-roadmap .roadmap-step small{
  font-size:12px!important;
  line-height:1.3!important;
}

/* Give recommended lab/ranking card text more breathing room */
.smart-card-horizontal p{
  max-width:92%!important;
  line-height:1.62!important;
}
.smart-card-horizontal.large p{
  max-width:96%!important;
}

/* Carousel readings visible */
.saas-card-meta span:last-child,
.carousel-meta span:nth-child(2),
.carousel-meta span:last-child{
  font-weight:900!important;
  color:#005a9e!important;
}

/* Social share: much more visible, colored buttons */
.share-box-featured,
.article-share,
.share-box,
.social-share{
  position:relative!important;
  margin-top:36px!important;
  padding:26px!important;
  border:2px solid rgba(0,120,212,.45)!important;
  border-radius:26px!important;
  background:
    radial-gradient(circle at 90% 0%, rgba(0,120,212,.20), transparent 32%),
    linear-gradient(135deg,#ffffff 0%,#eaf6ff 100%)!important;
  box-shadow:0 24px 58px rgba(15,66,120,.18)!important;
}
.share-box-featured:before,
.article-share:before,
.share-box:before,
.social-share:before{
  content:"Comparte este artículo";
  display:block;
  margin-bottom:14px;
  color:#0b2440;
  font-size:18px;
  font-weight:950;
}
.share-box-featured a,
.article-share a,
.share-box a,
.social-share a{
  min-width:48px!important;
  height:48px!important;
  margin:6px!important;
  border:0!important;
  border-radius:16px!important;
  color:#fff!important;
  font-weight:950!important;
  text-decoration:none!important;
  box-shadow:0 14px 30px rgba(15,66,120,.18)!important;
}
.share-box-featured a:nth-of-type(1),
.article-share a:nth-of-type(1),
.share-box a:nth-of-type(1),
.social-share a:nth-of-type(1){
  background:#0a66c2!important; /* LinkedIn */
}
.share-box-featured a:nth-of-type(2),
.article-share a:nth-of-type(2),
.share-box a:nth-of-type(2),
.social-share a:nth-of-type(2){
  background:#1877f2!important; /* Facebook */
}
.share-box-featured a:nth-of-type(3),
.article-share a:nth-of-type(3),
.share-box a:nth-of-type(3),
.social-share a:nth-of-type(3){
  background:#111827!important; /* X / generic */
}
.share-box-featured a:nth-of-type(4),
.article-share a:nth-of-type(4),
.share-box a:nth-of-type(4),
.social-share a:nth-of-type(4){
  background:#0078d4!important; /* Copy / Azure */
}
.share-box-featured a:hover,
.article-share a:hover,
.share-box a:hover,
.social-share a:hover{
  transform:translateY(-4px) scale(1.04)!important;
  box-shadow:0 20px 40px rgba(15,66,120,.26)!important;
}

/* Mobile keep top route compact */
@media(max-width:1180px){
  .home-top-grid-v36{
    grid-template-columns:1fr!important;
  }
}
@media(max-width:760px){
  .home-top-grid-v36 .learning-roadmap .roadmap-line{
    grid-template-columns:1fr!important;
  }
  .home-top-grid-v36 .learning-roadmap .roadmap-step{
    min-height:auto!important;
  }
  .share-box-featured,
  .article-share,
  .share-box,
  .social-share{
    padding:20px!important;
  }
}


/* v39 search centering + stronger share UI */

/* Center the top search in the whole header */
.topbar{
  display:grid!important;
  grid-template-columns:auto auto minmax(280px,760px) auto!important;
  align-items:center!important;
  gap:14px!important;
}
.top-search{
  justify-self:center!important;
  width:min(760px,52vw)!important;
  max-width:760px!important;
}
@media(max-width:900px){
  .topbar{
    display:flex!important;
  }
  .top-search{
    display:none!important;
  }
}

/* Remove empty top copy gaps */
.carousel-head p:empty,
.learning-roadmap .section-title p:empty{
  display:none!important;
}

/* Bottom article share: high presence */
.share-box-featured,
.article-share,
.share-box,
.social-share{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:12px!important;
  margin-top:36px!important;
  padding:24px 26px!important;
  border:2px solid rgba(0,120,212,.45)!important;
  border-radius:26px!important;
  background:
    radial-gradient(circle at 92% 0%, rgba(0,120,212,.22), transparent 34%),
    linear-gradient(135deg,#ffffff 0%,#e6f4ff 100%)!important;
  box-shadow:0 24px 58px rgba(15,66,120,.18)!important;
}
.share-box-featured::before,
.article-share::before,
.share-box::before,
.social-share::before{
  content:"🚀 Comparte este artículo";
  flex:0 0 100%;
  display:block;
  margin-bottom:4px;
  color:#0b2440;
  font-size:19px;
  font-weight:950;
}
.share-box-featured a,
.article-share a,
.share-box a,
.social-share a{
  min-width:50px!important;
  width:50px!important;
  height:50px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin:0!important;
  border:0!important;
  border-radius:16px!important;
  color:#fff!important;
  font-weight:950!important;
  font-size:16px!important;
  text-decoration:none!important;
  box-shadow:0 14px 30px rgba(15,66,120,.22)!important;
  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease!important;
}
.share-box-featured a:nth-of-type(1),
.article-share a:nth-of-type(1),
.share-box a:nth-of-type(1),
.social-share a:nth-of-type(1){ background:#0a66c2!important; }
.share-box-featured a:nth-of-type(2),
.article-share a:nth-of-type(2),
.share-box a:nth-of-type(2),
.social-share a:nth-of-type(2){ background:#1877f2!important; }
.share-box-featured a:nth-of-type(3),
.article-share a:nth-of-type(3),
.share-box a:nth-of-type(3),
.social-share a:nth-of-type(3){ background:#111827!important; }
.share-box-featured a:nth-of-type(4),
.article-share a:nth-of-type(4),
.share-box a:nth-of-type(4),
.social-share a:nth-of-type(4){ background:#0078d4!important; }
.share-box-featured a:hover,
.article-share a:hover,
.share-box a:hover,
.social-share a:hover{
  transform:translateY(-4px) scale(1.05)!important;
  box-shadow:0 22px 44px rgba(15,66,120,.28)!important;
  filter:saturate(1.15)!important;
}
.share-box-featured a.copied,
.article-share a.copied,
.share-box a.copied,
.social-share a.copied{
  background:#16a34a!important;
}

/* Summary share card */
.summary-share-card{
  margin:16px 0 18px!important;
  padding:16px!important;
  border:1px solid rgba(0,120,212,.35)!important;
  border-radius:20px!important;
  background:linear-gradient(135deg,#ffffff,#eef7ff)!important;
  box-shadow:0 14px 34px rgba(15,66,120,.10)!important;
}
.summary-share-title{
  color:#0b2440!important;
  font-weight:950!important;
  margin-bottom:10px!important;
}
.summary-share-icons{
  display:flex!important;
  gap:8px!important;
  flex-wrap:wrap!important;
}
.summary-share-icons a{
  width:40px!important;
  height:40px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:13px!important;
  color:#fff!important;
  font-weight:950!important;
  text-decoration:none!important;
  box-shadow:0 10px 22px rgba(15,66,120,.18)!important;
}
.summary-share-icons a:nth-child(1){background:#0a66c2!important}
.summary-share-icons a:nth-child(2){background:#1877f2!important}
.summary-share-icons a:nth-child(3){background:#111827!important}
.summary-share-icons a:nth-child(4){background:#0078d4!important}
.summary-share-count{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  margin-top:14px!important;
  padding:11px 12px!important;
  border-radius:15px!important;
  background:#fff!important;
  border:1px solid #b8dcff!important;
}
.summary-share-count span{
  width:30px!important;
  height:30px!important;
  border-radius:10px!important;
  display:grid!important;
  place-items:center!important;
  background:#e8f4ff!important;
  color:#005a9e!important;
}
.summary-share-count strong{
  color:#005a9e!important;
  font-size:22px!important;
}
.summary-share-count small{
  color:#506784!important;
  font-weight:800!important;
}

/* Mobile share */
@media(max-width:560px){
  .share-box-featured,
  .article-share,
  .share-box,
  .social-share{
    padding:20px!important;
  }
  .share-box-featured a,
  .article-share a,
  .share-box a,
  .social-share a{
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
  }
}


/* v40 fixes */
/* Logo closer to hamburger */
.topbar{
  gap:8px!important;
}
.topbar .brand{
  margin-left:0!important;
}
.icon-btn + .brand,
#menuToggle + .brand{
  margin-left:-4px!important;
}

/* Summary share integrated inside the summary card */
.summary-share-card{
  width:100%!important;
  box-sizing:border-box!important;
  margin:14px 0 0!important;
  padding:14px!important;
  display:block!important;
  clear:both!important;
  grid-column:1 / -1!important;
  align-self:stretch!important;
  border:1px solid rgba(0,120,212,.32)!important;
  border-radius:18px!important;
  background:linear-gradient(135deg,#ffffff,#eef7ff)!important;
  box-shadow:0 12px 26px rgba(15,66,120,.08)!important;
}
.summary-share-title{
  font-size:15px!important;
  margin-bottom:10px!important;
}
.summary-share-icons{
  display:flex!important;
  gap:8px!important;
  flex-wrap:wrap!important;
}
.summary-share-icons a{
  width:38px!important;
  height:38px!important;
  border-radius:12px!important;
}
.summary-share-count{
  margin-top:12px!important;
  padding:10px!important;
  gap:8px!important;
}
.summary-share-count strong{
  font-size:20px!important;
}
.summary-share-count small{
  font-size:12px!important;
  line-height:1.2!important;
}

/* If quick summary card uses grid/flex, force title and share to stack */
.quick-summary,
.article-summary,
.summary-card,
.aside-card{
  min-width:0!important;
}
.quick-summary .summary-share-card,
.article-summary .summary-share-card,
.summary-card .summary-share-card,
.aside-card .summary-share-card{
  flex-basis:100%!important;
}

/* Bottom share buttons: same colored icons as summary */
.share-box-featured,
.article-share,
.share-box,
.social-share{
  display:flex!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:10px!important;
  padding:22px 24px!important;
}
.share-box-featured a,
.article-share a,
.share-box a,
.social-share a{
  min-width:42px!important;
  width:42px!important;
  height:42px!important;
  border-radius:13px!important;
  color:#fff!important;
  font-weight:950!important;
  font-size:15px!important;
  border:0!important;
  box-shadow:0 12px 24px rgba(15,66,120,.20)!important;
}
.share-box-featured a:nth-of-type(1),
.article-share a:nth-of-type(1),
.share-box a:nth-of-type(1),
.social-share a:nth-of-type(1){background:#0a66c2!important}
.share-box-featured a:nth-of-type(2),
.article-share a:nth-of-type(2),
.share-box a:nth-of-type(2),
.social-share a:nth-of-type(2){background:#1877f2!important}
.share-box-featured a:nth-of-type(3),
.article-share a:nth-of-type(3),
.share-box a:nth-of-type(3),
.social-share a:nth-of-type(3){background:#111827!important}
.share-box-featured a:nth-of-type(4),
.article-share a:nth-of-type(4),
.share-box a:nth-of-type(4),
.social-share a:nth-of-type(4){background:#0078d4!important}

/* Reduce duplicate oversized title if pseudo before exists */
.share-box-featured:before,
.article-share:before,
.share-box:before,
.social-share:before{
  flex:0 0 auto!important;
  margin:0 8px 0 0!important;
  font-size:16px!important;
}

@media(max-width:620px){
  .summary-share-icons a{
    width:36px!important;
    height:36px!important;
  }
  .summary-share-count{
    align-items:center!important;
  }
  .share-box-featured:before,
  .article-share:before,
  .share-box:before,
  .social-share:before{
    flex:0 0 100%!important;
    margin-bottom:6px!important;
  }
}


/* v41 logo + article share cleanup */

/* Keep hamburger and logo together at the far left */
.topbar{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:8px!important;
}
.topbar .icon-btn,
.topbar #menuToggle{
  flex:0 0 auto!important;
  order:1!important;
  margin-right:2px!important;
}
.topbar .brand{
  order:2!important;
  flex:0 0 auto!important;
  margin-left:0!important;
  margin-right:18px!important;
}
.topbar .top-search{
  order:3!important;
  margin-left:auto!important;
  margin-right:auto!important;
  width:min(760px,52vw)!important;
  max-width:760px!important;
  flex:0 1 760px!important;
}
.topbar .login-trigger,
.topbar #loginButton{
  order:4!important;
  flex:0 0 auto!important;
}

/* Summary share: one clean row inside Resumen card */
.summary-share-card.summary-share-simple,
.summary-share-simple{
  width:100%!important;
  box-sizing:border-box!important;
  margin:12px 0 0!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  grid-column:1 / -1!important;
  clear:both!important;
}
.summary-share-label{
  color:#0b2440!important;
  font-weight:950!important;
  font-size:15px!important;
  min-width:74px!important;
}
.summary-share-simple .summary-share-icons{
  display:flex!important;
  gap:8px!important;
  flex-wrap:wrap!important;
}
.summary-share-simple .summary-share-icons a{
  width:36px!important;
  height:36px!important;
  min-width:36px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:12px!important;
  color:#fff!important;
  font-weight:950!important;
  text-decoration:none!important;
  box-shadow:0 10px 22px rgba(15,66,120,.18)!important;
}
.summary-share-simple .summary-share-icons a:nth-child(1){background:#0a66c2!important}
.summary-share-simple .summary-share-icons a:nth-child(2){background:#1877f2!important}
.summary-share-simple .summary-share-icons a:nth-child(3){background:#111827!important}
.summary-share-simple .summary-share-icons a:nth-child(4){background:#0078d4!important}
.summary-share-simple .summary-share-title,
.summary-share-simple .summary-share-count{
  display:none!important;
}

/* Bottom share: same colorful icon style, more visible */
.share-box-featured,
.article-share,
.share-box,
.social-share{
  display:flex!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:10px!important;
  margin-top:34px!important;
  padding:22px 24px!important;
  border:2px solid rgba(0,120,212,.40)!important;
  border-radius:24px!important;
  background:linear-gradient(135deg,#ffffff,#eaf6ff)!important;
  box-shadow:0 22px 52px rgba(15,66,120,.14)!important;
}
.share-box-featured:before,
.article-share:before,
.share-box:before,
.social-share:before{
  content:"🚀 ¿Te ha resultado útil? Compártelo en redes:"!important;
  flex:0 0 auto!important;
  display:inline-flex!important;
  margin:0 6px 0 0!important;
  color:#0b2440!important;
  font-size:16px!important;
  font-weight:850!important;
}
.share-box-featured a,
.article-share a,
.share-box a,
.social-share a{
  min-width:40px!important;
  width:40px!important;
  height:40px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin:0!important;
  border:0!important;
  border-radius:13px!important;
  color:#fff!important;
  font-weight:950!important;
  font-size:14px!important;
  text-decoration:none!important;
  box-shadow:0 12px 24px rgba(15,66,120,.20)!important;
}
.share-box-featured a:nth-of-type(1),
.article-share a:nth-of-type(1),
.share-box a:nth-of-type(1),
.social-share a:nth-of-type(1){background:#0a66c2!important}
.share-box-featured a:nth-of-type(2),
.article-share a:nth-of-type(2),
.share-box a:nth-of-type(2),
.social-share a:nth-of-type(2){background:#1877f2!important}
.share-box-featured a:nth-of-type(3),
.article-share a:nth-of-type(3),
.share-box a:nth-of-type(3),
.social-share a:nth-of-type(3){background:#111827!important}
.share-box-featured a:nth-of-type(4),
.article-share a:nth-of-type(4),
.share-box a:nth-of-type(4),
.social-share a:nth-of-type(4){background:#0078d4!important}

@media(max-width:900px){
  .topbar .top-search{
    display:none!important;
  }
  .topbar .brand{
    margin-right:auto!important;
  }
}
@media(max-width:620px){
  .summary-share-card.summary-share-simple{
    align-items:flex-start!important;
    flex-direction:column!important;
  }
  .share-box-featured:before,
  .article-share:before,
  .share-box:before,
  .social-share:before{
    flex:0 0 100%!important;
    margin-bottom:6px!important;
  }
}


/* v42 topbar layout */
.topbar-v42{
  position:sticky!important;
  top:0!important;
  z-index:100!important;
  display:grid!important;
  grid-template-columns:auto minmax(280px,760px) auto!important;
  align-items:center!important;
  gap:18px!important;
  padding:10px 18px!important;
  background:#0078d4!important;
  border-bottom:1px solid rgba(0,0,0,.12)!important;
  box-shadow:0 6px 18px rgba(0,0,0,.12)!important;
}
.topbar-v42 .topbar-left{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  min-width:max-content!important;
}
.topbar-v42 .icon-btn{
  width:40px!important;
  height:40px!important;
  display:grid!important;
  place-items:center!important;
  border:0!important;
  border-radius:12px!important;
  background:rgba(255,255,255,.14)!important;
  color:#fff!important;
  font-size:22px!important;
  cursor:pointer!important;
}
.topbar-v42 .brand{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  color:#fff!important;
  text-decoration:none!important;
  margin:0!important;
}
.topbar-v42 .brand-icon{
  width:38px!important;
  height:38px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:12px!important;
  background:linear-gradient(135deg,#7cc3ff,#2b8fe8)!important;
  color:#fff!important;
  font-weight:950!important;
  font-size:22px!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)!important;
}
.topbar-v42 .brand strong{
  color:#fff!important;
  font-size:21px!important;
}
.topbar-v42 .topbar-search{
  justify-self:center!important;
  width:100%!important;
  max-width:760px!important;
  height:42px!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  padding:0 14px!important;
  box-sizing:border-box!important;
  border-radius:12px!important;
  border:1px solid rgba(255,255,255,.55)!important;
  background:rgba(255,255,255,.95)!important;
}
.topbar-v42 .topbar-search input{
  width:100%!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  font:inherit!important;
  color:#0b2440!important;
}
.topbar-v42 .search-icon{
  color:#005a9e!important;
}
.topbar-v42 .login-trigger{
  justify-self:end!important;
  width:42px!important;
  height:42px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:999px!important;
  border:1px solid rgba(255,255,255,.65)!important;
  background:rgba(255,255,255,.22)!important;
  color:#fff!important;
  cursor:pointer!important;
}
.topbar-v42 .login-popover{
  position:absolute!important;
  right:18px!important;
  top:62px!important;
  width:250px!important;
  padding:16px!important;
  border:1px solid #b8dcff!important;
  border-radius:18px!important;
  background:#fff!important;
  box-shadow:0 18px 42px rgba(15,66,120,.18)!important;
}
.topbar-v42 .login-popover input{
  width:100%!important;
  box-sizing:border-box!important;
  margin-top:10px!important;
  padding:10px!important;
  border:1px solid #d7e7f7!important;
  border-radius:10px!important;
}
.topbar-v42 .login-popover button{
  width:100%!important;
  margin-top:10px!important;
  padding:10px!important;
  border:0!important;
  border-radius:10px!important;
  background:#0078d4!important;
  color:#fff!important;
  font-weight:900!important;
}

/* v42 article share reset and clean layout */
.summary-share-card,
.summary-share-simple,
.summary-share-title,
.summary-share-count{
  display:none!important;
}
.summary-share-row-v42{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  padding:16px 18px!important;
  border-top:1px solid rgba(145,195,235,.5)!important;
  background:#fff!important;
}
.summary-share-row-v42 .summary-row-icon{
  width:38px!important;
  height:38px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:13px!important;
  background:#eaf6ff!important;
}
.summary-share-icons-v42{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  flex-wrap:wrap!important;
}
.summary-share-icons-v42 a,
.article-bottom-share-v42 a{
  width:40px!important;
  height:40px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:0!important;
  border-radius:13px!important;
  color:#fff!important;
  font-weight:950!important;
  text-decoration:none!important;
  box-shadow:0 12px 24px rgba(15,66,120,.20)!important;
}
.summary-share-icons-v42 a:nth-child(1),
.article-bottom-share-v42 a:nth-of-type(1){background:#0a66c2!important}
.summary-share-icons-v42 a:nth-child(2),
.article-bottom-share-v42 a:nth-of-type(2){background:#1877f2!important}
.summary-share-icons-v42 a:nth-child(3),
.article-bottom-share-v42 a:nth-of-type(3){background:#111827!important}
.summary-share-icons-v42 a:nth-child(4),
.article-bottom-share-v42 a:nth-of-type(4){background:#0078d4!important}

.article-bottom-share-v42{
  display:flex!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:10px!important;
  margin:34px 0 0!important;
  padding:22px 24px!important;
  border:2px solid rgba(0,120,212,.38)!important;
  border-radius:24px!important;
  background:linear-gradient(135deg,#ffffff,#eaf6ff)!important;
  box-shadow:0 22px 52px rgba(15,66,120,.14)!important;
}
.article-bottom-share-v42 strong{
  color:#0b2440!important;
  font-size:16px!important;
  margin-right:6px!important;
}

/* Disable older share box pseudo/old buttons if a legacy share box survives */
.share-box:not(.article-bottom-share-v42)::before,
.article-share:not(.article-bottom-share-v42)::before,
.social-share:not(.article-bottom-share-v42)::before{
  content:none!important;
}

/* article side summary width safety */
.summary-card,
.article-summary,
.quick-summary,
.aside-card{
  overflow:hidden!important;
}
.summary-card h2,
.article-summary h2,
.quick-summary h2,
.aside-card h2{
  word-break:normal!important;
}

/* responsive topbar */
@media(max-width:900px){
  .topbar-v42{
    grid-template-columns:auto 1fr auto!important;
    gap:10px!important;
    padding:10px 12px!important;
  }
  .topbar-v42 .topbar-search{
    display:none!important;
  }
  .topbar-v42 .brand strong{
    font-size:18px!important;
  }
}
@media(max-width:620px){
  .summary-share-row-v42{
    align-items:flex-start!important;
    flex-direction:column!important;
  }
  .article-bottom-share-v42 strong{
    flex:0 0 100%!important;
  }
}


/* v43 topbar controls */
.topbar-v42{
  grid-template-columns:auto minmax(320px,760px) auto!important;
}
.topbar-v42 .login-trigger{
  justify-self:end!important;
  margin-left:auto!important;
  display:grid!important;
}
.topbar-v42 .login-popover,
.login-popover{
  right:18px!important;
  top:62px!important;
  z-index:999!important;
}
.topbar-v42 .login-popover[hidden],
.login-popover[hidden]{
  display:none!important;
}
.topbar-v42 .login-popover.is-open,
.login-popover.is-open{
  display:block!important;
}

/* Hamburger collapses the left menu */
body.sidebar-collapsed .sidebar,
.layout.sidebar-collapsed .sidebar,
.sidebar.is-collapsed{
  display:none!important;
}
body.sidebar-collapsed .layout,
.layout.sidebar-collapsed{
  display:block!important;
}
body.sidebar-collapsed .content,
.layout.sidebar-collapsed .content{
  max-width:100%!important;
  width:100%!important;
}

/* v43 article layout: keep summary rows inside the right card */
.article-layout,
.article-shell{
  align-items:start!important;
}
.article-layout aside,
.article-aside,
.article-sidebar{
  align-self:start!important;
}
.summary-card,
.article-summary,
.quick-summary,
.aside-card{
  display:block!important;
  overflow:hidden!important;
  border-radius:22px!important;
  background:#fff!important;
  box-shadow:0 18px 42px rgba(15,66,120,.10)!important;
}
.summary-card h2,
.article-summary h2,
.quick-summary h2,
.aside-card h2{
  display:block!important;
  width:100%!important;
  margin:0!important;
  padding:22px 24px!important;
  box-sizing:border-box!important;
  border-bottom:1px solid rgba(145,195,235,.50)!important;
  color:#0b2440!important;
  font-size:24px!important;
  line-height:1.25!important;
}
.summary-row{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  width:100%!important;
  box-sizing:border-box!important;
  padding:16px 20px!important;
  border-bottom:1px solid rgba(145,195,235,.50)!important;
  background:#fff!important;
}
.summary-row .summary-row-icon,
.summary-row > span:first-child{
  flex:0 0 auto!important;
}
.summary-row strong{
  flex:0 0 auto!important;
  color:#0b2440!important;
}
.summary-row .pill,
.summary-row a,
.summary-row button{
  flex:0 0 auto!important;
}

/* Hide broken summary share remnants */
.summary-share-card,
.summary-share-simple,
.summary-share-row-v42{
  display:none!important;
}

/* Remove old pale upper share block, keep colored bottom only */
.share-box:not(.article-bottom-share-v42):not(.article-bottom-share-v43),
.article-share:not(.article-bottom-share-v42):not(.article-bottom-share-v43),
.social-share:not(.article-bottom-share-v42):not(.article-bottom-share-v43){
  display:none!important;
}

/* Colored bottom share block */
.article-bottom-share-v42,
.article-bottom-share-v43{
  display:flex!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:10px!important;
  margin:34px 0 0!important;
  padding:22px 24px!important;
  border:2px solid rgba(0,120,212,.38)!important;
  border-radius:24px!important;
  background:linear-gradient(135deg,#ffffff,#eaf6ff)!important;
  box-shadow:0 22px 52px rgba(15,66,120,.14)!important;
}
.article-bottom-share-v42 strong,
.article-bottom-share-v43 strong{
  color:#0b2440!important;
  font-size:16px!important;
  margin-right:6px!important;
}
.article-bottom-share-v42 a,
.article-bottom-share-v43 a{
  width:42px!important;
  height:42px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:0!important;
  border-radius:13px!important;
  color:#fff!important;
  font-weight:950!important;
  text-decoration:none!important;
  box-shadow:0 12px 24px rgba(15,66,120,.20)!important;
}
.article-bottom-share-v42 a:nth-of-type(1),
.article-bottom-share-v43 a:nth-of-type(1){background:#0a66c2!important}
.article-bottom-share-v42 a:nth-of-type(2),
.article-bottom-share-v43 a:nth-of-type(2){background:#1877f2!important}
.article-bottom-share-v42 a:nth-of-type(3),
.article-bottom-share-v43 a:nth-of-type(3){background:#111827!important}
.article-bottom-share-v42 a:nth-of-type(4),
.article-bottom-share-v43 a:nth-of-type(4){background:#0078d4!important}

/* Prevent old pseudo text in any legacy block */
.share-box:before,
.article-share:before,
.social-share:before{
  content:none!important;
}

@media(max-width:900px){
  .topbar-v42{
    grid-template-columns:auto 1fr auto!important;
  }
  .topbar-v42 .login-trigger{
    justify-self:end!important;
  }
  .topbar-v42 .topbar-left{
    min-width:0!important;
  }
  .summary-card h2,
  .article-summary h2,
  .quick-summary h2,
  .aside-card h2{
    font-size:22px!important;
  }
}
@media(max-width:620px){
  .article-bottom-share-v42 strong,
  .article-bottom-share-v43 strong{
    flex:0 0 100%!important;
  }
}


/* v44 topbar: login at absolute far right and nicer user/pass box */
.topbar-v42{
  display:grid!important;
  grid-template-columns:auto minmax(320px,820px) 52px!important;
  align-items:center!important;
  gap:18px!important;
  padding:10px 18px!important;
}
.topbar-v42 .topbar-left{
  justify-self:start!important;
}
.topbar-v42 .topbar-search{
  justify-self:center!important;
  width:min(820px,56vw)!important;
  max-width:820px!important;
}
.topbar-v42 .login-trigger,
#loginButton{
  justify-self:end!important;
  margin-left:auto!important;
  width:44px!important;
  height:44px!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.95)!important;
  color:#005a9e!important;
  border:1px solid rgba(255,255,255,.85)!important;
  box-shadow:0 10px 24px rgba(0,47,92,.18)!important;
  font-size:0!important;
  position:relative!important;
}
.topbar-v42 .login-trigger:before,
#loginButton:before{
  content:"🔐"!important;
  font-size:20px!important;
}
.topbar-v42 .login-popover,
.login-popover{
  position:absolute!important;
  right:18px!important;
  top:64px!important;
  width:300px!important;
  padding:20px!important;
  border:1px solid rgba(145,195,235,.95)!important;
  border-radius:22px!important;
  background:linear-gradient(135deg,#ffffff,#eef7ff)!important;
  box-shadow:0 24px 70px rgba(15,66,120,.25)!important;
  z-index:9999!important;
}
.topbar-v42 .login-popover strong,
.login-popover strong{
  display:block!important;
  margin-bottom:12px!important;
  color:#0b2440!important;
  font-size:20px!important;
}
.topbar-v42 .login-popover:before,
.login-popover:before{
  content:"Acceso de usuario";
  display:block;
  color:#005a9e;
  font-weight:950;
  font-size:12px;
  letter-spacing:.04em;
  text-transform:uppercase;
  margin-bottom:6px;
}
.topbar-v42 .login-popover input,
.login-popover input{
  width:100%!important;
  box-sizing:border-box!important;
  margin-top:10px!important;
  padding:12px 13px!important;
  border:1px solid #b8dcff!important;
  border-radius:13px!important;
  background:#fff!important;
  outline:none!important;
}
.topbar-v42 .login-popover button,
.login-popover button{
  width:100%!important;
  margin-top:14px!important;
  padding:12px!important;
  border:0!important;
  border-radius:13px!important;
  background:#0078d4!important;
  color:#fff!important;
  font-weight:950!important;
  cursor:pointer!important;
  box-shadow:0 14px 30px rgba(0,120,212,.24)!important;
}

/* v44 article: remove old pale share lines, keep one colored block */
.share-box,
.article-share,
.social-share{
  display:none!important;
}
.article-bottom-share-v42,
.article-bottom-share-v43{
  display:none!important;
}
.article-bottom-share-v44{
  display:flex!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:10px!important;
  margin:34px 0 0!important;
  padding:22px 24px!important;
  border:2px solid rgba(0,120,212,.42)!important;
  border-radius:24px!important;
  background:linear-gradient(135deg,#ffffff,#eaf6ff)!important;
  box-shadow:0 22px 52px rgba(15,66,120,.16)!important;
}
.article-bottom-share-v44 strong{
  color:#0b2440!important;
  font-size:16px!important;
  margin-right:8px!important;
}
.article-bottom-share-v44 a{
  width:42px!important;
  height:42px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:0!important;
  border-radius:13px!important;
  color:#fff!important;
  font-weight:950!important;
  text-decoration:none!important;
  box-shadow:0 12px 24px rgba(15,66,120,.22)!important;
}
.article-bottom-share-v44 a:nth-of-type(1){background:#0a66c2!important}
.article-bottom-share-v44 a:nth-of-type(2){background:#1877f2!important}
.article-bottom-share-v44 a:nth-of-type(3){background:#111827!important}
.article-bottom-share-v44 a:nth-of-type(4){background:#0078d4!important}

/* v44 article summary: restore right-card layout, rows stay inside card */
.article-layout{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 340px!important;
  gap:24px!important;
  align-items:start!important;
}
.article-layout > aside,
.article-layout .article-aside,
.article-layout .article-sidebar{
  display:block!important;
  width:100%!important;
  min-width:0!important;
}
.summary-card,
.article-summary,
.quick-summary,
.aside-card{
  display:block!important;
  width:100%!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  border:1px solid rgba(145,195,235,.85)!important;
  border-radius:22px!important;
  background:#fff!important;
  box-shadow:0 18px 42px rgba(15,66,120,.10)!important;
}
.summary-card h2,
.article-summary h2,
.quick-summary h2,
.aside-card h2{
  display:block!important;
  width:100%!important;
  box-sizing:border-box!important;
  margin:0!important;
  padding:20px 22px!important;
  border-bottom:1px solid rgba(145,195,235,.55)!important;
  color:#0b2440!important;
  font-size:24px!important;
  line-height:1.25!important;
}
.summary-row{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  width:100%!important;
  box-sizing:border-box!important;
  padding:16px 20px!important;
  border-bottom:1px solid rgba(145,195,235,.55)!important;
  background:#fff!important;
}
.summary-row .summary-row-icon,
.summary-row > span:first-child{
  flex:0 0 38px!important;
  width:38px!important;
  height:38px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:13px!important;
  background:#eaf6ff!important;
}
.summary-row strong{
  flex:0 0 auto!important;
  color:#0b2440!important;
}
.summary-row .pill,
.summary-row a,
.summary-row button{
  flex:0 0 auto!important;
  white-space:nowrap!important;
}

/* Hide injected/broken summary sharing */
.summary-share-card,
.summary-share-simple,
.summary-share-row-v42,
.summary-share-icons-v42{
  display:none!important;
}

@media(max-width:1100px){
  .article-layout{
    grid-template-columns:1fr!important;
  }
}
@media(max-width:900px){
  .topbar-v42{
    grid-template-columns:auto 1fr 48px!important;
  }
  .topbar-v42 .topbar-search{
    display:none!important;
  }
  .topbar-v42 .brand{
    margin-right:auto!important;
  }
}
@media(max-width:620px){
  .article-bottom-share-v44 strong{
    flex:0 0 100%!important;
  }
}


/* v45 definitive article repair */

/* Login: ensure far right and visible popover */
.topbar-v42{
  display:grid!important;
  grid-template-columns:auto minmax(320px,820px) 52px!important;
  align-items:center!important;
  width:100%!important;
}
.topbar-v42 .login-trigger,
#loginButton{
  display:grid!important;
  justify-self:end!important;
  align-self:center!important;
  margin-left:auto!important;
  z-index:1001!important;
  pointer-events:auto!important;
}
#loginPopover,
.login-popover{
  position:fixed!important;
  top:62px!important;
  right:18px!important;
  z-index:99999!important;
}
#loginPopover[hidden],
.login-popover[hidden]{
  display:none!important;
}
#loginPopover:not([hidden]),
.login-popover:not([hidden]),
#loginPopover.is-open,
.login-popover.is-open{
  display:block!important;
}

/* Article: do not let summary rows escape under content */
.article-shell,
main.article-shell,
.content.article-shell{
  max-width:none!important;
  width:100%!important;
  overflow-x:hidden!important;
}

/* Any article two-column container */
.article-layout{
  display:grid!important;
  grid-template-columns:minmax(0, 1fr) 340px!important;
  gap:24px!important;
  align-items:start!important;
  max-width:1420px!important;
  width:100%!important;
  margin:0 auto!important;
  padding:0 18px 42px!important;
  box-sizing:border-box!important;
}

/* Main card stays left */
.article-layout > :first-child,
.article-layout .article-main,
.article-layout .post-main,
.article-content-card{
  min-width:0!important;
  box-sizing:border-box!important;
}

/* Right sidebar forced as a vertical card column */
.article-layout > aside,
.article-layout .article-aside,
.article-layout .article-sidebar,
.article-layout .post-sidebar{
  display:flex!important;
  flex-direction:column!important;
  gap:18px!important;
  width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
  align-self:start!important;
}

/* Summary card: title + rows inside the same card */
.summary-card,
.article-summary,
.quick-summary,
.aside-card{
  display:block!important;
  width:100%!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  border:1px solid rgba(145,195,235,.85)!important;
  border-radius:22px!important;
  background:#fff!important;
  box-shadow:0 18px 42px rgba(15,66,120,.10)!important;
  margin:0!important;
}

/* Hide empty/duplicated summary-only card issue by making it the parent visual */
.summary-card h2,
.article-summary h2,
.quick-summary h2,
.aside-card h2{
  display:block!important;
  width:100%!important;
  box-sizing:border-box!important;
  margin:0!important;
  padding:20px 22px!important;
  border-bottom:1px solid rgba(145,195,235,.55)!important;
  color:#0b2440!important;
  font-size:24px!important;
  line-height:1.25!important;
  background:#fff!important;
}

.summary-row{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  width:100%!important;
  box-sizing:border-box!important;
  padding:16px 20px!important;
  border-bottom:1px solid rgba(145,195,235,.55)!important;
  background:#fff!important;
  margin:0!important;
}
.summary-row .summary-row-icon,
.summary-row > span:first-child{
  flex:0 0 38px!important;
  width:38px!important;
  height:38px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:13px!important;
  background:#eaf6ff!important;
}
.summary-row strong{
  color:#0b2440!important;
  white-space:nowrap!important;
}
.summary-row .pill,
.summary-row a,
.summary-row button{
  white-space:nowrap!important;
}

/* Important: if rows somehow appear after aside due to older CSS, keep them compact and aligned */
.article-layout > .summary-row{
  grid-column:2!important;
  width:100%!important;
  border:1px solid rgba(145,195,235,.55)!important;
}

/* Related articles card belongs in the right column when inside article layout */
.article-layout .related-articles,
.article-layout #relatedArticles,
.article-layout .related-card{
  width:100%!important;
  box-sizing:border-box!important;
  border:1px solid rgba(145,195,235,.85)!important;
  border-radius:22px!important;
  background:#fff!important;
  box-shadow:0 18px 42px rgba(15,66,120,.08)!important;
  overflow:hidden!important;
}

/* If related articles are outside layout, keep them styled but not broken */
.related-articles,
#relatedArticles{
  border:1px solid rgba(145,195,235,.85)!important;
  border-radius:22px!important;
  background:#fff!important;
  box-shadow:0 18px 42px rgba(15,66,120,.08)!important;
  overflow:hidden!important;
}

/* Remove every old pale share block */
.share-box,
.article-share,
.social-share,
.summary-share-card,
.summary-share-simple,
.summary-share-row-v42,
.summary-share-icons-v42,
.article-bottom-share-v42,
.article-bottom-share-v43,
.article-bottom-share-v44{
  display:none!important;
}

/* Keep exactly the new colored share block */
.article-bottom-share-v45{
  display:flex!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:10px!important;
  margin:34px 0 0!important;
  padding:22px 24px!important;
  border:2px solid rgba(0,120,212,.42)!important;
  border-radius:24px!important;
  background:linear-gradient(135deg,#ffffff,#eaf6ff)!important;
  box-shadow:0 22px 52px rgba(15,66,120,.16)!important;
}
.article-bottom-share-v45 strong{
  color:#0b2440!important;
  font-size:16px!important;
  margin-right:8px!important;
}
.article-bottom-share-v45 a{
  width:42px!important;
  height:42px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:0!important;
  border-radius:13px!important;
  color:#fff!important;
  font-weight:950!important;
  text-decoration:none!important;
  box-shadow:0 12px 24px rgba(15,66,120,.22)!important;
}
.article-bottom-share-v45 a:nth-of-type(1){background:#0a66c2!important}
.article-bottom-share-v45 a:nth-of-type(2){background:#1877f2!important}
.article-bottom-share-v45 a:nth-of-type(3){background:#111827!important}
.article-bottom-share-v45 a:nth-of-type(4){background:#0078d4!important}

/* Runtime rescue: rows wrapper created by JS */
.summary-rows-v45{
  display:block!important;
  width:100%!important;
}

@media(max-width:1100px){
  .article-layout{
    grid-template-columns:1fr!important;
  }
  .article-layout > .summary-row{
    grid-column:auto!important;
  }
}
@media(max-width:900px){
  .topbar-v42{
    grid-template-columns:auto 1fr 52px!important;
  }
  .topbar-v42 .topbar-search{
    display:none!important;
  }
}
@media(max-width:620px){
  .article-bottom-share-v45 strong{
    flex:0 0 100%!important;
  }
}

/* v47 ensure header layout: hamburger+logo left, search center, login right */
.topbar{
  display:grid!important;
  grid-template-columns:auto 1fr auto!important;
  align-items:center!important;
  gap:12px!important;
}
.topbar .hamburger{justify-self:start}
.topbar .brand{justify-self:start; margin-left:6px}
.topbar .search{justify-self:center; width:min(820px,60vw)}
.topbar .top-icons{justify-self:end}
.topbar .login-icon{margin-left:auto}


/* v48 article premium right rail + colored share */
.right-rail{
  display:flex!important;
  flex-direction:column!important;
  gap:18px!important;
}
.right-rail .panel{
  border:1px solid rgba(145,195,235,.9)!important;
  border-radius:24px!important;
  background:linear-gradient(135deg,#ffffff,#f4fbff)!important;
  box-shadow:0 18px 46px rgba(15,66,120,.10)!important;
  overflow:hidden!important;
}
.right-rail .panel-head{
  padding:20px 22px!important;
  border-bottom:1px solid rgba(145,195,235,.55)!important;
  background:#fff!important;
}
.right-rail .panel-head h2{
  margin:0!important;
  color:#0b2440!important;
  font-size:22px!important;
}
.rail-item{
  padding:16px 20px!important;
  border-bottom:1px solid rgba(145,195,235,.45)!important;
}
.rail-inline{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
}
.rail-icon{
  width:38px!important;
  height:38px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:13px!important;
  background:#e8f4ff!important;
  color:#005a9e!important;
}
.quick-tag{
  display:inline-flex!important;
  align-items:center!important;
  padding:6px 10px!important;
  border-radius:999px!important;
  background:#e8f4ff!important;
  border:1px solid #a8d6ff!important;
  color:#005a9e!important;
  font-weight:850!important;
  text-decoration:none!important;
}
.share-bottom{
  margin-top:30px!important;
  padding:22px 24px!important;
  border:2px solid rgba(0,120,212,.42)!important;
  border-radius:24px!important;
  background:linear-gradient(135deg,#ffffff,#eaf6ff)!important;
  box-shadow:0 22px 52px rgba(15,66,120,.14)!important;
  display:flex!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:10px!important;
}
.share-bottom span{
  color:#0b2440!important;
  font-weight:850!important;
  margin-right:8px!important;
}
.share-btn{
  width:42px!important;
  height:42px!important;
  border:0!important;
  border-radius:13px!important;
  color:#fff!important;
  font-weight:950!important;
  cursor:pointer!important;
  box-shadow:0 12px 24px rgba(15,66,120,.22)!important;
}
.share-linkedin{background:#0a66c2!important}
.share-facebook{background:#1877f2!important}
.share-whatsapp{background:#16a34a!important}
.share-copy{background:#0078d4!important}
.compact-related a,
.related a{
  display:block!important;
  padding:14px 18px!important;
  border-bottom:1px solid rgba(145,195,235,.45)!important;
  text-decoration:none!important;
}
.rail-empty{
  padding:16px 20px!important;
  color:#506784!important;
}

/* v48 home extra learning sections */
.azure-learning-lanes,
.mini-carousel-section,
.azure-toolbox{
  margin:22px 0!important;
  padding:26px!important;
  border:1px solid rgba(145,195,235,.85)!important;
  border-radius:26px!important;
  background:linear-gradient(135deg,#ffffff,#f3faff)!important;
  box-shadow:0 18px 48px rgba(15,66,120,.08)!important;
}
.lane-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:16px!important;
  margin-top:18px!important;
}
.lane-card,
.toolbox-card{
  display:grid!important;
  gap:8px!important;
  padding:18px!important;
  border:1px solid #b8dcff!important;
  border-radius:20px!important;
  background:#fff!important;
  text-decoration:none!important;
  color:#0b2440!important;
  box-shadow:0 14px 34px rgba(15,66,120,.07)!important;
  transition:transform .18s ease, box-shadow .18s ease!important;
}
.lane-card:hover,
.toolbox-card:hover,
.micro-card:hover{
  transform:translateY(-4px)!important;
  box-shadow:0 22px 46px rgba(15,66,120,.13)!important;
}
.lane-icon,
.toolbox-card span{
  width:46px!important;
  height:46px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:15px!important;
  background:#e8f4ff!important;
  font-size:23px!important;
}
.lane-card strong,
.toolbox-card strong{
  font-size:18px!important;
}
.lane-card small,
.toolbox-card small{
  color:#506784!important;
  line-height:1.45!important;
}
.mini-carousel-section .carousel-head{
  display:flex!important;
  justify-content:space-between!important;
  align-items:flex-end!important;
  gap:16px!important;
}
.mini-carousel-track{
  display:flex!important;
  gap:16px!important;
  overflow-x:auto!important;
  scroll-snap-type:x mandatory!important;
  padding:18px 4px 6px!important;
}
.micro-card{
  flex:0 0 310px!important;
  scroll-snap-align:start!important;
  padding:20px!important;
  border-radius:22px!important;
  border:1px solid #b8dcff!important;
  background:#fff!important;
  box-shadow:0 14px 34px rgba(15,66,120,.08)!important;
}
.micro-card span{
  width:44px!important;
  height:44px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:14px!important;
  background:#0078d4!important;
  color:white!important;
  font-weight:950!important;
}
.micro-card h3{
  margin:14px 0 8px!important;
  color:#0b2440!important;
}
.micro-card p{
  color:#506784!important;
  line-height:1.55!important;
}
.micro-card a{
  color:#005a9e!important;
  font-weight:950!important;
  text-decoration:none!important;
}
.mini-carousel-btn{
  width:42px!important;
  height:42px!important;
  border-radius:999px!important;
  border:1px solid #b8dcff!important;
  background:#fff!important;
  color:#005a9e!important;
  font-size:24px!important;
  cursor:pointer!important;
}
.toolbox-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:16px!important;
  margin-top:18px!important;
}

@media(max-width:1100px){
  .lane-grid,
  .toolbox-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media(max-width:760px){
  .azure-learning-lanes,
  .mini-carousel-section,
  .azure-toolbox{
    padding:20px!important;
  }
  .lane-grid,
  .toolbox-grid{
    grid-template-columns:1fr!important;
  }
  .mini-carousel-section .carousel-head{
    align-items:flex-start!important;
    flex-direction:column!important;
  }
  .micro-card{
    flex-basis:86%!important;
  }
  .share-bottom span{
    flex:0 0 100%!important;
  }
}


/* v49 requested cleanup */
.azure-learning-lanes,
.mini-carousel-section,
.azure-toolbox{
  display:none!important;
}

/* v49 new idea blocks below carousel */
.cloud-dashboard-preview,
.scenario-lab-strip,
.decision-helper{
  margin:22px 0!important;
  padding:26px!important;
  border:1px solid rgba(145,195,235,.85)!important;
  border-radius:26px!important;
  background:linear-gradient(135deg,#ffffff,#f3faff)!important;
  box-shadow:0 18px 48px rgba(15,66,120,.08)!important;
}
.progress-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:16px!important;
  margin-top:18px!important;
}
.progress-card{
  padding:20px!important;
  border:1px solid #b8dcff!important;
  border-radius:22px!important;
  background:#fff!important;
  box-shadow:0 14px 34px rgba(15,66,120,.07)!important;
}
.progress-ring{
  width:72px!important;
  height:72px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:999px!important;
  color:#005a9e!important;
  font-weight:950!important;
  background:radial-gradient(circle at center,#fff 58%,transparent 60%), conic-gradient(#0078d4 0 260deg,#d8ecff 260deg 360deg)!important;
  margin-bottom:14px!important;
}
.progress-card strong{
  display:block!important;
  color:#0b2440!important;
  font-size:18px!important;
}
.progress-card small{
  display:block!important;
  margin-top:8px!important;
  color:#506784!important;
  line-height:1.45!important;
}
.scenario-lab-strip{
  display:grid!important;
  grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr)!important;
  gap:20px!important;
  align-items:center!important;
}
.scenario-copy h2,
.decision-helper h2,
.cloud-dashboard-preview h2{
  margin:8px 0!important;
  color:#0b2440!important;
}
.scenario-copy p,
.decision-helper p,
.cloud-dashboard-preview p{
  color:#506784!important;
  line-height:1.6!important;
}
.scenario-list{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:14px!important;
}
.scenario-list a{
  padding:18px!important;
  border:1px solid #b8dcff!important;
  border-radius:20px!important;
  background:#fff!important;
  text-decoration:none!important;
  color:#0b2440!important;
  box-shadow:0 14px 34px rgba(15,66,120,.07)!important;
}
.scenario-list span{
  width:44px!important;
  height:44px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:15px!important;
  background:#e8f4ff!important;
  margin-bottom:10px!important;
}
.scenario-list strong,
.scenario-list small{
  display:block!important;
}
.scenario-list small{
  color:#506784!important;
  margin-top:6px!important;
}
.decision-helper{
  display:grid!important;
  grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr)!important;
  gap:20px!important;
  align-items:center!important;
}
.decision-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:12px!important;
}
.decision-grid a{
  padding:16px!important;
  border:1px solid #b8dcff!important;
  border-radius:18px!important;
  background:#fff!important;
  color:#005a9e!important;
  font-weight:950!important;
  text-decoration:none!important;
  box-shadow:0 14px 34px rgba(15,66,120,.07)!important;
}

/* article uses same global header/sidebar as category */
body .topbar .top-icons,
body .topbar .login-icon{
  margin-left:auto!important;
}

@media(max-width:1100px){
  .progress-grid,
  .scenario-list{
    grid-template-columns:1fr!important;
  }
  .scenario-lab-strip,
  .decision-helper{
    grid-template-columns:1fr!important;
  }
  .decision-grid{
    grid-template-columns:1fr 1fr!important;
  }
}
@media(max-width:700px){
  .cloud-dashboard-preview,
  .scenario-lab-strip,
  .decision-helper{
    padding:20px!important;
  }
  .decision-grid{
    grid-template-columns:1fr!important;
  }
}


/* v51 pro user dashboard */
.dashboard-page{
  background:#f5f9ff;
}
.dashboard-topbar{
  box-shadow:0 8px 24px rgba(0,40,80,.12);
}
.dashboard-layout{
  align-items:stretch;
}
.dashboard-sidebar .sidebar-greeting{
  display:grid;
  gap:4px;
}
.dashboard-sidebar .sidebar-greeting small{
  color:#6b7f99;
}
.dashboard-main{
  min-width:0;
}
.dashboard-wrap{
  max-width:1380px;
  margin:0 auto;
  padding:24px;
}
.dashboard-hero{
  display:grid;
  grid-template-columns:minmax(0,1fr) 260px;
  gap:22px;
  align-items:stretch;
  padding:30px;
  border:1px solid rgba(145,195,235,.85);
  border-radius:28px;
  background:
    radial-gradient(circle at 92% 10%, rgba(0,120,212,.18), transparent 30%),
    linear-gradient(135deg,#ffffff,#eef7ff);
  box-shadow:0 18px 48px rgba(15,66,120,.08);
}
.dashboard-hero h1{
  margin:8px 0 10px;
  font-size:42px;
  line-height:1.1;
  color:#0b2440;
}
.dashboard-hero p{
  max-width:820px;
  color:#506784;
  line-height:1.65;
  font-size:17px;
}
.dashboard-hero-card{
  display:grid;
  align-content:center;
  gap:8px;
  padding:22px;
  border-radius:24px;
  background:#fff;
  border:1px solid #b8dcff;
  box-shadow:0 16px 36px rgba(15,66,120,.10);
}
.dashboard-hero-card span{
  color:#506784;
  font-weight:800;
}
.dashboard-hero-card strong{
  font-size:42px;
  color:#0078d4;
}
.dashboard-hero-card small{
  color:#506784;
}
.dashboard-kpis{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
  margin:22px 0;
}
.dashboard-kpis article{
  display:grid;
  gap:7px;
  padding:20px;
  border:1px solid rgba(145,195,235,.85);
  border-radius:22px;
  background:#fff;
  box-shadow:0 14px 34px rgba(15,66,120,.07);
}
.dashboard-kpis span{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border-radius:15px;
  background:#e8f4ff;
  font-size:22px;
}
.dashboard-kpis strong{
  font-size:28px;
  color:#0b2440;
}
.dashboard-kpis small{
  color:#506784;
  font-weight:800;
}
.dashboard-grid{
  display:grid;
  grid-template-columns:1.35fr 1fr;
  gap:18px;
}
.dashboard-panel{
  padding:22px;
  border:1px solid rgba(145,195,235,.85);
  border-radius:24px;
  background:#fff;
  box-shadow:0 16px 38px rgba(15,66,120,.08);
}
.large-panel{
  grid-row:span 2;
}
.dashboard-panel .panel-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-bottom:16px;
  padding:0;
  border:0;
}
.dashboard-panel h2{
  margin:0;
  color:#0b2440;
  font-size:22px;
}
.panel-pill{
  padding:6px 10px;
  border-radius:999px;
  color:#005a9e;
  background:#e8f4ff;
  border:1px solid #b8dcff;
  font-weight:900;
  font-size:12px;
}
.skill-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) 54px;
  gap:8px 12px;
  align-items:center;
  padding:14px 0;
  border-bottom:1px solid #edf4fb;
}
.skill-row strong,
.lab-status strong{
  color:#0b2440;
}
.skill-row small,
.lab-status span,
.muted{
  color:#506784;
}
.bar{
  grid-column:1 / -1;
  height:10px;
  border-radius:999px;
  background:#e8f4ff;
  overflow:hidden;
}
.bar i{
  display:block;
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg,#0078d4,#65baff);
}
.next-card{
  display:grid;
  gap:10px;
}
.next-card span{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:16px;
  background:#e8f4ff;
  font-size:24px;
}
.next-card strong{
  color:#0b2440;
  font-size:20px;
}
.next-card p{
  color:#506784;
  line-height:1.55;
}
.next-card a,
.dashboard-link{
  color:#005a9e;
  font-weight:950;
  text-decoration:none;
}
.dash-list{
  display:grid;
}
.dash-list a{
  padding:12px 0;
  color:#0b2440;
  text-decoration:none;
  border-bottom:1px solid #edf4fb;
}
.lab-status{
  display:grid;
  gap:10px;
  padding:12px 0;
}
.lab-status div:first-child{
  display:flex;
  justify-content:space-between;
  gap:10px;
}
.cert-path{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-bottom:14px;
}
.cert-path a{
  padding:10px 14px;
  border-radius:999px;
  background:#e8f4ff;
  color:#005a9e;
  text-decoration:none;
  font-weight:950;
  border:1px solid #b8dcff;
}
.cert-path a.active{
  background:#0078d4;
  color:white;
}
.activity-list{
  margin:0;
  padding-left:20px;
  color:#506784;
  line-height:1.8;
}
@media(max-width:1100px){
  .dashboard-hero,
  .dashboard-grid{
    grid-template-columns:1fr;
  }
  .dashboard-kpis{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:760px){
  .dashboard-wrap{
    padding:14px;
  }
  .dashboard-hero{
    padding:22px;
  }
  .dashboard-hero h1{
    font-size:32px;
  }
  .dashboard-kpis{
    grid-template-columns:1fr;
  }
}


/* v52: Empieza Aquí in left menu must not be highlighted by default */
.sidebar a[href*="ithub.es"],
.sidebar .nav-item[href*="ithub.es"],
.sidebar a[href="http://ithub.es"],
.sidebar a[href="https://ithub.es"]{
  background:transparent!important;
  box-shadow:none!important;
  color:inherit!important;
  border-color:transparent!important;
}
.sidebar a[href*="ithub.es"].active,
.sidebar .nav-item[href*="ithub.es"].active,
.sidebar a[href*="ithub.es"].current,
.sidebar a[href*="ithub.es"].selected,
.sidebar a[href*="ithub.es"].is-active{
  background:transparent!important;
  box-shadow:none!important;
  color:inherit!important;
  border-color:transparent!important;
}
.sidebar a[href*="ithub.es"]:hover,
.sidebar .nav-item[href*="ithub.es"]:hover{
  background:#e8f4ff!important;
  color:#005a9e!important;
  border-color:#b8dcff!important;
}


/* v54: guided route, carousel and category redesign */
.category-hero-v54{
  display:grid;
  grid-template-columns:minmax(0,1fr) 180px;
  gap:18px;
  align-items:center;
  padding:30px;
  border:1px solid rgba(145,195,235,.85);
  border-radius:28px;
  background:
    radial-gradient(circle at 92% 12%, rgba(0,120,212,.18), transparent 32%),
    linear-gradient(135deg,#ffffff,#eef7ff);
  box-shadow:0 18px 48px rgba(15,66,120,.08);
  margin-bottom:18px;
}
.category-hero-v54 h1{
  margin:8px 0 10px;
  font-size:42px;
  line-height:1.1;
  color:#0b2440;
}
.category-hero-v54 p{
  margin:0;
  color:#506784;
  line-height:1.6;
}
.category-hero-stats{
  display:grid;
  place-items:center;
  gap:4px;
  padding:20px;
  border-radius:24px;
  background:#fff;
  border:1px solid #b8dcff;
  box-shadow:0 14px 34px rgba(15,66,120,.08);
}
.category-hero-stats span{
  font-size:44px;
  font-weight:950;
  color:#0078d4;
}
.category-hero-stats small{
  color:#506784;
  font-weight:850;
  text-align:center;
}
.category-toolbar-v54{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
  padding:16px;
  border:1px solid rgba(145,195,235,.85);
  border-radius:22px;
  background:#fff;
  box-shadow:0 14px 34px rgba(15,66,120,.06);
  margin-bottom:18px;
}
.category-searchbox{
  flex:1;
  min-width:260px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:11px 14px;
  border-radius:15px;
  background:#f4faff;
  border:1px solid #b8dcff;
}
.category-searchbox input{
  width:100%;
  border:0;
  outline:0;
  background:transparent;
  font:inherit;
}
.category-sort{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.category-chip{
  border:1px solid #b8dcff;
  background:#fff;
  color:#005a9e;
  border-radius:999px;
  padding:10px 13px;
  font-weight:900;
  cursor:pointer;
}
.category-chip.active{
  background:#0078d4;
  color:#fff;
  border-color:#0078d4;
}
.category-layout-v54{
  display:grid;
  grid-template-columns:minmax(0,1fr) 300px;
  gap:20px;
  align-items:start;
}
.category-card-grid-v54{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.category-card-v54{
  display:flex;
  flex-direction:column;
  min-height:260px;
  padding:20px;
  border:1px solid rgba(145,195,235,.85);
  border-radius:24px;
  background:#fff;
  color:#0b2440;
  text-decoration:none;
  box-shadow:0 16px 38px rgba(15,66,120,.08);
  transition:transform .18s ease, box-shadow .18s ease;
}
.category-card-v54:hover{
  transform:translateY(-5px);
  box-shadow:0 24px 54px rgba(15,66,120,.15);
}
.category-card-top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-bottom:16px;
}
.category-card-icon{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:16px;
  background:#e8f4ff;
  font-size:24px;
}
.category-card-pill{
  padding:7px 10px;
  border-radius:999px;
  background:#e8f4ff;
  border:1px solid #b8dcff;
  color:#005a9e;
  font-weight:850;
  font-size:12px;
}
.category-card-v54 h3{
  margin:0 0 10px;
  font-size:20px;
  line-height:1.25;
}
.category-card-v54 p{
  color:#506784;
  line-height:1.5;
  margin:0 0 16px;
  display:-webkit-box;
  -webkit-line-clamp:4;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.category-card-meta{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:auto;
  color:#506784;
  font-size:12px;
  font-weight:800;
}
.category-card-meta span{
  padding:6px 8px;
  border-radius:999px;
  background:#f4faff;
}
.category-side-v54{
  display:grid;
  gap:16px;
}
.side-card-v54{
  padding:20px;
  border:1px solid rgba(145,195,235,.85);
  border-radius:22px;
  background:#fff;
  box-shadow:0 16px 38px rgba(15,66,120,.08);
}
.side-card-v54 h3{
  margin:0 0 10px;
  color:#0b2440;
}
.side-card-v54 p{
  color:#506784;
  line-height:1.55;
}
.side-card-v54 a{
  display:block;
  padding:11px 0;
  color:#005a9e;
  font-weight:900;
  text-decoration:none;
  border-top:1px solid #edf4fb;
}
.category-pagination-v54{
  margin-top:18px;
}

/* Empieza Aquí never highlighted by default */
.sidebar a[href*="ithub.es"],
.sidebar .nav-item[href*="ithub.es"]{
  background:transparent!important;
  box-shadow:none!important;
  color:inherit!important;
  border-color:transparent!important;
}
.sidebar a[href*="ithub.es"].active,
.sidebar .nav-item[href*="ithub.es"].active{
  background:transparent!important;
  box-shadow:none!important;
  color:inherit!important;
}
.sidebar a[href*="ithub.es"]:hover{
  background:#e8f4ff!important;
  color:#005a9e!important;
}

@media(max-width:1200px){
  .category-card-grid-v54{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .category-layout-v54{
    grid-template-columns:1fr;
  }
}
@media(max-width:760px){
  .category-hero-v54{
    grid-template-columns:1fr;
    padding:22px;
  }
  .category-hero-v54 h1{
    font-size:32px;
  }
  .category-card-grid-v54{
    grid-template-columns:1fr;
  }
  .category-toolbar-v54{
    align-items:stretch;
  }
}


/* v55 carousel dinamismo */
#latestCarouselTrack{
  scroll-behavior:smooth!important;
  scroll-snap-type:x mandatory!important;
}
#latestCarouselTrack .saas-card,
#latestCarouselTrack [data-carousel-card]{
  scroll-snap-align:start!important;
}
.carousel-btn{
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease!important;
}
.carousel-btn:hover{
  transform:translateY(-2px) scale(1.04)!important;
  box-shadow:0 14px 28px rgba(0,120,212,.18)!important;
}


/* v56 carousel: more dynamic movement */
#latestCarouselTrack{
  scroll-behavior:smooth!important;
  scroll-snap-type:x mandatory!important;
}
#latestCarouselTrack .saas-card,
#latestCarouselTrack [data-carousel-card]{
  scroll-snap-align:start!important;
  transition:transform .28s ease, box-shadow .28s ease, filter .28s ease!important;
}
#latestCarouselTrack.carousel-moving .saas-card{
  transform:translateY(-3px) scale(1.01)!important;
}
#latestCarouselTrack .saas-card:hover{
  transform:translateY(-7px) scale(1.015)!important;
}

/* v56 scenario boxes: icon and title aligned on same line */
.scenario-list a{
  display:grid!important;
  grid-template-columns:46px minmax(0,1fr)!important;
  grid-template-areas:
    "icon title"
    "icon text"!important;
  align-items:center!important;
  column-gap:14px!important;
}
.scenario-list a span:first-child{
  grid-area:icon!important;
  margin:0!important;
}
.scenario-list a strong{
  grid-area:title!important;
  align-self:end!important;
  margin:0!important;
}
.scenario-list a small{
  grid-area:text!important;
  align-self:start!important;
  margin-top:4px!important;
}

/* v56 lab absolute link safe style */
a[href="/lab-vpn-s2s-aws-azure.html"]{
  cursor:pointer;
}


/* v57 logo */
.brand-logo{
  display:flex!important;
  align-items:center!important;
  text-decoration:none!important;
  min-width:286px!important;
}
.brand-logo img{
  display:block!important;
  height:54px!important;
  width:auto!important;
  max-width:286px!important;
}
.topbar-v42 .brand-logo{
  margin:0!important;
}

/* v57 carousel reliable dynamics */
#latestCarouselTrack{
  scroll-behavior:smooth!important;
  scroll-snap-type:x mandatory!important;
  overflow-x:auto!important;
}
#latestCarouselTrack .saas-card{
  scroll-snap-align:start!important;
  transition:transform .28s ease, box-shadow .28s ease, filter .28s ease!important;
}
#latestCarouselTrack.carousel-moving .saas-card{
  transform:translateY(-3px) scale(1.01)!important;
}
.carousel-dots{
  display:flex!important;
  justify-content:center!important;
  gap:8px!important;
  padding:14px 0 4px!important;
}
.carousel-dots span{
  width:9px!important;
  height:9px!important;
  border-radius:99px!important;
  background:#b8d3ec!important;
  transition:width .2s ease, background .2s ease!important;
}
.carousel-dots span.active{
  width:26px!important;
  background:#0078d4!important;
}
@media(max-width:760px){
  .brand-logo{
    min-width:190px!important;
  }
  .brand-logo img{
    max-width:190px!important;
    height:42px!important;
  }
}


/* v58: restore previous text logo and hide carousel scrollbar */
.brand-logo,
.brand-logo img{
  display:none!important;
}
.topbar .brand,
.topbar-v42 .brand{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  color:#fff!important;
  text-decoration:none!important;
}
.topbar .brand-icon,
.topbar-v42 .brand-icon{
  width:38px!important;
  height:38px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:12px!important;
  background:linear-gradient(135deg,#7cc3ff,#2b8fe8)!important;
  color:#fff!important;
  font-weight:950!important;
  font-size:22px!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)!important;
}
.topbar .brand strong,
.topbar-v42 .brand strong{
  color:#fff!important;
  font-size:21px!important;
}

#latestCarouselTrack{
  scrollbar-width:none!important;
  -ms-overflow-style:none!important;
}
#latestCarouselTrack::-webkit-scrollbar{
  display:none!important;
  width:0!important;
  height:0!important;
}
.carousel-shell{
  overflow:hidden!important;
}


/* v60 sidebar restored + v59 visual polish safely applied */

/* More bottom breathing room under carousel dots */
.latest-carousel-section,
.saas-carousel-section,
.carousel-section{
  padding-bottom:34px!important;
}
.carousel-shell{
  padding-bottom:24px!important;
}
.carousel-dots{
  padding:18px 0 22px!important;
  margin-bottom:12px!important;
}

/* Carousel cards: start directly with title, no first label line */
.saas-card-line{
  display:none!important;
}
.saas-card-body h3{
  margin-top:0!important;
}

/* Carousel meta: aligned and evenly spaced */
.saas-card-meta{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:10px!important;
  flex-wrap:wrap!important;
  margin-top:14px!important;
  padding-top:12px!important;
  border-top:1px solid rgba(145,195,235,.45)!important;
  color:#506784!important;
  font-size:12px!important;
  font-weight:800!important;
}
.saas-card-meta span{
  display:inline-flex!important;
  align-items:center!important;
  gap:4px!important;
  margin:0!important;
  white-space:nowrap!important;
  padding:0!important;
}
.saas-card-meta .meta-views,
.saas-card-meta span:nth-child(3){
  color:#005a9e!important;
  font-weight:950!important;
}

/* Footer right aligned across all pages */
.footer,
.site-footer,
footer{
  text-align:right!important;
  justify-content:flex-end!important;
}
.footer{
  padding-right:22px!important;
}

/* Keep sidebar fully visible */
.sidebar{
  display:block!important;
}
.sidebar .nav-item{
  display:flex!important;
}
.sidebar .nav-item:empty{
  display:none!important;
}


/* v61 definitive sidebar repair */
.layout{
  display:grid!important;
  grid-template-columns:250px minmax(0,1fr)!important;
  min-height:calc(100vh - 64px)!important;
  align-items:start!important;
}
.sidebar{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  position:sticky!important;
  top:64px!important;
  align-self:start!important;
  width:250px!important;
  min-width:250px!important;
  max-width:250px!important;
  height:calc(100vh - 64px)!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  z-index:20!important;
  background:#ffffff!important;
  border-right:1px solid #cfe7ff!important;
  padding:18px 10px!important;
  box-sizing:border-box!important;
  transform:none!important;
  clip:auto!important;
  clip-path:none!important;
}
.main,
.content{
  min-width:0!important;
}
.sidebar-greeting{
  display:block!important;
  padding:16px 14px!important;
  margin:0 0 18px!important;
  border:1px solid #b8dcff!important;
  border-radius:18px!important;
  background:#fff!important;
  color:#0b2440!important;
  box-shadow:0 10px 22px rgba(15,66,120,.05)!important;
}
.sidebar-greeting strong{
  display:block!important;
  font-size:17px!important;
}
.side-label{
  display:block!important;
  margin:18px 8px 10px!important;
  color:#506784!important;
  font-size:12px!important;
  letter-spacing:.06em!important;
  text-transform:uppercase!important;
}
.nav-item,
.sidebar .nav-item,
.sidebar-more .nav-item{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  width:100%!important;
  min-height:38px!important;
  padding:8px 10px!important;
  margin:2px 0!important;
  box-sizing:border-box!important;
  border-radius:13px!important;
  color:#0b2440!important;
  text-decoration:none!important;
  background:transparent!important;
  border:1px solid transparent!important;
  box-shadow:none!important;
}
.nav-item:hover,
.sidebar .nav-item:hover{
  background:#e8f4ff!important;
  border-color:#b8dcff!important;
  color:#005a9e!important;
}
.nav-item.active,
.sidebar .nav-item.active{
  background:#e8f4ff!important;
  border-color:#b8dcff!important;
  color:#005a9e!important;
}
.nav-left{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  min-width:0!important;
}
.nav-left span:last-child{
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.count{
  flex:0 0 auto!important;
  min-width:26px!important;
  height:24px!important;
  display:inline-grid!important;
  place-items:center!important;
  border-radius:999px!important;
  background:#e8f4ff!important;
  border:1px solid #b8dcff!important;
  color:#005a9e!important;
  font-size:12px!important;
  font-weight:900!important;
}
.sidebar-more{
  display:block!important;
}
.sidebar-more summary{
  list-style:none!important;
  cursor:pointer!important;
  text-align:center!important;
  margin:10px 0!important;
  padding:10px 12px!important;
  border-radius:14px!important;
  border:1px solid #b8dcff!important;
  color:#005a9e!important;
  background:#fff!important;
  font-weight:900!important;
}
.sidebar-more summary::-webkit-details-marker{
  display:none!important;
}

/* Never highlight external simulator by default */
.sidebar a[href*="ithub.es"]{
  background:transparent!important;
  box-shadow:none!important;
  color:#0b2440!important;
  border-color:transparent!important;
}

/* Mobile: sidebar becomes off-canvas, hamburger toggles body.sidebar-open */
@media(max-width:900px){
  .layout{
    display:block!important;
  }
  .sidebar{
    position:fixed!important;
    left:0!important;
    top:60px!important;
    height:calc(100vh - 60px)!important;
    transform:translateX(-105%)!important;
    transition:transform .22s ease!important;
    box-shadow:18px 0 48px rgba(15,66,120,.18)!important;
  }
  body.sidebar-open .sidebar,
  .sidebar.is-open{
    transform:translateX(0)!important;
  }
}


/* Formación / Ruta formativa */
.training-page{
  background:#f4f8fd;
}
.training-wrap{
  max-width:1180px;
}
.training-hero{
  display:grid;
  grid-template-columns:minmax(0,1fr) 260px;
  gap:22px;
  align-items:stretch;
  padding:34px;
  border:1px solid #b8dcff;
  border-radius:28px;
  background:
    radial-gradient(circle at 92% 10%, rgba(0,120,212,.18), transparent 30%),
    linear-gradient(135deg,#ffffff,#eef7ff);
  box-shadow:0 18px 48px rgba(15,66,120,.08);
  margin-bottom:22px;
}
.training-hero h1{
  margin:8px 0 12px;
  font-size:42px;
  line-height:1.08;
  color:#0b2440;
  letter-spacing:-.03em;
}
.training-hero p{
  max-width:790px;
  color:#506784;
  line-height:1.65;
  font-size:17px;
}
.training-hero-note{
  display:grid;
  align-content:center;
  gap:8px;
  padding:22px;
  border:1px solid #b8dcff;
  border-radius:24px;
  background:#fff;
  box-shadow:0 16px 36px rgba(15,66,120,.10);
}
.training-hero-note span{
  width:52px;
  height:52px;
  display:grid;
  place-items:center;
  border-radius:16px;
  background:#e8f4ff;
  font-size:26px;
}
.training-hero-note strong{
  color:#0b2440;
  font-size:20px;
}
.training-hero-note small{
  color:#506784;
  line-height:1.45;
}
.training-section{
  margin:22px 0;
  padding:26px;
  border:1px solid rgba(145,195,235,.85);
  border-radius:26px;
  background:linear-gradient(135deg,#ffffff,#f7fbff);
  box-shadow:0 18px 48px rgba(15,66,120,.07);
}
.training-section-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:18px;
  margin-bottom:18px;
}
.training-section-head h2{
  margin:0;
  color:#0b2440;
  font-size:28px;
  letter-spacing:-.02em;
}
.training-section-head p{
  margin:0;
  color:#506784;
}
.training-main-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
}
.training-feature-card,
.training-route-card,
.training-architecture-grid a{
  text-decoration:none;
  color:#0b2440;
  border:1px solid #b8dcff;
  border-radius:22px;
  background:#fff;
  box-shadow:0 14px 34px rgba(15,66,120,.07);
  transition:transform .18s ease, box-shadow .18s ease;
}
.training-feature-card:hover,
.training-route-card:hover,
.training-architecture-grid a:hover{
  transform:translateY(-4px);
  box-shadow:0 24px 54px rgba(15,66,120,.14);
}
.training-feature-card{
  display:flex;
  flex-direction:column;
  min-height:210px;
  padding:20px;
}
.training-icon{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  border-radius:15px;
  background:#edf6ff;
  font-size:23px;
  margin-bottom:14px;
}
.training-feature-card h3,
.training-route-card h3{
  margin:0 0 10px;
  color:#0b2440;
  font-size:18px;
}
.training-feature-card p,
.training-route-card p{
  color:#243b5a;
  line-height:1.55;
  margin:0 0 16px;
}
.training-feature-card strong{
  margin-top:auto;
  color:#005a9e;
}
.training-chip-cloud{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.training-chip-cloud a{
  padding:11px 14px;
  border-radius:999px;
  border:1px solid #b8dcff;
  background:#fff;
  color:#005a9e;
  text-decoration:none;
  font-weight:900;
  box-shadow:0 8px 18px rgba(15,66,120,.05);
}
.training-chip-cloud a:hover{
  background:#e8f4ff;
}
.training-routes-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.training-route-card{
  padding:20px;
  display:flex;
  flex-direction:column;
  min-height:210px;
}
.level-badge{
  align-self:flex-start;
  margin-bottom:10px;
  padding:7px 10px;
  border-radius:999px;
  background:#e8f4ff;
  color:#005a9e;
  font-size:12px;
  font-weight:950;
}
.training-route-card a{
  margin-top:auto;
  display:block;
  text-align:center;
  padding:12px;
  border-radius:14px;
  background:#e8f4ff;
  color:#005a9e;
  font-weight:950;
  text-decoration:none;
}
.training-route-card a:hover{
  background:#0078d4;
  color:#fff;
}
.training-labs-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
.training-labs-grid a{
  padding:15px;
  border-radius:18px;
  border:1px solid #b8dcff;
  background:#fff;
  color:#0b2440;
  text-decoration:none;
  font-weight:850;
  box-shadow:0 10px 26px rgba(15,66,120,.06);
}
.training-labs-grid a:hover{
  background:#e8f4ff;
  color:#005a9e;
}
.training-architecture-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.training-architecture-grid a{
  display:grid;
  gap:8px;
  padding:18px;
}
.training-architecture-grid span{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  border-radius:15px;
  background:#e8f4ff;
  font-size:23px;
}
.training-architecture-grid strong{
  font-size:18px;
}
.training-architecture-grid small{
  color:#506784;
  line-height:1.45;
}
.sidebar .nav-formacion.active{
  background:#e8f4ff!important;
  border-color:#b8dcff!important;
  color:#005a9e!important;
}
@media(max-width:1100px){
  .training-main-grid,
  .training-labs-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .training-routes-grid,
  .training-architecture-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .training-hero{
    grid-template-columns:1fr;
  }
}
@media(max-width:760px){
  .training-wrap{
    padding:14px;
  }
  .training-hero,
  .training-section{
    padding:20px;
  }
  .training-hero h1{
    font-size:32px;
  }
  .training-section-head{
    align-items:flex-start;
    flex-direction:column;
  }
  .training-main-grid,
  .training-labs-grid,
  .training-routes-grid,
  .training-architecture-grid{
    grid-template-columns:1fr;
  }
}


/* Ruta formativa PRO */
.azlearn-hero{
  display:grid;
  grid-template-columns:minmax(0,1fr) 280px;
  gap:22px;
  align-items:stretch;
  padding:34px;
  border:1px solid #b8dcff;
  border-radius:30px;
  background:
    radial-gradient(circle at 92% 12%, rgba(0,120,212,.20), transparent 34%),
    linear-gradient(135deg,#ffffff,#eef7ff);
  box-shadow:0 18px 48px rgba(15,66,120,.08);
  margin-bottom:22px;
}
.azlearn-hero h1{
  margin:10px 0 12px;
  font-size:46px;
  line-height:1.05;
  letter-spacing:-.04em;
  color:#0b2440;
}
.azlearn-hero p{
  max-width:850px;
  font-size:18px;
  line-height:1.65;
  color:#506784;
}
.azlearn-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:22px;
}
.primary-btn,.ghost-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:0 18px;
  border-radius:14px;
  font-weight:950;
  text-decoration:none;
}
.primary-btn{
  background:#0078d4;
  color:#fff;
  box-shadow:0 16px 32px rgba(0,120,212,.20);
}
.ghost-btn{
  background:#fff;
  color:#005a9e;
  border:1px solid #b8dcff;
}
.azlearn-progress-card{
  display:grid;
  align-content:center;
  gap:10px;
  padding:22px;
  border:1px solid #b8dcff;
  border-radius:24px;
  background:#fff;
  box-shadow:0 16px 36px rgba(15,66,120,.10);
}
.azlearn-progress-card .mini-label{
  color:#506784;
  font-weight:900;
}
.azlearn-progress-card strong{
  color:#0078d4;
  font-size:44px;
}
.az-progress{
  height:10px;
  border-radius:999px;
  background:#e8f4ff;
  overflow:hidden;
}
.az-progress i{
  display:block;
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg,#0078d4,#65baff);
}
.azlearn-progress-card small{
  color:#506784;
  line-height:1.45;
}
.azlearn-quick-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
  margin:22px 0;
}
.azlearn-start-card{
  min-height:220px;
  display:flex;
  flex-direction:column;
  padding:22px;
  border:1px solid #b8dcff;
  border-radius:24px;
  background:#fff;
  color:#0b2440;
  text-decoration:none;
  box-shadow:0 14px 34px rgba(15,66,120,.07);
  transition:transform .18s ease, box-shadow .18s ease;
}
.azlearn-start-card:hover{
  transform:translateY(-4px);
  box-shadow:0 24px 54px rgba(15,66,120,.14);
}
.azlearn-start-card span{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  border-radius:15px;
  background:#edf6ff;
  font-size:23px;
  margin-bottom:16px;
}
.azlearn-start-card h3{
  margin:0 0 10px;
  font-size:18px;
}
.azlearn-start-card p{
  margin:0 0 16px;
  color:#243b5a;
  line-height:1.55;
}
.azlearn-start-card strong{
  margin-top:auto;
  color:#005a9e;
}
.azlearn-layout{
  display:grid;
  grid-template-columns:250px minmax(0,1fr);
  gap:20px;
  align-items:start;
}
.azlearn-route-nav{
  position:sticky;
  top:86px;
  padding:18px;
  border:1px solid #b8dcff;
  border-radius:24px;
  background:#fff;
  box-shadow:0 18px 42px rgba(15,66,120,.08);
}
.azlearn-route-nav h3{
  margin:0 0 12px;
  color:#0b2440;
}
.azlearn-route-nav a{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  padding:11px 0;
  border-top:1px solid #edf4fb;
  color:#0b2440;
  text-decoration:none;
  font-weight:850;
}
.azlearn-route-nav a:hover{
  color:#0078d4;
}
.azlearn-route-nav i{
  font-style:normal;
  color:#7a92ad;
  font-size:12px;
}
.azlearn-content{
  display:grid;
  gap:20px;
}
.azlearn-panel{
  padding:28px;
  border:1px solid rgba(145,195,235,.85);
  border-radius:28px;
  background:linear-gradient(135deg,#ffffff,#f7fbff);
  box-shadow:0 18px 48px rgba(15,66,120,.07);
  scroll-margin-top:90px;
}
.azlearn-head{
  margin-bottom:20px;
}
.azlearn-head h2{
  margin:8px 0 8px;
  color:#0b2440;
  font-size:30px;
  letter-spacing:-.025em;
}
.azlearn-head p{
  color:#506784;
  line-height:1.6;
  max-width:880px;
}
.azlearn-info-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.azlearn-info-grid article{
  padding:18px;
  border-radius:20px;
  border:1px solid #d3eaff;
  background:#fff;
}
.azlearn-info-grid strong{
  color:#0b2440;
}
.azlearn-info-grid p{
  color:#506784;
  line-height:1.55;
}
.az-week-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.az-week-grid article{
  padding:20px;
  border:1px solid #b8dcff;
  border-radius:22px;
  background:#fff;
  box-shadow:0 14px 34px rgba(15,66,120,.06);
}
.az-week-grid span,.level-badge{
  display:inline-flex;
  padding:7px 10px;
  border-radius:999px;
  background:#e8f4ff;
  color:#005a9e;
  font-size:12px;
  font-weight:950;
}
.az-week-grid h3{
  color:#0b2440;
  margin:12px 0 8px;
}
.az-week-grid p{
  color:#506784;
  line-height:1.55;
}
.az-week-grid a{
  color:#005a9e;
  font-weight:950;
  text-decoration:none;
}
.az-module-list{
  display:grid;
  gap:14px;
}
.az-module-list article{
  display:grid;
  grid-template-columns:54px minmax(0,1fr);
  gap:16px;
  padding:20px;
  border:1px solid #d3eaff;
  border-radius:22px;
  background:#fff;
}
.az-module-list article > span{
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  border-radius:17px;
  background:#e8f4ff;
  font-size:26px;
}
.az-module-list h3{
  margin:0 0 8px;
  color:#0b2440;
  font-size:21px;
}
.az-module-list p{
  margin:0 0 10px;
  color:#506784;
  line-height:1.55;
}
.az-module-list ul{
  margin:0;
  padding-left:18px;
  color:#243b5a;
  line-height:1.65;
}
.training-chip-cloud.big{
  gap:12px;
}
.training-chip-cloud.big a{
  font-size:15px;
  padding:12px 15px;
}
.training-routes-grid.pro,
.training-architecture-grid.pro{
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.training-labs-grid.pro{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
.az-check-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.az-check-grid label{
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:14px;
  border:1px solid #d3eaff;
  border-radius:16px;
  background:#fff;
  color:#0b2440;
  font-weight:800;
}
.az-check-grid input{
  margin-top:2px;
  accent-color:#0078d4;
}
@media(max-width:1200px){
  .azlearn-quick-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .azlearn-layout{
    grid-template-columns:1fr;
  }
  .azlearn-route-nav{
    position:relative;
    top:0;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
  }
  .azlearn-route-nav h3{
    width:100%;
  }
  .azlearn-route-nav a{
    border:1px solid #d3eaff;
    border-radius:999px;
    padding:8px 12px;
  }
}
@media(max-width:900px){
  .azlearn-hero{
    grid-template-columns:1fr;
  }
  .az-week-grid,
  .azlearn-info-grid,
  .training-routes-grid.pro,
  .training-architecture-grid.pro{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .training-labs-grid.pro{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:640px){
  .azlearn-hero,
  .azlearn-panel{
    padding:20px;
  }
  .azlearn-hero h1{
    font-size:34px;
  }
  .azlearn-quick-grid,
  .az-week-grid,
  .azlearn-info-grid,
  .training-routes-grid.pro,
  .training-architecture-grid.pro,
  .training-labs-grid.pro,
  .az-check-grid{
    grid-template-columns:1fr;
  }
  .az-module-list article{
    grid-template-columns:1fr;
  }
}


/* v2 Ruta formativa: progreso por secciones con cookies */
.section-status{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin:-6px 0 20px;
  padding:12px 14px;
  border:1px solid #d3eaff;
  border-radius:16px;
  background:#f4faff;
}
.section-status span{
  color:#506784;
  font-weight:900;
}
.section-complete-btn{
  border:1px solid #b8dcff;
  background:#fff;
  color:#005a9e;
  border-radius:999px;
  padding:9px 13px;
  font-weight:950;
  cursor:pointer;
  transition:transform .16s ease, background .16s ease, color .16s ease;
}
.section-complete-btn:hover{
  transform:translateY(-2px);
  background:#e8f4ff;
}
.section-status.completed{
  border-color:#7dd3fc;
  background:#e9fbff;
}
.section-status.completed span{
  color:#047857;
}
.section-status.completed .section-complete-btn{
  background:#047857;
  color:#fff;
  border-color:#047857;
}
.az-completion-summary{
  padding:18px;
  border:1px solid #d3eaff;
  border-radius:20px;
  background:#fff;
}
.az-completion-summary p{
  color:#506784;
  line-height:1.6;
  margin:0 0 14px;
}
.az-completion-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.az-completion-list span{
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:11px 12px;
  border-radius:14px;
  background:#f4faff;
  border:1px solid #d3eaff;
  color:#0b2440;
  font-weight:850;
}
.az-completion-list span.done{
  background:#ecfdf5;
  border-color:#a7f3d0;
  color:#047857;
}
@media(max-width:760px){
  .section-status{
    align-items:flex-start;
    flex-direction:column;
  }
  .az-completion-list{
    grid-template-columns:1fr;
  }
}


/* v3 formación refinada */
.azlearn-hero.compact .azlearn-actions{display:none!important}
.azlearn-quick-grid{display:none!important}
.az-week-grid.days{grid-template-columns:repeat(3,minmax(0,1fr))}
.service-accordion{display:grid;gap:14px}
.service-group{border:1px solid #b8dcff;border-radius:22px;background:#fff;box-shadow:0 14px 34px rgba(15,66,120,.06);overflow:hidden}
.service-group summary{cursor:pointer;padding:18px 20px;font-weight:950;color:#0b2440;background:linear-gradient(135deg,#fff,#f3faff)}
.service-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:18px}
.service-grid article{border:1px solid #d3eaff;border-radius:18px;padding:16px;background:#fff}
.service-grid h3{margin:0 0 8px;color:#0b2440}
.service-grid p{color:#506784;line-height:1.6}
.service-grid a{color:#005a9e;font-weight:900;text-decoration:none}
.lab-rich-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.lab-rich-card{display:grid;grid-template-columns:52px minmax(0,1fr);gap:14px;border:1px solid #b8dcff;border-radius:22px;background:#fff;padding:18px;box-shadow:0 14px 34px rgba(15,66,120,.06)}
.lab-rich-card>span{width:52px;height:52px;display:grid;place-items:center;border-radius:16px;background:#e8f4ff;font-size:24px}
.lab-rich-card h3{margin:0 0 8px;color:#0b2440}
.lab-rich-card p{color:#506784;line-height:1.55}
.lab-rich-card a{color:#005a9e;font-weight:950;text-decoration:none}
.lesson-hero{padding:30px;border:1px solid #b8dcff;border-radius:28px;background:linear-gradient(135deg,#fff,#eef7ff);box-shadow:0 18px 48px rgba(15,66,120,.08);margin-bottom:22px}
.lesson-hero h1{font-size:42px;line-height:1.1;margin:8px 0 12px;color:#0b2440}
.lesson-hero p{color:#506784;font-size:17px;line-height:1.6}
.lesson-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.lesson-grid article{border:1px solid #d3eaff;border-radius:20px;background:#fff;padding:18px}
.lesson-grid h3{margin:0 0 10px;color:#0b2440}
.lesson-grid p,.lesson-grid li{color:#506784;line-height:1.6}
.rich-steps{display:grid;gap:12px;counter-reset:step;list-style:none;padding:0;margin:0}
.rich-steps li{padding:16px;border:1px solid #d3eaff;border-radius:18px;background:#fff;color:#506784;line-height:1.6}
.rich-steps strong{color:#0b2440}
@media(max-width:1000px){.az-week-grid.days,.service-grid,.lesson-grid{grid-template-columns:1fr 1fr}.lab-rich-grid{grid-template-columns:1fr}}
@media(max-width:700px){.az-week-grid.days,.service-grid,.lesson-grid,.lab-rich-grid{grid-template-columns:1fr}.lesson-hero h1{font-size:32px}}


/* v4 home route formativa */
.home-training-route{
  margin:22px 0;
  padding:28px;
  border:1px solid #b8dcff;
  border-radius:28px;
  background:
    radial-gradient(circle at 92% 12%, rgba(0,120,212,.12), transparent 32%),
    linear-gradient(135deg,#ffffff,#f2f9ff);
  box-shadow:0 18px 48px rgba(15,66,120,.07);
}
.home-training-head{
  margin-bottom:18px;
}
.home-training-head h2{
  margin:8px 0 8px;
  color:#0b2440;
  font-size:30px;
  letter-spacing:-.03em;
}
.home-training-head p{
  max-width:850px;
  color:#506784;
  line-height:1.6;
}
.home-training-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.home-training-card{
  display:grid;
  grid-template-columns:54px minmax(0,1fr);
  gap:14px;
  align-items:start;
  padding:18px;
  border:1px solid #b8dcff;
  border-radius:22px;
  background:#fff;
  color:#0b2440;
  text-decoration:none;
  box-shadow:0 14px 34px rgba(15,66,120,.06);
  transition:transform .18s ease, box-shadow .18s ease;
}
.home-training-card:hover{
  transform:translateY(-4px);
  box-shadow:0 24px 54px rgba(15,66,120,.14);
}
.home-step{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:16px;
  background:linear-gradient(135deg,#0078d4,#2897f0);
  color:#fff;
  font-weight:950;
}
.home-training-card h3{
  margin:0 0 8px;
  color:#0b2440;
  font-size:18px;
}
.home-training-card p{
  margin:0 0 10px;
  color:#506784;
  line-height:1.5;
}
.home-training-card strong{
  color:#005a9e;
}

.home-route-explain{
  margin:24px 0;
  padding:30px;
  border:1px solid #b8dcff;
  border-radius:28px;
  background:
    radial-gradient(circle at 88% 18%, rgba(0,120,212,.14), transparent 34%),
    linear-gradient(135deg,#ffffff,#eef7ff);
  display:grid;
  grid-template-columns:minmax(0,1.6fr) minmax(260px,.8fr);
  gap:24px;
  align-items:center;
  box-shadow:0 18px 48px rgba(15,66,120,.07);
}
.home-route-copy h2{
  margin:8px 0 10px;
  color:#0b2440;
  font-size:30px;
  letter-spacing:-.03em;
}
.home-route-copy p{
  color:#506784;
  line-height:1.65;
  max-width:760px;
}
.home-route-bullets{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin:18px 0 20px;
}
.home-route-bullets span{
  padding:12px 14px;
  border:1px solid #d3eaff;
  border-radius:16px;
  background:#fff;
  color:#0b2440;
  font-weight:850;
}
.home-route-stats{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.home-route-stats article{
  min-height:120px;
  display:grid;
  place-items:center;
  text-align:center;
  padding:18px;
  border:1px solid #b8dcff;
  border-radius:20px;
  background:#fff;
  box-shadow:0 14px 34px rgba(15,66,120,.06);
}
.home-route-stats strong{
  color:#0078d4;
  font-size:36px;
  line-height:1;
}
.home-route-stats span{
  color:#506784;
  font-weight:850;
}
@media(max-width:900px){
  .home-training-grid,
  .home-route-explain{
    grid-template-columns:1fr;
  }
  .home-route-bullets,
  .home-route-stats{
    grid-template-columns:1fr;
  }
}
@media(max-width:640px){
  .home-training-route,
  .home-route-explain{
    padding:20px;
  }
  .home-training-card{
    grid-template-columns:1fr;
  }
}


/* =========================================================
   v62 PRO HOME DASHBOARD REORGANIZATION
   Objetivo: menos huecos, layout tipo dashboard SaaS, más densidad.
   ========================================================= */

.main .page-wrap{
  max-width: none;
}

.home-top-dashboard-v62{
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(380px,.9fr);
  gap:16px;
  align-items:stretch;
  margin:14px 0 16px;
}

.home-hero-cell-v62,
.home-route-cell-v62{
  min-width:0;
}

.home-hero-cell-v62 > section{
  height:100%!important;
  margin:0!important;
  min-height:0!important;
  padding:22px 24px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  border-radius:24px!important;
}

/* Reduce espacios del hero anterior y elimina grandes zonas vacías visuales */
.home-hero-cell-v62 .hero-visual,
.home-hero-cell-v62 .hero-illustration,
.home-hero-cell-v62 .hero-orbit,
.home-hero-cell-v62 .home-hero-visual{
  transform:scale(.82)!important;
  transform-origin:center right!important;
}
.home-hero-cell-v62 h1{
  margin-top:0!important;
  margin-bottom:10px!important;
  font-size:clamp(32px,3vw,48px)!important;
  line-height:1.05!important;
}
.home-hero-cell-v62 p{
  max-width:760px!important;
  margin-bottom:8px!important;
  line-height:1.55!important;
}

.home-route-panel-v62{
  height:100%;
  padding:22px;
  border:1px solid #b8dcff;
  border-radius:24px;
  background:
    radial-gradient(circle at 90% 10%, rgba(0,120,212,.15), transparent 34%),
    linear-gradient(135deg,#ffffff,#eef7ff);
  box-shadow:0 16px 40px rgba(15,66,120,.08);
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:14px;
}

.v62-section-kicker{
  color:#005a9e;
  font-size:12px;
  font-weight:950;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.home-route-panel-v62 h2{
  margin:0;
  color:#0b2440;
  font-size:26px;
  line-height:1.1;
  letter-spacing:-.03em;
}

.home-route-panel-v62 p{
  margin:0;
  color:#506784;
  line-height:1.5;
}

.route-mini-list-v62{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}

.route-mini-list-v62 a{
  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  grid-template-areas:
    "num title"
    "num sub";
  gap:2px 10px;
  align-items:center;
  padding:12px;
  border:1px solid #b8dcff;
  border-radius:16px;
  background:#fff;
  color:#0b2440;
  text-decoration:none;
  box-shadow:0 10px 24px rgba(15,66,120,.06);
  transition:transform .16s ease, box-shadow .16s ease;
}

.route-mini-list-v62 a:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 34px rgba(15,66,120,.12);
}

.route-mini-list-v62 span{
  grid-area:num;
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border-radius:13px;
  background:#0078d4;
  color:#fff;
  font-weight:950;
}

.route-mini-list-v62 strong{
  grid-area:title;
  font-size:14px;
}

.route-mini-list-v62 small{
  grid-area:sub;
  color:#506784;
  font-weight:750;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.route-panel-btn-v62{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  border-radius:14px;
  background:#0078d4;
  color:#fff;
  text-decoration:none;
  font-weight:950;
  box-shadow:0 14px 28px rgba(0,120,212,.18);
}

/* Compactar carousel y noticias */
section:has(#latestCarouselTrack){
  margin-top:0!important;
  padding-top:18px!important;
  padding-bottom:18px!important;
}

/* Explicación compacta de ruta bajo carrusel */
.home-route-strip-v62{
  margin:16px 0;
  padding:22px;
  display:grid;
  grid-template-columns:minmax(0,1.4fr) minmax(360px,.8fr);
  gap:18px;
  align-items:center;
  border:1px solid #b8dcff;
  border-radius:24px;
  background:linear-gradient(135deg,#ffffff,#f2f9ff);
  box-shadow:0 16px 40px rgba(15,66,120,.07);
}

.home-route-strip-v62 h2{
  margin:6px 0 8px;
  color:#0b2440;
  font-size:26px;
  letter-spacing:-.03em;
}

.home-route-strip-v62 p{
  margin:0 0 12px;
  color:#506784;
  line-height:1.55;
}

.home-route-strip-v62 a{
  color:#005a9e;
  font-weight:950;
  text-decoration:none;
}

.route-strip-stats-v62{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}

.route-strip-stats-v62 article{
  display:grid;
  place-items:center;
  min-height:82px;
  padding:12px;
  border:1px solid #b8dcff;
  border-radius:18px;
  background:#fff;
  text-align:center;
  box-shadow:0 10px 24px rgba(15,66,120,.05);
}

.route-strip-stats-v62 strong{
  color:#0078d4;
  font-size:28px;
  line-height:1;
}

.route-strip-stats-v62 span{
  color:#506784;
  font-weight:850;
  font-size:12px;
}

/* Igualar secciones inferiores y reducir huecos */
.home-route-strip-v62 + section,
section + section{
  margin-top:14px;
}

section{
  box-sizing:border-box;
}

/* Cards inferiores más densas */
.learning-card,
.feature-card,
.scenario-card,
.cert-card,
.ranking-card,
.lab-card{
  min-height:auto!important;
}

/* Eliminar grandes fondos decorativos que creaban huecos muertos */
.decorative-empty,
.empty-visual,
.blob-bg{
  display:none!important;
}

/* Footer compacto */
.footer{
  margin-top:14px!important;
}

/* Responsive */
@media(max-width:1200px){
  .home-top-dashboard-v62{
    grid-template-columns:1fr;
  }
  .home-route-panel-v62{
    min-height:auto;
  }
}

@media(max-width:900px){
  .home-route-strip-v62{
    grid-template-columns:1fr;
  }
  .route-strip-stats-v62{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:640px){
  .route-mini-list-v62{
    grid-template-columns:1fr;
  }
  .home-top-dashboard-v62,
  .home-route-strip-v62{
    margin:12px 0;
  }
  .home-route-panel-v62,
  .home-route-strip-v62{
    padding:18px;
  }
}


/* =========================================================
   v63 PRO CLEAN
   Cabecera compacta, equilibrada y sin sección Guía de aprendizaje
   ========================================================= */

/* Elimina por CSS cualquier resto de la sección guía */
.home-route-strip-v62{
  display:none!important;
}

/* Layout superior limpio */
.home-top-dashboard-v62{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 420px!important;
  gap:20px!important;
  align-items:stretch!important;
  max-width:1480px!important;
  margin:14px auto 18px!important;
}

/* Celda hero: usa todo el ancho disponible */
.home-hero-cell-v62{
  min-width:0!important;
  display:flex!important;
  align-items:stretch!important;
}

.home-hero-cell-v62 > section{
  width:100%!important;
  height:100%!important;
  min-height:320px!important;
  margin:0!important;
  padding:28px 32px!important;
  border-radius:26px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr)!important;
  gap:24px!important;
  align-items:center!important;
}

/* Texto del hero más controlado */
.home-hero-cell-v62 h1{
  max-width:560px!important;
  margin:0 0 14px!important;
  font-size:clamp(36px,3.2vw,58px)!important;
  line-height:1.02!important;
  letter-spacing:-.045em!important;
}

.home-hero-cell-v62 p{
  max-width:640px!important;
  margin:0!important;
  line-height:1.58!important;
  font-size:clamp(15px,1vw,17px)!important;
}

/* Visual del hero más pegado y compacto */
.home-hero-cell-v62 .hero-visual,
.home-hero-cell-v62 .hero-illustration,
.home-hero-cell-v62 .hero-orbit,
.home-hero-cell-v62 .home-hero-visual,
.home-hero-cell-v62 .hero-cloud{
  justify-self:end!important;
  align-self:center!important;
  max-width:360px!important;
  transform:scale(.88)!important;
  transform-origin:center right!important;
  margin:0!important;
}

/* Si las tarjetas flotantes son absolutas, las compactamos */
.home-hero-cell-v62 [class*="float"],
.home-hero-cell-v62 [class*="bubble"],
.home-hero-cell-v62 [class*="orbit"]{
  max-width:100%!important;
}

/* Panel ruta formativa equilibrado */
.home-route-cell-v62{
  min-width:0!important;
  display:flex!important;
}

.home-route-panel-v62{
  width:100%!important;
  height:100%!important;
  min-height:320px!important;
  padding:24px!important;
  border-radius:26px!important;
  justify-content:space-between!important;
}

.home-route-panel-v62 h2{
  font-size:clamp(25px,1.8vw,32px)!important;
  line-height:1.08!important;
  max-width:360px!important;
}

.home-route-panel-v62 p{
  font-size:15px!important;
  line-height:1.55!important;
}

/* Mini cards más limpias */
.route-mini-list-v62{
  grid-template-columns:1fr 1fr!important;
  gap:10px!important;
}

.route-mini-list-v62 a{
  min-height:66px!important;
  padding:12px!important;
}

.route-mini-list-v62 strong{
  font-size:14px!important;
  line-height:1.15!important;
}

.route-mini-list-v62 small{
  font-size:12px!important;
  line-height:1.15!important;
}

/* Carrusel más pegado a la cabecera */
.home-top-dashboard-v62 + section,
.home-top-dashboard-v62 + .section,
section:has(#latestCarouselTrack){
  margin-top:14px!important;
}

/* Quita exceso de padding vertical general en la home */
body:not(.training-page) .page-wrap > section{
  margin-bottom:16px!important;
}

body:not(.training-page) .page-wrap{
  padding-top:14px!important;
}

/* Noticias y carrusel alineados visualmente */
section:has(#latestCarouselTrack){
  padding-bottom:20px!important;
}

/* Responsive */
@media(max-width:1250px){
  .home-top-dashboard-v62{
    grid-template-columns:1fr!important;
  }
  .home-hero-cell-v62 > section{
    grid-template-columns:minmax(0,1fr) minmax(240px,360px)!important;
  }
  .home-route-panel-v62{
    min-height:auto!important;
  }
}

@media(max-width:850px){
  .home-hero-cell-v62 > section{
    grid-template-columns:1fr!important;
    min-height:auto!important;
    padding:24px!important;
  }

  .home-hero-cell-v62 .hero-visual,
  .home-hero-cell-v62 .hero-illustration,
  .home-hero-cell-v62 .hero-orbit,
  .home-hero-cell-v62 .home-hero-visual,
  .home-hero-cell-v62 .hero-cloud{
    justify-self:center!important;
    transform:scale(.82)!important;
  }

  .home-route-panel-v62{
    min-height:auto!important;
  }
}

@media(max-width:560px){
  .home-top-dashboard-v62{
    gap:12px!important;
    margin:10px auto 14px!important;
  }

  .home-hero-cell-v62 > section,
  .home-route-panel-v62{
    padding:18px!important;
    border-radius:22px!important;
  }

  .route-mini-list-v62{
    grid-template-columns:1fr!important;
  }

  .home-hero-cell-v62 h1{
    font-size:34px!important;
  }
}


/* =========================================================
   v64 PRO FINAL
   Cabecera full-width sin huecos laterales, manteniendo el resto del layout.
   ========================================================= */

/* La cabecera de portada rompe el ancho máximo del contenedor y ocupa todo el viewport */
.home-top-dashboard-v62{
  width:100vw!important;
  max-width:none!important;
  margin-left:calc(50% - 50vw)!important;
  margin-right:calc(50% - 50vw)!important;
  margin-top:14px!important;
  margin-bottom:18px!important;
  padding:0 24px!important;
  box-sizing:border-box!important;

  display:grid!important;
  grid-template-columns:minmax(0,1fr) 420px!important;
  gap:20px!important;
  align-items:stretch!important;
}

/* Evita que el hero tenga límites internos heredados */
.home-hero-cell-v62,
.home-route-cell-v62{
  min-width:0!important;
}

.home-hero-cell-v62 > section{
  width:100%!important;
  max-width:none!important;
  min-height:320px!important;
  box-sizing:border-box!important;
}

/* El hero se estira y usa toda la columna izquierda */
.home-hero-cell-v62{
  display:flex!important;
  align-items:stretch!important;
}

.home-hero-cell-v62 > section{
  flex:1 1 auto!important;
}

/* La tarjeta de ruta queda compacta y alineada */
.home-route-panel-v62{
  width:100%!important;
  max-width:none!important;
  min-height:320px!important;
  box-sizing:border-box!important;
}

/* Mantiene el resto de secciones alineadas con el mismo padding visual */
body:not(.training-page) .page-wrap{
  overflow-x:hidden!important;
}

/* Si el breadcrumb queda pegado, lo contenemos dentro del ancho visual */
.breadcrumb{
  max-width:1480px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* El carrusel y demás bloques quedan compactos tras el hero */
.home-top-dashboard-v62 + section,
.home-top-dashboard-v62 + .section,
section:has(#latestCarouselTrack){
  margin-top:14px!important;
}

/* Ajuste del visual interno del hero para que no cree hueco muerto */
.home-hero-cell-v62 .hero-visual,
.home-hero-cell-v62 .hero-illustration,
.home-hero-cell-v62 .hero-orbit,
.home-hero-cell-v62 .home-hero-visual,
.home-hero-cell-v62 .hero-cloud{
  justify-self:end!important;
  align-self:center!important;
  max-width:390px!important;
  transform:scale(.92)!important;
  transform-origin:center right!important;
  margin:0!important;
}

/* Desktop grande: aprovechamos bien el ancho */
@media(min-width:1500px){
  .home-top-dashboard-v62{
    grid-template-columns:minmax(0,1fr) 440px!important;
    gap:24px!important;
    padding-left:28px!important;
    padding-right:28px!important;
  }

  .home-hero-cell-v62 > section,
  .home-route-panel-v62{
    min-height:340px!important;
  }

  .home-hero-cell-v62 h1{
    max-width:720px!important;
  }

  .home-hero-cell-v62 p{
    max-width:820px!important;
  }
}

/* Tablet: una sola columna, sin huecos */
@media(max-width:1250px){
  .home-top-dashboard-v62{
    grid-template-columns:1fr!important;
    width:auto!important;
    max-width:1480px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding:0!important;
  }

  .home-hero-cell-v62 > section{
    grid-template-columns:minmax(0,1fr) minmax(240px,360px)!important;
  }

  .home-route-panel-v62{
    min-height:auto!important;
  }
}

/* Móvil */
@media(max-width:850px){
  .home-top-dashboard-v62{
    padding:0!important;
  }

  .home-hero-cell-v62 > section{
    grid-template-columns:1fr!important;
    min-height:auto!important;
  }

  .home-hero-cell-v62 .hero-visual,
  .home-hero-cell-v62 .hero-illustration,
  .home-hero-cell-v62 .hero-orbit,
  .home-hero-cell-v62 .home-hero-visual,
  .home-hero-cell-v62 .hero-cloud{
    justify-self:center!important;
    max-width:320px!important;
    transform:scale(.86)!important;
    transform-origin:center!important;
  }
}


/* =========================================================
   v65 HEADER FIX
   Corrige desplazamiento izquierdo del hero full-width y asegura CTA ruta.
   ========================================================= */

/* En vez de romper con 100vw, ajustamos al ancho real del contenedor visible.
   Esto evita que el hero se meta debajo del sidebar. */
.home-top-dashboard-v62{
  width:100%!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
  margin-top:14px!important;
  margin-bottom:18px!important;
  padding:0!important;
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 420px!important;
  gap:20px!important;
  align-items:stretch!important;
}

/* Hero limpio y centrado dentro de su columna */
.home-hero-cell-v62{
  min-width:0!important;
  display:flex!important;
  align-items:stretch!important;
  overflow:hidden!important;
}

.home-hero-cell-v62 > section{
  width:100%!important;
  max-width:none!important;
  min-height:320px!important;
  margin:0!important;
  padding:28px 32px!important;
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.05fr) minmax(260px,.75fr)!important;
  gap:22px!important;
  align-items:center!important;
  overflow:hidden!important;
}

/* Evita que el texto se salga o quede cortado a la izquierda */
.home-hero-cell-v62 h1,
.home-hero-cell-v62 p{
  margin-left:0!important;
  transform:none!important;
  text-indent:0!important;
}

.home-hero-cell-v62 h1{
  max-width:640px!important;
}

.home-hero-cell-v62 p{
  max-width:700px!important;
}

/* Visual compacta sin provocar huecos enormes */
.home-hero-cell-v62 .hero-visual,
.home-hero-cell-v62 .hero-illustration,
.home-hero-cell-v62 .hero-orbit,
.home-hero-cell-v62 .home-hero-visual,
.home-hero-cell-v62 .hero-cloud{
  justify-self:end!important;
  align-self:center!important;
  max-width:340px!important;
  transform:scale(.86)!important;
  transform-origin:center right!important;
  margin:0!important;
}

/* Panel de ruta */
.home-route-cell-v62{
  min-width:0!important;
  display:flex!important;
  align-items:stretch!important;
}

.home-route-panel-v62{
  width:100%!important;
  min-height:320px!important;
  box-sizing:border-box!important;
}

/* CTA de ruta siempre clicable y visible */
.route-panel-btn-v62,
.home-route-panel-v62 a.route-panel-btn-v62{
  pointer-events:auto!important;
  cursor:pointer!important;
  position:relative!important;
  z-index:5!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}

/* Desktop grande: que crezca la columna izquierda, no que se desplace */
@media(min-width:1500px){
  .home-top-dashboard-v62{
    grid-template-columns:minmax(0,1fr) 440px!important;
    gap:24px!important;
  }
  .home-hero-cell-v62 > section,
  .home-route-panel-v62{
    min-height:340px!important;
  }
}

/* Tablet */
@media(max-width:1250px){
  .home-top-dashboard-v62{
    grid-template-columns:1fr!important;
  }
  .home-hero-cell-v62 > section{
    grid-template-columns:minmax(0,1fr) minmax(240px,340px)!important;
  }
}

/* Móvil */
@media(max-width:850px){
  .home-hero-cell-v62 > section{
    grid-template-columns:1fr!important;
    min-height:auto!important;
    padding:22px!important;
  }
  .home-hero-cell-v62 .hero-visual,
  .home-hero-cell-v62 .hero-illustration,
  .home-hero-cell-v62 .hero-orbit,
  .home-hero-cell-v62 .home-hero-visual,
  .home-hero-cell-v62 .hero-cloud{
    justify-self:center!important;
    max-width:300px!important;
    transform:scale(.82)!important;
    transform-origin:center!important;
  }
}


/* =========================================================
   v66 PRO DISEÑO PREMIUM
   Hero limpio estilo Microsoft Learn / Azure Portal sin hacks 100vw.
   ========================================================= */

/* Oculta restos del experimento anterior */
.home-top-dashboard-v62,
.home-route-strip-v62{
  display:none!important;
}

/* Cabecera premium */
.home-hero-premium-v66{
  display:grid;
  grid-template-columns:minmax(0,1fr) 420px;
  gap:22px;
  align-items:stretch;
  width:100%;
  margin:14px 0 18px;
}

.hero-premium-main,
.hero-route-premium-v66{
  border:1px solid #b8dcff;
  border-radius:28px;
  background:
    radial-gradient(circle at 82% 18%, rgba(0,120,212,.16), transparent 34%),
    linear-gradient(135deg,#ffffff,#eef7ff);
  box-shadow:0 18px 48px rgba(15,66,120,.08);
}

.hero-premium-main{
  min-height:330px;
  padding:32px;
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(280px,.72fr);
  gap:26px;
  align-items:center;
  overflow:hidden;
}

.hero-copy-v66 h1{
  margin:8px 0 14px;
  max-width:680px;
  color:#0b2440;
  font-size:clamp(38px,3.25vw,60px);
  line-height:1.02;
  letter-spacing:-.045em;
}

.hero-copy-v66 p{
  max-width:720px;
  margin:0;
  color:#385475;
  font-size:clamp(15px,1.02vw,18px);
  line-height:1.65;
}

.hero-actions-v66{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:22px;
}

.hero-actions-v66 .primary-btn,
.hero-actions-v66 .ghost-btn{
  min-height:44px;
  padding:0 18px;
  border-radius:14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:950;
  text-decoration:none;
}

.hero-actions-v66 .primary-btn{
  background:#0078d4;
  color:#fff;
  box-shadow:0 16px 32px rgba(0,120,212,.22);
}

.hero-actions-v66 .ghost-btn{
  background:#fff;
  color:#005a9e;
  border:1px solid #b8dcff;
}

.hero-orbit-v66{
  position:relative;
  min-height:260px;
}

.azure-core-v66{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:118px;
  height:118px;
  display:grid;
  place-items:center;
  border-radius:28px;
  background:linear-gradient(135deg,#0078d4,#57b4ff);
  color:#fff;
  font-size:62px;
  font-weight:950;
  box-shadow:0 24px 56px rgba(0,120,212,.24);
}

.azure-core-v66::before{
  content:"";
  position:absolute;
  inset:-26px;
  border-radius:999px;
  background:rgba(0,120,212,.10);
  z-index:-1;
}

.orbit-card-v66{
  position:absolute;
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  grid-template-areas:"icon title" "icon text";
  column-gap:10px;
  align-items:center;
  min-width:176px;
  padding:13px 15px;
  border:1px solid #b8dcff;
  border-radius:20px;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(10px);
  box-shadow:0 18px 38px rgba(15,66,120,.13);
  animation:floatV66 6s ease-in-out infinite;
}

.orbit-card-v66 span{
  grid-area:icon;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:#e8f4ff;
  font-size:20px;
}

.orbit-card-v66 strong{
  grid-area:title;
  color:#0b2440;
  font-size:16px;
}

.orbit-card-v66 small{
  grid-area:text;
  color:#506784;
  font-weight:750;
}

.card-iac{left:0;top:26px;animation-delay:0s}
.card-sec{right:0;top:72px;animation-delay:.7s}
.card-cert{left:64px;bottom:14px;animation-delay:1.2s}

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

/* Panel derecho */
.hero-route-premium-v66{
  min-height:330px;
  padding:26px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:14px;
}

.hero-route-premium-v66 h2{
  margin:0;
  color:#0b2440;
  font-size:clamp(26px,1.9vw,34px);
  line-height:1.06;
  letter-spacing:-.035em;
}

.hero-route-premium-v66 p{
  margin:0;
  color:#506784;
  line-height:1.55;
}

.route-grid-v66{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}

.route-grid-v66 a{
  display:grid;
  grid-template-columns:40px minmax(0,1fr);
  grid-template-areas:"num title" "num text";
  gap:2px 10px;
  align-items:center;
  padding:12px;
  border:1px solid #b8dcff;
  border-radius:18px;
  background:#fff;
  color:#0b2440;
  text-decoration:none;
  box-shadow:0 12px 28px rgba(15,66,120,.06);
  transition:transform .16s ease, box-shadow .16s ease;
}

.route-grid-v66 a:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 36px rgba(15,66,120,.12);
}

.route-grid-v66 span{
  grid-area:num;
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:#0078d4;
  color:#fff;
  font-weight:950;
}

.route-grid-v66 strong{
  grid-area:title;
  font-size:14px;
  line-height:1.15;
}

.route-grid-v66 small{
  grid-area:text;
  color:#506784;
  font-size:12px;
  font-weight:800;
  line-height:1.15;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.route-cta-v66{
  min-height:46px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:15px;
  background:#0078d4;
  color:#fff;
  text-decoration:none;
  font-weight:950;
  box-shadow:0 16px 32px rgba(0,120,212,.20);
  position:relative;
  z-index:10;
}

/* Compactación del resto de la portada */
.home-hero-premium-v66 + section{
  margin-top:14px!important;
}

/* Responsive */
@media(max-width:1280px){
  .home-hero-premium-v66{
    grid-template-columns:1fr;
  }
  .hero-route-premium-v66{
    min-height:auto;
  }
}

@media(max-width:920px){
  .hero-premium-main{
    grid-template-columns:1fr;
    min-height:auto;
  }
  .hero-orbit-v66{
    min-height:240px;
    max-width:440px;
    width:100%;
    justify-self:center;
  }
}

@media(max-width:640px){
  .home-hero-premium-v66{
    gap:14px;
  }
  .hero-premium-main,
  .hero-route-premium-v66{
    padding:20px;
    border-radius:24px;
  }
  .hero-copy-v66 h1{
    font-size:36px;
  }
  .route-grid-v66{
    grid-template-columns:1fr;
  }
  .orbit-card-v66{
    min-width:150px;
    padding:11px;
  }
  .card-iac{left:0;top:16px}
  .card-sec{right:0;top:76px}
  .card-cert{left:40px;bottom:10px}
}


/* v67 - tarjeta derecha Ruta Formativa igual al mock */
.home-top-right{
  display:flex!important;
  align-items:stretch!important;
}

.route-card-right-v67{
  width:100%!important;
  min-height:100%!important;
  padding:26px!important;
  border:1px solid #9bcfff!important;
  border-radius:28px!important;
  background:
    radial-gradient(circle at 92% 10%, rgba(0,120,212,.16), transparent 34%),
    linear-gradient(135deg,#ffffff 0%,#eef7ff 100%)!important;
  box-shadow:0 18px 48px rgba(15,66,120,.08)!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:space-between!important;
  gap:16px!important;
  box-sizing:border-box!important;
}

.route-card-right-v67 .eyebrow{
  display:block!important;
  color:#005a9e!important;
  font-size:13px!important;
  font-weight:950!important;
  letter-spacing:.09em!important;
  text-transform:uppercase!important;
}

.route-card-right-v67 h2{
  margin:0!important;
  color:#0b2440!important;
  font-size:clamp(28px,2vw,38px)!important;
  line-height:1.08!important;
  letter-spacing:-.04em!important;
}

.route-card-right-v67 p{
  margin:0!important;
  color:#506784!important;
  font-size:16px!important;
  line-height:1.55!important;
}

.route-grid-v67{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:12px!important;
}

.route-grid-v67 a{
  display:grid!important;
  grid-template-columns:48px minmax(0,1fr)!important;
  gap:12px!important;
  align-items:center!important;
  min-height:68px!important;
  padding:12px!important;
  border:1px solid #9bcfff!important;
  border-radius:18px!important;
  background:#ffffff!important;
  color:#0b2440!important;
  text-decoration:none!important;
  box-shadow:0 10px 24px rgba(15,66,120,.06)!important;
  transition:transform .16s ease, box-shadow .16s ease!important;
}

.route-grid-v67 a:hover{
  transform:translateY(-3px)!important;
  box-shadow:0 18px 36px rgba(15,66,120,.13)!important;
}

.route-grid-v67 span{
  width:44px!important;
  height:44px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:15px!important;
  background:#0078d4!important;
  color:#fff!important;
  font-weight:950!important;
  font-size:16px!important;
}

.route-grid-v67 strong{
  display:block!important;
  color:#0b2440!important;
  font-size:16px!important;
  line-height:1.1!important;
}

.route-grid-v67 small{
  display:block!important;
  margin-top:4px!important;
  color:#506784!important;
  font-size:13px!important;
  font-weight:800!important;
  line-height:1.15!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

.route-main-btn-v67{
  min-height:54px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:15px!important;
  background:#0078d4!important;
  color:#ffffff!important;
  text-decoration:none!important;
  font-weight:950!important;
  font-size:18px!important;
  box-shadow:0 16px 32px rgba(0,120,212,.20)!important;
  transition:transform .16s ease, box-shadow .16s ease!important;
}

.route-main-btn-v67:hover{
  transform:translateY(-2px)!important;
  box-shadow:0 22px 42px rgba(0,120,212,.26)!important;
}

@media(max-width:900px){
  .route-grid-v67{
    grid-template-columns:1fr!important;
  }
}

@media(max-width:640px){
  .route-card-right-v67{
    padding:20px!important;
    border-radius:24px!important;
  }
  .route-card-right-v67 h2{
    font-size:30px!important;
  }
}

/* v68 - ruta formativa simplificada */
.route-card-right-v67{
  gap:10px!important;
}


/* v74: buscador funcional */
.search-results-panel-v74{
  position:absolute;
  z-index:9999;
  border:1px solid #b8dcff;
  border-radius:18px;
  background:#fff;
  box-shadow:0 24px 70px rgba(15,66,120,.22);
  overflow:hidden;
  max-height:520px;
}
.search-results-head-v74{
  padding:14px 16px;
  border-bottom:1px solid #e5f2ff;
  background:linear-gradient(135deg,#f8fcff,#eef7ff);
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
}
.search-results-head-v74 strong{
  color:#0b2440;
}
.search-results-head-v74 span{
  color:#506784;
  font-size:12px;
  font-weight:800;
}
.search-results-list-v74{
  display:grid;
  gap:0;
  max-height:430px;
  overflow:auto;
}
.search-results-list-v74 a{
  display:grid;
  gap:4px;
  padding:14px 16px;
  text-decoration:none;
  color:#0b2440;
  border-bottom:1px solid #edf6ff;
}
.search-results-list-v74 a:hover{
  background:#f4faff;
}
.search-results-list-v74 a span{
  color:#005a9e;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-weight:950;
}
.search-results-list-v74 a strong{
  font-size:15px;
}
.search-results-list-v74 a small{
  color:#506784;
  line-height:1.35;
}

/* v74: camino de hormigas alineado a la caja inferior */
.page-wrap > .breadcrumb,
.main > .breadcrumb,
.breadcrumb{
  max-width:none!important;
  width:100%!important;
  margin:0 0 14px 0!important;
  padding-left:0!important;
  padding-right:0!important;
  box-sizing:border-box!important;
}
.page-wrap > .breadcrumb + section,
.page-wrap > .breadcrumb + .panel,
.page-wrap > .breadcrumb + article{
  margin-top:0!important;
}

@media(max-width:760px){
  .search-results-panel-v74{
    left:12px!important;
    right:12px!important;
    width:auto!important;
  }
}