/* ================= Top 20 ETL Tools — page styles ================= */
.etl-lp{
  --ink:#171717; --sub:#5c5c5c; --soft:#a3a3a3; --line:#ebebeb; --line-strong:#d1d1d1;
  --weak:#f7f7f7; --faded:#f5f5f5; --white:#fff; --purple:#7d52f4; --green:#1fc16b;
  --r8:8px; --r12:12px; --r16:16px; --r20:20px; --r24:24px;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
  color:var(--ink); background:var(--white);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
.etl-lp *{box-sizing:border-box;}
.etl-lp h1,.etl-lp h2,.etl-lp h3,.etl-lp h4{margin:0;font-weight:700;letter-spacing:-.01em;line-height:1.12;
  font-family:'Inter Display','Inter',sans-serif;font-optical-sizing:auto;}
.etl-lp p{margin:0;}
.etl-lp a{color:inherit;text-decoration:none;}
.etl-lp .wrap{max-width:1170px;margin:0 auto;padding:0 24px;}
.etl-lp .col{max-width:860px;margin:0 auto;}

/* ---------- Hero ---------- */
.etl-hero{padding:120px 0 40px;}
.etl-hero .inner{display:grid;grid-template-columns:1fr 482px;gap:48px;align-items:center;}
.etl-hero-text{display:flex;flex-direction:column;gap:32px;align-items:flex-start;justify-content:center;}
.etl-crumbs{font-size:12px;line-height:16px;font-weight:400;color:var(--sub);display:flex;align-items:center;}
.etl-crumbs a{color:var(--sub);}
.etl-crumbs > span:not(.cur){width:20px;text-align:center;flex-shrink:0;}
.etl-crumbs .cur{color:var(--ink);}
.etl-hero-copy{width:100%;}
.etl-meta{font-size:12px;line-height:16px;font-weight:500;color:var(--sub);margin-bottom:16px;}
.etl-hero h1{font-size:48px;line-height:56px;letter-spacing:-0.48px;font-weight:700;}
.etl-hero .lede{margin-top:24px;font-family:'Inter Display','Inter',sans-serif;font-size:20px;line-height:28px;font-weight:500;color:var(--sub);}
.etl-lp .etl-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--ink);
  color:#fff!important;font-size:15px;font-weight:600;line-height:1;padding:15px 24px!important;
  border-radius:999px;border:0;cursor:pointer;transition:.15s;text-decoration:none;}
.etl-lp .etl-btn:hover{background:#2f2f2f;color:#fff!important;}
.etl-hero .etl-btn{font-size:16px;font-weight:500;line-height:24px;letter-spacing:-0.176px;padding:16px 24px!important;}
.etl-author{padding:12px;border-top:1px solid var(--line-strong);display:flex;align-items:center;gap:8px;width:100%;}
.etl-author img,.etl-author .ava{width:42px;height:42px;border-radius:999px;object-fit:cover;background:#e7ddcf;flex:0 0 auto;}
.etl-author .ava{overflow:hidden;display:grid;place-items:center;color:var(--soft);}
.etl-author .ava img{width:100%;height:100%;}
.etl-author .ava i{font-size:22px;}
.etl-author .who{font-size:12px;line-height:16px;font-weight:500;color:var(--sub);}
.etl-author .nm{font-size:18px;line-height:24px;font-weight:500;letter-spacing:-0.27px;}
.etl-author .role{font-size:14px;line-height:20px;font-weight:500;letter-spacing:-0.084px;color:var(--sub);}
.etl-author-li{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;flex:0 0 auto;}
.etl-author-li i{color:#0a66c2;font-size:24px;line-height:1;}
.etl-hero-art{width:482px;height:380px;border-radius:24px;border:1px solid var(--line);
  background:
    linear-gradient(var(--line) 1px,transparent 1px) 0 0/48px 48px,
    linear-gradient(90deg,var(--line) 1px,transparent 1px) 0 0/48px 48px,
    #fcfcfc;
  position:relative;overflow:hidden;}
.etl-hero-art .tile{position:absolute;width:64px;height:64px;border-radius:14px;background:#fff;
  box-shadow:0 10px 24px -12px rgba(0,0,0,.25),0 0 0 1px var(--line);display:grid;place-items:center;font-size:26px;}
.etl-hero-art .glass{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:96px;height:96px;border:8px solid #ff6a1a;border-radius:999px;background:rgba(255,255,255,.35);}
.etl-hero-art .glass:after{content:"";position:absolute;right:-26px;bottom:-22px;width:34px;height:12px;
  background:#ff6a1a;border-radius:8px;transform:rotate(45deg);}
.etl-hero-art-img{width:482px;height:380px;border-radius:24px;object-fit:cover;
  border:1px solid var(--line);background:var(--weak);display:block;}

/* ---------- Social proof ---------- */
.etl-social{padding:36px 0 24px;text-align:center;}
.etl-social h3{font-size:20px;font-weight:500;color:var(--sub);letter-spacing:-.01em;}
.etl-logos{margin-top:32px;display:flex;flex-wrap:wrap;justify-content:center;gap:48px;align-items:center;
  filter:grayscale(1);opacity:.7;}
.etl-logos span{font-size:22px;font-weight:800;letter-spacing:-.02em;color:#3a3a3a;display:flex;align-items:center;gap:8px;}
.etl-logos span i{font-size:24px;}

/* Static "Trusted by" strip with image logos (Figma 525-16903) */
.etl-trusted{padding:36px 0;text-align:center;}
.etl-lp .etl-trusted-title{font-family:'Inter Display','Inter',sans-serif;font-size:40px;line-height:48px;font-weight:700;
  letter-spacing:-.01em;color:#171717;margin:0;}
.etl-trusted-logos{margin-top:20px;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:64px;}
.etl-trusted-logo{display:inline-flex;align-items:center;justify-content:center;height:60px;}
.etl-trusted-logo img{max-height:46px;width:auto;max-width:181px;object-fit:contain;display:block;}
@media(max-width:820px){
  .etl-trusted{padding:56px 0;}
  .etl-lp .etl-trusted-title{font-size:28px;line-height:34px;}
  .etl-trusted-logos{margin-top:40px;gap:40px;}
  .etl-trusted-logo{height:44px;}
  .etl-trusted-logo img{max-height:34px;}
}

/* ---------- Section basics ---------- */
.etl-sec{padding:36px 0;}
/* Per-block spacing toggles (Enrich → Block spacing) — collapse a block's top/bottom
   space whether it's created by padding (ETL .etl-sec) or margin (engineering .eng-main). */
.etl-blk.pad-t-0{margin-top:0 !important;}
.etl-blk.pad-t-0 > *{padding-top:0 !important;margin-top:0 !important;}
.etl-blk.pad-b-0{margin-bottom:0 !important;}
.etl-blk.pad-b-0 > *{padding-bottom:0 !important;margin-bottom:0 !important;}
.etl-sec h2{font-size:32px;line-height:36px;font-weight:600;letter-spacing:-.01em;}
.etl-sec .sub{margin-top:18px;font-size:18px;line-height:32px;letter-spacing:-.108px;color:var(--ink);}
.etl-body p{font-size:18px;line-height:32px;letter-spacing:-.108px;color:var(--ink);margin-top:16px;}
.etl-body p:first-child{margin-top:0;}
.etl-body strong{color:var(--ink);}
.etl-body h2:not(:first-child){margin-top:8px;}
.etl-body h3{font-size:22px;font-weight:600;letter-spacing:-.01em;margin-top:28px;}
.etl-body h4{font-size:18px;font-weight:600;letter-spacing:-.01em;margin-top:22px;}
.etl-body ul,.etl-body ol{margin:16px 0 0;padding-left:24px;display:flex;flex-direction:column;gap:10px;}
.etl-body li{font-size:18px;line-height:30px;letter-spacing:-.108px;color:var(--ink);}
.etl-body li::marker{color:var(--soft);}
.etl-lp .etl-body a{color:var(--purple);text-decoration:underline;}

/* Key takeaways */
.etl-takeaways{background:var(--weak);border:1px solid var(--line);border-radius:20px;padding:32px;}
.etl-tk-head{display:flex;align-items:center;gap:8px;}
.etl-tk-head i{font-size:24px;line-height:1;color:var(--ink);}
.etl-tk-head h3{font-size:26px;font-weight:700;letter-spacing:-.03em;color:var(--ink);line-height:1.1;}
.etl-tk-intro{margin-top:16px;font-size:16px;line-height:24px;color:var(--ink);letter-spacing:-.011em;}
.etl-tk-list{margin:16px 0 0;padding-left:22px;list-style:disc;display:flex;flex-direction:column;gap:16px;}
.etl-tk-list li{font-size:16px;line-height:24px;color:var(--ink);letter-spacing:-.011em;padding-left:6px;}
.etl-tk-list li::marker{color:var(--ink);font-size:.9em;}
.etl-tk-list strong{font-weight:700;color:var(--ink);}
.etl-eval{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-direction:column;gap:10px;}
.etl-eval li{position:relative;padding-left:26px;font-size:16px;line-height:1.6;color:#333;}
.etl-eval li:before{content:"";position:absolute;left:2px;top:9px;width:7px;height:7px;border-radius:999px;background:var(--purple);}
.etl-intro-copy{margin-top:0;}
.etl-intro-copy p{font-size:18px;line-height:32px;color:var(--ink);letter-spacing:-0.108px;margin:0 0 12px;}
.etl-intro-copy p:last-child{margin-bottom:0;}

/* ---------- Comparison table ---------- */
.etl-table-wrap{margin-top:28px;border:1px solid var(--line);border-radius:16px;overflow:hidden;}
.etl-table{width:100%;border-collapse:collapse;font-size:13.5px;}
.etl-table thead th{background:var(--ink);color:#fff;text-align:left;font-weight:600;padding:14px 16px;font-size:13px;white-space:nowrap;}
.etl-table td{padding:16px;border-top:1px solid var(--line);color:var(--sub);vertical-align:top;line-height:1.45;}
.etl-table .grp td{background:var(--weak);text-align:center;font-weight:600;color:var(--ink);font-size:14px;padding:12px;}
.etl-table .num{color:var(--ink);font-weight:600;width:36px;}
.etl-table .tool{color:var(--ink);font-weight:600;white-space:nowrap;}
.etl-table .price{white-space:nowrap;}
.etl-pick{display:inline-block;margin-top:6px;background:var(--ink);color:#fff;font-size:9px;font-weight:700;
  letter-spacing:.1em;padding:3px 7px;border-radius:5px;vertical-align:middle;}
.etl-tag{display:inline-block;border:1px solid var(--line-strong);border-radius:6px;padding:4px 9px;
  font-size:12px;font-weight:500;color:var(--ink);white-space:nowrap;}

/* ---------- SME quote ---------- */
.etl-quote{margin-top:0;background:var(--weak);border:1px solid var(--line);border-radius:16px;padding:24px;}
.etl-q-top{display:flex;flex-direction:column;gap:12px;}
.etl-q-mark{width:56px;height:56px;flex:0 0 auto;border-radius:999px;background:#fff;border:1px solid var(--line);
  display:grid;place-items:center;color:var(--ink);font-size:24px;line-height:1;
  box-shadow:0 0 0 1px rgba(51,51,51,.04),0 1px 1px .5px rgba(51,51,51,.04),0 3px 3px -1.5px rgba(51,51,51,.02),
    0 6px 6px -3px rgba(51,51,51,.04),0 12px 12px -6px rgba(51,51,51,.04),0 24px 24px -12px rgba(51,51,51,.04),
    0 48px 48px -24px rgba(51,51,51,.04);}
.etl-q-text{font-size:18px;line-height:1.33;color:var(--ink);letter-spacing:-.011em;}
.etl-q-foot{margin-top:24px;border-top:1px solid var(--line-strong);padding:12px 0;display:flex;align-items:flex-end;gap:8px;}
.etl-q-ava{width:42px;height:42px;flex:0 0 auto;border-radius:999px;background:#e7ddcf;}
.etl-q-person{display:flex;flex-direction:column;}
.etl-q-name{font-size:18px;font-weight:500;line-height:24px;letter-spacing:-.27px;color:var(--ink);}
.etl-q-role-row{display:flex;align-items:center;gap:8px;}
.etl-q-role{font-size:14px;line-height:20px;letter-spacing:-.084px;color:var(--sub);}
.etl-lp .etl-q-li{color:var(--ink);font-size:22px;line-height:1;display:inline-flex;}

/* ---------- Ebook CTA ---------- */
.etl-ebook{margin-top:0;background:var(--faded);border-radius:20px;padding:36px;display:grid;
  grid-template-columns:220px 1fr;gap:40px;align-items:center;overflow:hidden;}
.etl-ebook .cover{width:210px;height:280px;border-radius:8px;background:#141414;color:#fff;padding:22px 20px;
  box-shadow:0 30px 50px -20px rgba(0,0,0,.5);position:relative;}
.etl-ebook .cover .logo{font-size:16px;font-weight:800;}
.etl-ebook .cover .t{margin-top:26px;font-size:15px;font-weight:700;line-height:1.35;}
.etl-ebook .cover .t b{color:#22d3bb;}
.etl-ebook .cover .site{position:absolute;left:20px;bottom:16px;font-size:9px;color:#888;}
.etl-ebook h3{font-size:28px;line-height:1.2;font-weight:600;letter-spacing:-.14px;}
.etl-ebook .d{margin-top:14px;font-size:15px;line-height:1.6;color:var(--sub);max-width:420px;}
.etl-ebook .form{margin-top:22px;display:flex;gap:12px;flex-wrap:wrap;}
.etl-ebook .form input{flex:1;min-width:220px;border:1px solid var(--line-strong);border-radius:999px;
  padding:13px 18px;font-size:14px;font-family:inherit;background:#fff;}

/* ---------- Feature cards ---------- */
.etl-center{text-align:center;}
.etl-features{margin-top:28px;display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.etl-feature{background:var(--weak);border-radius:12px;padding:20px 22px;display:flex;gap:12px;}
.etl-feature i{color:var(--green);font-size:22px;flex:0 0 auto;margin-top:1px;}
.etl-feature .ft{font-size:15px;font-weight:600;}
.etl-feature .fd{margin-top:6px;font-size:13.5px;line-height:1.5;color:var(--sub);}

/* ---------- Types table ---------- */
.etl-types{margin-top:24px;border:1px solid var(--line);border-radius:12px;overflow:hidden;}
.etl-types table{width:100%;border-collapse:collapse;font-size:13px;}
.etl-types th{background:var(--ink);color:#fff;text-align:left;font-weight:600;padding:14px 16px;}
.etl-types td{padding:16px;border-top:1px solid var(--line);color:var(--sub);vertical-align:top;line-height:1.45;}
.etl-types td:first-child{color:var(--ink);font-weight:600;}

/* ---------- Which type cards ---------- */
.etl-choose{margin-top:28px;display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.etl-lp .etl-cc-card{border:1px solid var(--line);border-radius:16px;padding:24px;background:#fff;
  display:flex;flex-direction:column;}
.etl-cc-head{display:flex;align-items:center;gap:10px;margin-bottom:2px;}
.etl-cc-n{flex:0 0 auto;font-size:12px;font-weight:600;line-height:1;color:var(--soft);background:var(--weak);
  border-radius:6px;padding:4px 7px;}
.etl-lp .etl-cc-title{font-size:18px;font-weight:700;letter-spacing:-.01em;line-height:1.3;}
.etl-cc-list{list-style:disc;margin:14px 0 0;padding-left:20px;display:flex;flex-direction:column;gap:7px;}
.etl-cc-list li{font-size:15px;line-height:1.5;color:var(--sub);letter-spacing:-.01em;padding-left:4px;}
.etl-cc-list li::marker{color:var(--ink);}
.etl-cc-best{margin-top:16px;background:var(--weak);border-radius:8px;padding:11px 14px;font-size:13px;
  line-height:1.5;color:var(--sub);}
.etl-cc-best b{color:var(--ink);font-weight:600;}

/* ---------- Detailed overview ---------- */
.etl-group-title{margin-top:40px;font-size:22px;font-weight:600;letter-spacing:-.01em;padding-bottom:14px;border-bottom:2px solid var(--ink);}

/* Rich company-overview card (1:1 with Figma) */
.etl-toolcard{margin-top:24px;background:#fff;border:1px solid var(--line);border-radius:16px;
  box-shadow:0 1px .5px rgba(51,51,51,.04),0 3px 1.5px rgba(51,51,51,.02),0 6px 3px rgba(51,51,51,.04),
    0 12px 6px rgba(51,51,51,.04),0 24px 12px rgba(51,51,51,.04),0 48px 24px rgba(51,51,51,.04);}
/* Consecutive tool-card blocks sit 16px apart (no big section padding between them) */
.etl-tc-block{padding:0;}
.etl-tc-block .etl-toolcard{margin-top:16px;}
/* header */
.etl-lp .etl-tc-header{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;
  background:transparent;border:0;cursor:pointer;text-align:left;padding:32px;font-family:inherit;}
.etl-tc-header-left{display:flex;align-items:center;gap:16px;min-width:0;}
.etl-tc-logo{width:40px;height:40px;border-radius:9px;flex:0 0 auto;display:grid;place-items:center;
  color:#fff;font-size:20px;font-weight:800;line-height:1;text-transform:lowercase;}
/* Circular avatar in the accordion header (Figma) */
.etl-tc-avatar{width:48px;height:48px;border-radius:50%;flex:0 0 auto;display:grid;place-items:center;
  background:#f1f1f1;color:#b0b0b0;overflow:hidden;position:relative;}
.etl-tc-avatar i{font-size:24px;}
.etl-tc-avatar-img{width:100%;height:100%;object-fit:contain;background:#fff;padding:7px;}
.etl-tc-avatar-letter{font-size:20px;font-weight:800;color:#171717;text-transform:lowercase;line-height:1;}
.etl-tc-title-stack{display:flex;flex-direction:column;gap:2px;min-width:0;}
.etl-tc-title-row{display:flex;align-items:center;gap:12px;}
.etl-tc-name{font-size:16px;font-weight:600;color:var(--ink);}
.etl-tc-badge{background:var(--line);color:var(--ink);font-size:11px;font-weight:500;letter-spacing:.22px;
  text-transform:uppercase;padding:2px 8px;border-radius:999px;line-height:12px;}
.etl-tc-subtitle{font-size:14px;color:var(--sub);letter-spacing:-.084px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;}
.etl-tc-subtitle[contenteditable]:empty::before{content:attr(data-placeholder);color:var(--soft);}
.etl-tc-chevron{flex:0 0 auto;width:36px;height:36px;display:grid;place-items:center;color:var(--ink);
  font-size:22px;transition:transform .25s ease;}
.etl-toolcard.is-open .etl-tc-chevron{transform:rotate(180deg);}
/* collapsible body */
.etl-tc-body{display:none;flex-direction:column;gap:40px;padding:0 32px 32px;}
.etl-toolcard.is-open .etl-tc-body{display:flex;}
.etl-tc-section{display:flex;flex-direction:column;gap:16px;}
.etl-tc-sectionhead{display:flex;align-items:center;gap:12px;}
.etl-tc-lbl{font-size:16px;font-weight:500;color:var(--ink);letter-spacing:-.176px;}
.etl-tc-h{font-size:18px;font-weight:700;color:var(--ink);letter-spacing:-.27px;}
.etl-tc-rule{height:1px;background:var(--line);width:100%;margin-top:-8px;}
.etl-tc-section .etl-tc-rule{margin-top:0;}
.etl-tc-vdiv{width:1px;height:18px;background:var(--line-strong);}
.etl-tc-rating{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:var(--sub);
  text-transform:uppercase;letter-spacing:.84px;}
.etl-tc-g2{display:inline-grid;place-items:center;min-width:24px;height:24px;padding:0 5px;border-radius:6px;
  background:#ff492c;color:#fff;font-size:11px;font-weight:800;letter-spacing:0;}
.etl-tc-overview{font-size:16px;line-height:24px;color:var(--sub);letter-spacing:-.176px;}
.etl-tc-best{font-size:16px;line-height:24px;color:var(--ink);letter-spacing:-.176px;}
.etl-tc-best b{font-weight:700;}
/* two-column rows */
.etl-tc-row{display:flex;gap:32px;align-items:flex-start;}
.etl-tc-col-main{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:16px;}
.etl-tc-col-side{width:300px;flex:0 0 300px;display:flex;flex-direction:column;gap:16px;}
/* features */
.etl-tc-features{display:flex;flex-direction:column;gap:16px;}
.etl-tc-feature{display:flex;gap:12px;align-items:flex-start;}
.etl-tc-ficon{flex:0 0 auto;width:24px;height:24px;border-radius:5px;background:var(--weak);display:grid;
  place-items:center;color:var(--ink);font-size:16px;}
.etl-tc-ftitle{font-size:16px;font-weight:500;color:var(--ink);letter-spacing:-.176px;line-height:24px;}
.etl-tc-fdesc{margin-top:4px;font-size:14px;line-height:20px;color:var(--sub);letter-spacing:-.084px;}
/* pros & cons */
.etl-tc-proscons{display:flex;flex-direction:column;gap:12px;}
.etl-tc-pc{background:var(--weak);border:1px solid var(--line);border-radius:8px;padding:16px;
  display:flex;flex-direction:column;gap:12px;}
.etl-tc-pc-head{display:flex;align-items:center;gap:4px;font-size:16px;font-weight:500;letter-spacing:-.176px;}
.etl-tc-pc-head i{font-size:18px;}
.etl-tc-pros-head{color:var(--green);}
.etl-tc-cons-head{color:var(--state-error,#fb3748);}
.etl-tc-pc ul{margin:0;padding-left:21px;display:flex;flex-direction:column;gap:8px;}
.etl-tc-pc li{font-size:14px;line-height:20px;color:var(--sub);letter-spacing:-.084px;}
/* pricing table */
.etl-tc-pricing{border:1px solid var(--line);border-radius:8px;overflow:hidden;font-size:12px;}
.etl-tc-prow{display:flex;align-items:center;padding:0 12px;min-height:45px;line-height:16px;}
.etl-tc-prow>span{width:100px;flex:0 0 100px;color:var(--sub);}
.etl-tc-prow>span:first-child,.etl-tc-prow .etl-tc-pplan{flex:1 1 0;width:auto;color:var(--ink);}
.etl-tc-phead{background:var(--ink);min-height:40px;font-weight:500;}
.etl-tc-phead>span,.etl-tc-phead .etl-tc-pplan{color:#fff;}
.etl-tc-pricing .etl-tc-prow:not(.etl-tc-phead){border-bottom:1px solid var(--line);}
.etl-tc-pricing .etl-tc-prow:not(.etl-tc-phead):nth-child(even){background:var(--weak);}
.etl-tc-pricing .etl-tc-prow:last-child{border-bottom:0;}
.etl-tc-prow:not(.etl-tc-phead) .etl-tc-pplan{font-weight:400;}
/* review */
.etl-tc-review{border:1px solid var(--line);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:12px;}
.etl-tc-stars{display:flex;align-items:center;gap:2px;color:#f6b51e;font-size:18px;}
.etl-tc-rval{margin-left:8px;font-size:14px;font-weight:500;color:var(--sub);letter-spacing:-.006em;}
.etl-tc-quote{font-size:14px;line-height:20px;color:var(--sub);letter-spacing:-.084px;}
.etl-tc-reviewer{display:flex;flex-direction:column;gap:2px;font-size:12px;line-height:16px;}
.etl-tc-rname{font-weight:500;color:var(--ink);}
.etl-tc-rmeta{color:var(--soft);}
/* case study banner */
.etl-lp a.etl-tc-casestudy{display:flex;align-items:center;justify-content:space-between;gap:24px;
  background:var(--ink);border-radius:12px;padding:24px;text-decoration:none;}
.etl-tc-cs-title{font-size:18px;font-weight:500;color:#fff;letter-spacing:-.27px;line-height:24px;}
.etl-tc-cs-desc{margin-top:4px;font-size:14px;line-height:20px;color:rgba(255,255,255,.8);letter-spacing:-.084px;}
.etl-tc-cs-btn{flex:0 0 auto;background:#fff;color:var(--ink);font-size:12px;font-weight:500;
  padding:10px 12px;border-radius:999px;line-height:16px;}
/* Standalone "CTA card" block (Figma 525-17475) — dark case-study-style banner */
.etl-lp a.etl-cta-card{display:flex;align-items:center;justify-content:space-between;gap:24px;
  background:var(--ink);border-radius:16px;padding:24px;text-decoration:none;transition:box-shadow .18s,transform .18s;}
.etl-lp a.etl-cta-card:hover{box-shadow:0 16px 40px -20px rgba(0,0,0,.5);transform:translateY(-1px);}
.etl-lp .etl-cta-card-title{font-size:18px;font-weight:500;line-height:24px;letter-spacing:-.27px;color:#fff;}
.etl-cta-card-desc{margin-top:4px;font-size:14px;line-height:20px;letter-spacing:-.084px;color:rgba(255,255,255,.7);}
.etl-cta-card-btn{flex:0 0 auto;background:#fff;color:var(--ink);font-size:13px;font-weight:500;line-height:16px;
  padding:10px 16px;border-radius:999px;white-space:nowrap;}
@media(max-width:640px){.etl-lp a.etl-cta-card{flex-direction:column;align-items:flex-start;gap:16px;}}

/* ---------- Key factors grid ---------- */
.etl-factors{margin-top:28px;border:1px solid var(--line);border-radius:16px;display:grid;
  grid-template-columns:repeat(3,1fr);overflow:hidden;}
.etl-factors .cell{padding:28px 26px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);}
.etl-factors .cell:nth-child(3n){border-right:0;}
.etl-factors .cell:nth-last-child(-n+3){border-bottom:0;}
.etl-factors .n{display:inline-block;font-size:12px;font-weight:600;color:var(--soft);background:var(--weak);
  border-radius:6px;padding:3px 8px;}
.etl-factors h4{margin-top:16px;font-size:19px;letter-spacing:-.01em;}
.etl-factors p{margin-top:12px;font-size:13.5px;line-height:1.55;color:var(--sub);}

/* ---------- Use case cards ---------- */
/* Use-case / "Explore More" cards — Figma 525-17572 (Integration Card) */
.etl-usecases{margin-top:28px;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.etl-usecases .uc{border:1px solid var(--line);border-radius:12px;padding:24px;background:#fff;
  box-shadow:0 1px 2px rgba(10,13,20,.03);display:flex;flex-direction:column;
  transition:box-shadow .18s,transform .18s,border-color .18s;}
.etl-usecases .uc:hover{border-color:var(--line-strong);box-shadow:0 10px 28px -14px rgba(0,0,0,.18);transform:translateY(-2px);}
.etl-usecases .uic{width:32px;height:32px;display:flex;align-items:center;justify-content:center;font-size:28px;line-height:1;margin-bottom:12px;}
.etl-usecases .uic img{width:32px;height:32px;object-fit:contain;display:block;border-radius:6px;}
.etl-lp .etl-usecases .ut{font-size:16px;line-height:20px;font-weight:600;letter-spacing:-.043em;color:var(--ink);}
.etl-usecases .ud{margin-top:4px;font-size:14px;line-height:20px;letter-spacing:-.043em;color:var(--sub);flex:1;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.etl-lp .etl-usecases .explore{margin-top:16px;font-size:14px;line-height:20px;font-weight:500;letter-spacing:-.043em;color:var(--purple);display:inline-flex;align-items:center;gap:4px;}
.etl-usecases .explore i{font-size:16px;}
.etl-loadmore{margin-top:32px;text-align:center;}
.etl-uc-hidden{display:none;}

/* ---------- Final CTA ---------- */
.etl-final{margin:20px 0 64px;}
.etl-final .box{background:var(--ink);border-radius:24px;padding:64px;text-align:center;color:#fff;
  position:relative;overflow:hidden;}
.etl-final h2{font-size:38px;letter-spacing:-.03em;color:#fff;}
.etl-final p{margin-top:16px;font-size:17px;color:#cfcfcf;max-width:560px;margin-left:auto;margin-right:auto;line-height:1.6;}
.etl-final .btns{margin-top:32px;display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
.etl-lp .etl-final .etl-btn{background:#fff;color:var(--ink)!important;}
.etl-lp .etl-final .etl-btn:hover{background:#eee;color:var(--ink)!important;}
.etl-lp .etl-final .etl-btn.outline{background:transparent;color:#fff!important;border:1px solid #4a4a4a;}
.etl-lp .etl-final .etl-btn.outline:hover{background:rgba(255,255,255,.08);color:#fff!important;}

/* ---------- Anchor offset (sticky navbar) ---------- */
.etl-anchor{scroll-margin-top:110px;}

/* ---------- Table of contents ---------- */
.etl-toc{background:var(--weak);border:1px solid var(--line);border-radius:16px;padding:24px 28px;}
.etl-toc-title{font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--soft);margin-bottom:14px;}
.etl-toc-list{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:9px;}
.etl-toc-list li{font-size:15px;line-height:1.4;color:var(--sub);}
.etl-lp .etl-toc-list a{color:var(--sub);transition:color .12s;}
.etl-lp .etl-toc-list a:hover{color:var(--purple);text-decoration:underline;}

/* ---------- Generic table ---------- */
.etl-gtable-wrap{margin-top:24px;border:1px solid var(--line);border-radius:12px;overflow:hidden;}
.etl-gtable{width:100%;border-collapse:collapse;font-size:13.5px;}
.etl-gtable th{background:var(--ink);color:#fff;text-align:left;font-weight:600;padding:14px 16px;white-space:nowrap;}
.etl-gtable td{padding:16px;border-top:1px solid var(--line);color:var(--sub);vertical-align:top;line-height:1.45;}
.etl-gtable td:first-child{color:var(--ink);font-weight:600;}
.etl-lp .etl-gtable a{color:var(--purple);text-decoration:underline;}

/* ---------- FAQ accordion (native <details>) ---------- */
.etl-faq{margin-top:24px;border:1px solid var(--line);border-radius:16px;overflow:hidden;}
.etl-faq-item{border-top:1px solid var(--line);}
.etl-faq-item:first-child{border-top:0;}
.etl-faq-item>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;
  gap:16px;padding:20px 24px;font-size:17px;font-weight:600;color:var(--ink);}
.etl-faq-item>summary::-webkit-details-marker{display:none;}
.etl-faq-chevron{flex:0 0 auto;font-size:20px;color:var(--sub);transition:transform .2s ease;}
.etl-faq-item[open]>summary .etl-faq-chevron{transform:rotate(180deg);}
.etl-faq-a{padding:0 24px 20px;font-size:16px;line-height:26px;color:var(--sub);}
.etl-lp .etl-faq-a a{color:var(--purple);text-decoration:underline;}

/* ---------- Related posts ---------- */
.etl-related{margin-top:28px;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.etl-lp a.etl-rel-card{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff;
  display:flex;flex-direction:column;transition:box-shadow .15s;}
.etl-lp a.etl-rel-card:hover{box-shadow:0 12px 24px -12px rgba(0,0,0,.18);}
.etl-rel-thumb{aspect-ratio:16/9;background:var(--weak);overflow:hidden;}
.etl-rel-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.etl-rel-thumb-edit{display:grid;place-items:center;}
.etl-rel-thumb-ph{color:var(--muted,#8a8a8a);font-size:12px;}
.etl-tc-logo-edit{display:inline-flex;}
.etl-rel-body{padding:18px 20px;display:flex;flex-direction:column;gap:8px;}
.etl-rel-tag{align-self:flex-start;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--purple);}
.etl-rel-meta-author{display:inline-flex;align-items:center;gap:6px;}
.etl-rel-ava{width:20px;height:20px;border-radius:50%;background:#e7ddcf;display:inline-grid;place-items:center;
  color:#fff;font-size:10px;font-weight:700;overflow:hidden;}
.etl-rel-title{font-size:16px;font-weight:600;line-height:1.35;color:var(--ink);}
.etl-rel-meta{margin-top:2px;display:flex;flex-wrap:wrap;gap:10px;font-size:12px;color:var(--soft);}

/* ---------- Tool-card additions (migrated cards) ---------- */
.etl-tc-logo-img{width:40px;height:40px;border-radius:9px;flex:0 0 auto;object-fit:contain;background:var(--weak);padding:4px;}
.etl-tc-meta{font-size:14px;color:var(--sub);letter-spacing:-.084px;}
.etl-tc-rcount{color:var(--soft);}
.etl-tc-list{margin:0;padding-left:22px;list-style:disc;display:flex;flex-direction:column;gap:8px;}
.etl-tc-list li{font-size:14px;line-height:20px;color:var(--sub);letter-spacing:-.084px;}
.etl-tc-list li::marker{color:var(--soft);}
.etl-tc-resources{display:flex;flex-wrap:wrap;gap:8px 20px;}
.etl-lp .etl-tc-resources a{color:var(--purple);font-size:14px;font-weight:500;text-decoration:underline;}

/* ---------- Responsive ---------- */
@media (max-width:900px){
  .etl-related{grid-template-columns:1fr;}
  .etl-gtable-wrap{overflow-x:auto;}
  .etl-gtable{min-width:640px;}
  .etl-hero .inner{grid-template-columns:1fr;gap:32px;}
  .etl-hero-art,.etl-hero .inner>.etl-hero-art{width:100%;max-width:482px;}
  .etl-hero-art-img{width:100%;max-width:482px;height:auto;aspect-ratio:482/380;}
  .etl-hero h1{font-size:38px;}
  .etl-features,.etl-choose{grid-template-columns:1fr;}
  .etl-factors,.etl-usecases{grid-template-columns:1fr;}
  .etl-factors .cell{border-right:0!important;}
  .etl-ebook{grid-template-columns:1fr;text-align:center;justify-items:center;}
  .etl-tc-row{flex-direction:column;gap:24px;}
  .etl-tc-col-side{width:100%;flex:1 1 auto;}
  .etl-lp .etl-tc-header{padding:20px;}
  .etl-tc-body{padding:0 20px 20px;gap:28px;}
  .etl-lp a.etl-tc-casestudy{flex-direction:column;align-items:flex-start;gap:16px;}
  .etl-tc-pricing{overflow-x:auto;}
  .etl-sec h2{font-size:27px;}
  .etl-final .box{padding:40px 24px;}
  .etl-final h2{font-size:28px;}
  .etl-table-wrap,.etl-types{overflow-x:auto;}
  .etl-table,.etl-types table{min-width:640px;}
}

/* ================= Engineering blog index ================= */
.etl-eng-index{padding:80px 0;}
.etl-eng-head{max-width:720px;margin:0 0 48px;}
.etl-eng-eyebrow{display:inline-block;font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--purple);margin-bottom:14px;}
.etl-lp .etl-eng-head h1{font-size:44px;line-height:1.08;font-weight:700;letter-spacing:-.02em;}
.etl-eng-head p{margin-top:16px;font-size:18px;line-height:28px;color:var(--sub);}
.etl-eng-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
.etl-eng-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#fff;transition:box-shadow .18s,transform .18s;}
.etl-eng-card:hover{box-shadow:0 12px 32px -16px rgba(0,0,0,.22);transform:translateY(-2px);}
.etl-eng-thumb{position:relative;aspect-ratio:16/9;background:var(--weak);display:grid;place-items:center;overflow:hidden;}
.etl-eng-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.etl-eng-thumb-ph{color:var(--soft);font-size:40px;display:grid;place-items:center;}
.etl-eng-draft{position:absolute;top:10px;left:10px;background:#f6b51e;color:#171717;font-size:11px;font-weight:700;padding:3px 9px;border-radius:999px;}
.etl-eng-body{padding:20px 22px 24px;display:flex;flex-direction:column;gap:8px;flex:1;}
.etl-lp .etl-eng-body h2{font-size:19px;line-height:1.3;font-weight:700;letter-spacing:-.01em;}
.etl-eng-body p{font-size:14.5px;line-height:1.5;color:var(--sub);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.etl-eng-meta{margin-top:auto;padding-top:10px;font-size:12.5px;color:var(--soft);font-weight:500;}
.etl-eng-empty{color:var(--soft);text-align:center;padding:60px;font-size:15px;border:1px dashed var(--line);border-radius:16px;}
@media(max-width:900px){.etl-eng-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.etl-eng-grid{grid-template-columns:1fr;}.etl-eng-index{padding:48px 0;}.etl-lp .etl-eng-head h1{font-size:32px;}}

/* ================= Code representation block (Figma 626-2488) ================= */
.etl-code{margin:0;}
.etl-code-file{font:500 13px/1 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;color:var(--sub);
  margin:0 0 10px;}
.etl-code-panel{position:relative;background:var(--weak);border:1px solid var(--line);border-radius:12px;}
.etl-code-copy{position:absolute;top:16px;right:16px;z-index:2;display:inline-grid;place-items:center;
  width:24px;height:24px;border:0;border-radius:6px;background:transparent;color:var(--soft);cursor:pointer;transition:.15s;}
.etl-code-copy:hover{color:var(--ink);}
.etl-code-copy i{font-size:24px;}
.etl-code-copy .ti-check{display:none;}
.etl-code-copy.is-copied .ti-copy{display:none;}
.etl-code-copy.is-copied .ti-check{display:block;color:var(--green);}
.etl-code-scroll{overflow-x:auto;padding:16px;}
.etl-code-table{border-collapse:collapse;width:100%;font:400 14px/2 Monaco,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:-.015em;font-feature-settings:"cv09" 1,"ss11" 1;}
.etl-code-ln{width:1%;white-space:nowrap;text-align:right;padding:0 16px 0 0;color:var(--soft);
  user-select:none;-webkit-user-select:none;vertical-align:top;}
.etl-lp .etl-code-src{color:var(--ink);white-space:pre;tab-size:2;padding:0;}
.etl-auto-note{display:flex;align-items:flex-start;gap:8px;margin-bottom:16px;padding:10px 14px;border:1px dashed var(--line-strong);border-radius:10px;background:var(--weak);font-size:13px;line-height:1.5;color:var(--sub);}
.etl-auto-note i{color:var(--purple);font-size:16px;flex:0 0 auto;margin-top:1px;}
.etl-auto-note b{color:var(--ink);font-weight:600;}
.etl-code-cmt{color:var(--soft);}
.etl-code-caption{margin-top:10px;font-size:13px;color:var(--sub);}
/* Inline code editor (builder edit mode) — a real textarea that feels like a code editor */
.etl-lp textarea.etl-code-edit{display:block;width:100%;box-sizing:border-box;min-height:120px;resize:vertical;
  border:0;background:transparent;padding:16px;margin:0;color:var(--ink);
  font:400 14px/2 Monaco,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:-.015em;
  white-space:pre;overflow:auto;tab-size:4;-moz-tab-size:4;outline:0;}
.etl-lp textarea.etl-code-edit::placeholder{color:var(--soft);}
.etl-lp textarea.etl-code-edit:focus{background:#faf8ff;border-radius:12px;}

/* ================= Engineering blog: two-column article (Figma 548-3218) ================= */
/* Content width 1170 (Figma 135px gutter at 1440), vs the shared 1122 wrap */
.eng-lp .wrap{max-width:1218px;}
/* Hero (Figma: title 46/56 w600, image card 554 r17.3 + layered shadow, gap 76) */
.eng-lp .etl-hero{padding-bottom:60px;}
.eng-lp .etl-hero .inner{grid-template-columns:1fr 554px;gap:76px;}
.eng-lp .etl-hero h1{font-size:46px;line-height:56px;font-weight:600;letter-spacing:-.01em;}
.eng-lp .etl-hero-art,.eng-lp .etl-hero-art-img{width:554px;height:312px;border-radius:17.3px;
  box-shadow:0 41.5px 41.5px -20.8px rgba(51,51,51,.04),0 20.8px 20.8px -10.4px rgba(51,51,51,.04),
    0 10.4px 10.4px -5.2px rgba(51,51,51,.04),0 2.6px 2.6px -1.3px rgba(51,51,51,.02),
    0 0 0 .87px rgba(51,51,51,.04);}
.eng-lp .etl-hero-art-img{background:#f7f7f7;object-fit:cover;}

/* Two-column body: main 823 / sidebar 278, gap 68 (content width 1170) */
.eng-lp .eng-body{display:grid;grid-template-columns:minmax(0,1fr) 278px;gap:68px;align-items:start;padding-top:88px;padding-bottom:56px;}
.eng-main{min-width:0;}
.eng-main .etl-sec{padding:0;}
.eng-main .wrap{max-width:none;margin:0;padding:0;}
.eng-main .col{max-width:none;margin:0;}
.eng-main > *{margin-top:32px;}
.eng-main > *:first-child{margin-top:0;}
.eng-main > .etl-spacer{margin-top:0;}  /* spacer adds its own height, no extra gap */
.eng-main h2,.eng-main h3{scroll-margin-top:100px;}
.eng-main h2{font-weight:600;}
.eng-main .etl-body h3{font-size:24px;letter-spacing:-.015em;}
/* inline code chips in prose */
.etl-lp .etl-body code{font:500 .86em/1.4 Monaco,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  background:#f0f0f0;color:#171717;padding:2px 6px;border-radius:6px;overflow-wrap:anywhere;}

/* Sidebar */
.eng-aside{min-width:0;}
.eng-aside-sticky{position:sticky;top:100px;display:flex;flex-direction:column;gap:20px;}
.eng-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px;
  box-shadow:0 1px 2px rgba(10,13,20,.03);display:flex;flex-direction:column;gap:16px;}
.eng-card-rule{height:1px;background:var(--line);margin:0 -0;}
.eng-toc[hidden]{display:none;}
.eng-toc[hidden] + .eng-card-rule{display:none;}
.eng-lp .eng-toc-h{font-family:'Inter Display','Inter',sans-serif;font-size:20px;line-height:28px;font-weight:500;
  color:var(--ink);letter-spacing:-.01em;margin-bottom:16px;}
.eng-toc-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;}
.eng-lp .eng-toc-list a{display:block;font-size:15px;line-height:1.35;color:var(--sub);border-left:2px solid transparent;padding-left:12px;transition:.15s;}
.eng-lp .eng-toc-list a:hover{color:var(--ink);}
.eng-lp .eng-toc-list a.is-active{color:var(--ink);font-weight:600;border-left-color:var(--ink);}
.eng-toc-list li.lvl-3 a{padding-left:24px;font-size:14px;}
.eng-share-h{font-size:16px;line-height:20px;font-weight:500;color:var(--ink);letter-spacing:-.006em;margin-bottom:12px;}
.eng-share-row{display:flex;justify-content:space-between;gap:8px;}
.eng-lp .eng-share-btn{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--ink);cursor:pointer;transition:.15s;text-decoration:none;}
.eng-lp .eng-share-btn:hover{background:var(--weak);border-color:var(--line-strong);}
.eng-share-btn i{font-size:18px;}
.eng-share-btn .ti-check{display:none;}
.eng-share-btn.is-copied .ti-link{display:none;}
.eng-share-btn.is-copied .ti-check{display:block;color:var(--green);}
/* Promo card (#F5F5F5, r16, 158px dark button) */
.eng-promo{background:var(--faded);border:1px solid var(--line);border-radius:16px;padding:16px;
  box-shadow:0 1px 2px rgba(10,13,20,.03);display:flex;flex-direction:column;gap:24px;}
.eng-lp .eng-promo-title{font-family:'Inter Display','Inter',sans-serif;font-size:20px;line-height:28px;font-weight:500;letter-spacing:-.01em;color:var(--ink);}
.eng-promo-note{display:inline-flex;align-items:center;gap:4px;margin-top:8px;font-size:12px;line-height:16px;color:var(--sub);}
.eng-promo-note i{font-size:14px;color:var(--ink);}
.eng-lp .eng-promo-btn{align-self:flex-start;background:#262626;color:#fff;font-size:12px;font-weight:500;
  padding:10px 16px;border-radius:999px;text-decoration:none;transition:.15s;}
.eng-lp .eng-promo-btn:hover{background:#000;}
/* Related posts (Figma 548-3990): contained to the article container (1170), exact card */
.eng-lp > .etl-sec > .col{max-width:1218px;}
.eng-lp > .etl-sec{padding:80px 0 40px;}
.eng-lp .etl-related{grid-template-columns:repeat(3,1fr);gap:32px;margin-top:32px;}
.eng-lp a.etl-rel-card{border:0;border-radius:24px;background:#fff;padding:4px;overflow:visible;
  box-shadow:0 1px 2px rgba(10,13,20,.03);}
.eng-lp a.etl-rel-card:hover{box-shadow:0 14px 30px -16px rgba(0,0,0,.2);transform:none;}
.eng-lp .etl-rel-thumb{aspect-ratio:16/9;border-radius:20px;display:grid;place-items:center;}
.eng-lp .etl-rel-thumb-ph i{font-size:36px;color:var(--soft);}
.eng-lp .etl-rel-body{padding:12px;gap:12px;}
.eng-lp .etl-rel-tag{font-size:14px;line-height:20px;font-weight:500;letter-spacing:.06em;color:#7d52f4;}
.eng-lp .etl-rel-title{font-size:24px;line-height:32px;font-weight:500;letter-spacing:-.015em;color:#222;}
.eng-lp .etl-rel-meta{font-size:14px;line-height:20px;color:#5c5c5c;}
.eng-lp .etl-rel-meta-author{gap:8px;}
.eng-lp .etl-rel-ava{width:20px;height:20px;font-size:9px;}
@media(max-width:900px){
  .eng-lp .eng-body{grid-template-columns:1fr;gap:0;padding-top:40px;padding-bottom:32px;}
  .eng-main > *{margin-top:24px;}
  .eng-aside{display:none;}
  .eng-lp .etl-hero .inner{grid-template-columns:1fr;gap:32px;}
  .eng-lp .etl-hero-art,.eng-lp .etl-hero-art-img{width:100%;}
}

/* ================= Tags block ================= */
.etl-tags{display:flex;flex-wrap:wrap;gap:8px;}
.etl-tag{font-size:13px;color:var(--sub);background:var(--weak);border:1px solid var(--line);border-radius:8px;padding:5px 12px;line-height:1.3;}

/* ================= Author bio card ================= */
.etl-authorbio{display:flex;gap:16px;background:var(--weak);border:1px solid var(--line);border-radius:16px;padding:24px;}
.etl-authorbio-ava{position:relative;flex:0 0 auto;width:48px;height:48px;border-radius:50%;overflow:hidden;background:#e7ddcf;display:grid;place-items:center;}
.etl-authorbio-ava img{width:100%;height:100%;object-fit:cover;}
.etl-authorbio-ava i{font-size:24px;color:#b0a68f;}
.etl-authorbio-body{min-width:0;flex:1;}
.etl-authorbio-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;}
.etl-lp .etl-authorbio-name{font-size:16px;font-weight:700;color:var(--ink);letter-spacing:-.01em;}
.etl-authorbio-role{font-size:13px;color:var(--sub);margin-top:2px;}
.etl-authorbio-li{flex:0 0 auto;color:#0a66c2;}
.etl-authorbio-li i{font-size:20px;}
.etl-authorbio-text{margin-top:12px;font-size:14px;line-height:1.65;color:var(--sub);}
.etl-rel-ava img{width:100%;height:100%;object-fit:cover;}

/* ================= Spacer block (author-inserted vertical space, 16px/unit) ================= */
.etl-spacer{width:100%;}
.etl-spacer-edit{display:grid;place-items:center;border:1px dashed var(--line-strong);border-radius:8px;
  background:repeating-linear-gradient(45deg,transparent,transparent 6px,rgba(0,0,0,.02) 6px,rgba(0,0,0,.02) 12px);}
.etl-spacer-edit span{font:500 11px/1 'Inter',sans-serif;color:var(--soft);letter-spacing:.02em;}

/* ================= Engineering index: featured + latest ================= */
.eng-index-lp .eng-featured{display:grid;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:28px;margin-bottom:56px;}
.eng-index-lp a.eng-feat-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:#fff;transition:box-shadow .18s,transform .18s;}
.eng-index-lp a.eng-feat-card:hover{box-shadow:0 16px 40px -18px rgba(0,0,0,.24);transform:translateY(-2px);}
.eng-feat-thumb{position:relative;aspect-ratio:16/9;background:var(--weak);display:grid;place-items:center;overflow:hidden;}
.eng-feat-thumb img{width:100%;height:100%;object-fit:cover;}
.eng-feat-badge{position:absolute;top:14px;left:14px;display:inline-flex;align-items:center;gap:5px;background:#171717;color:#fff;font-size:12px;font-weight:600;padding:5px 11px;border-radius:999px;}
.eng-feat-badge i{font-size:13px;color:#f6b51e;}
.eng-feat-body{padding:24px;display:flex;flex-direction:column;gap:10px;flex:1;}
.eng-feat-cat{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--purple);}
.eng-index-lp .eng-feat-body h2{font-size:24px;line-height:1.25;font-weight:700;letter-spacing:-.01em;}
.eng-feat-body p{font-size:15px;line-height:1.55;color:var(--sub);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.eng-feat-meta{margin-top:auto;padding-top:8px;display:flex;align-items:center;gap:6px;font-size:13px;color:var(--soft);}
.eng-latest-head{margin-bottom:24px;}
.eng-index-lp .eng-latest-head h2{font-size:24px;font-weight:700;letter-spacing:-.01em;}
.eng-index-lp .etl-eng-body .eng-feat-cat{margin-bottom:2px;}
@media(max-width:600px){.eng-index-lp .eng-featured{grid-template-columns:1fr;}}

/* ================= ETL-tools horizontal sticky TOC (Figma 525-16782) ================= */
.etl-toc-bar{position:sticky;top:85px;z-index:20;background:#f7f7f7;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
/* Content-heavy TOC: span full width (minor gutter) instead of the 1170 content wrap */
.etl-toc-bar .wrap{max-width:none;padding:0 40px;}
/* `safe center`: center the tabs when they fit, but fall back to start-alignment
   when they overflow — otherwise centering clips the first tab off the left edge
   (scrollLeft is stuck at 0 and it can't be reached). */
.etl-toc-tabs{display:flex;justify-content:safe center;gap:6px;padding:8px 0;overflow-x:auto;-ms-overflow-style:none;scrollbar-width:none;}
.etl-toc-tabs::-webkit-scrollbar{display:none;}
/* Pill tabs (like the main nav): default = plain text; hover/active = rounded
   border + slightly darker fill (bar bg is #f7f7f7, so use a translucent black). */
.etl-lp .etl-toc-bar .etl-toc-tab{flex:0 0 auto;padding:8px 14px;font:500 14px/20px 'Inter',sans-serif;letter-spacing:-.006em;
  color:var(--sub);border:1px solid transparent;border-radius:8px;white-space:nowrap;text-decoration:none;
  transition:color .15s,background .15s,border-color .15s;cursor:pointer;}
.etl-lp .etl-toc-bar .etl-toc-tab:hover{color:var(--ink);background:rgba(0,0,0,.05);border-color:var(--line);}
.etl-lp .etl-toc-bar .etl-toc-tab.on{color:var(--ink);background:rgba(0,0,0,.07);border-color:var(--line-strong);}
.etl-toc-editnote{padding:14px 0;font-size:13px;color:var(--sub);display:inline-flex;align-items:center;gap:8px;}
.etl-toc-editnote i{font-size:17px;color:var(--soft);}
.etl-toc-editnote b{color:var(--ink);font-weight:600;padding:1px 6px;border-radius:5px;background:#fff;border:1px dashed var(--line-strong);}
.etl-lp h2{scroll-margin-top:145px;}
@media(max-width:820px){.etl-toc-tabs{justify-content:flex-start;gap:6px;}}

/* ================= Page SEO block (builder-only settings card) ================= */
.etl-seo{border:1px solid var(--line);border-radius:16px;padding:22px;background:var(--weak);display:flex;flex-direction:column;gap:14px;}
.etl-seo-head{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:700;color:var(--ink);letter-spacing:-.01em;}
.etl-seo-head i{font-size:18px;color:var(--soft);}
.etl-seo-head span{font-weight:400;font-size:12px;color:var(--soft);letter-spacing:0;}
.etl-seo-fld{display:flex;flex-direction:column;gap:6px;}
.etl-seo-fld > span{font-size:12px;font-weight:600;color:var(--sub);}
.etl-seo-in{border:1px solid var(--line);border-radius:9px;padding:10px 12px;font-size:14px;color:var(--ink);background:#fff;min-height:20px;}
/* Index-icon image upload slot (data-img="icon") */
.etl-seo-img{display:inline-flex;align-items:center;gap:10px;width:fit-content;min-width:64px;min-height:64px;padding:8px;
  border:1px dashed var(--line-strong);border-radius:10px;background:#fff;color:var(--soft);cursor:pointer;}
.etl-seo-img img{width:48px;height:48px;object-fit:contain;border-radius:8px;display:block;}
.etl-seo-img i{font-size:22px;}
.etl-seo-img-hint{font-size:12px;color:var(--soft);}
.etl-seo-in:focus{outline:2px solid var(--purple);border-color:var(--purple);}
.etl-seo-area{min-height:52px;line-height:1.5;}
.etl-seo-in:empty::before{content:attr(data-placeholder);color:var(--soft);}

/* Index header row + staff migrate button */
.etl-eng-head-row{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;}
.eng-index-lp .etl-eng-migrate{flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;margin-top:6px;
  background:var(--ink);color:#fff;font-size:14px;font-weight:600;padding:10px 16px;border-radius:999px;text-decoration:none;transition:.15s;}
.eng-index-lp .etl-eng-migrate:hover{background:#2f2f2f;}
.eng-index-lp .etl-eng-migrate i{font-size:17px;}

/* ==================== Blog index — Website Refresh (Figma 20-461) ==================== */
.blogx-cat{font-family:'Inter',sans-serif;font-size:12px;line-height:16px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--purple);}
.blogx-author{display:flex;align-items:center;gap:8px;}
.blogx-ava{width:24px;height:24px;border-radius:50%;object-fit:cover;flex:0 0 auto;display:inline-block;}
.blogx-ava-ph{display:inline-grid;place-items:center;background:#e7ddcf;color:#8a7a5c;font-size:11px;font-weight:600;}
.blogx-author-name{font-size:14px;line-height:20px;font-weight:500;letter-spacing:-.01em;color:var(--ink);}
.blogx-draft{position:absolute;top:12px;left:12px;background:#f6b51e;color:#171717;font-size:11px;font-weight:700;padding:3px 9px;border-radius:999px;}
.blogx-thumb-ph{display:grid;place-items:center;width:100%;height:100%;color:var(--soft);font-size:40px;}

/* Hero — featured card + 3 secondary teasers */
.blogx-hero{background:var(--weak);padding:120px 0 60px;}
.blogx-lp a.blogx-feat{display:grid;grid-template-columns:640px minmax(0,1fr);gap:0;background:#fff;border-radius:24px;padding:12px;box-shadow:0 1px 2px rgba(10,13,20,.03);transition:box-shadow .18s;}
.blogx-lp a.blogx-feat:hover{box-shadow:0 18px 44px -22px rgba(0,0,0,.28);}
.blogx-feat-img{position:relative;aspect-ratio:16/9;border-radius:20px;overflow:hidden;background:#171717;}
.blogx-feat-img img{width:100%;height:100%;object-fit:cover;display:block;}
.blogx-feat-body{display:flex;flex-direction:column;padding:24px;}
.blogx-lp .blogx-feat-body h2{margin:12px 0 0;font-family:'Inter Display','Inter',sans-serif;font-size:32px;line-height:40px;font-weight:700;letter-spacing:-.015em;color:var(--ink);}
.blogx-feat-body .blogx-author{margin-top:auto;padding-top:24px;}

.blogx-secondary{display:grid;grid-template-columns:repeat(3,1fr);margin-top:24px;border-top:1px solid var(--line);}
.blogx-lp a.blogx-sec{display:flex;flex-direction:column;gap:12px;padding:32px 24px;border-left:1px solid var(--line);transition:background .15s;}
.blogx-lp a.blogx-sec:first-child{border-left:0;padding-left:0;}
.blogx-lp a.blogx-sec:hover{background:#fff;}
.blogx-lp .blogx-sec h3{margin:0;font-family:'Inter',sans-serif;font-size:22px;line-height:28px;font-weight:500;letter-spacing:-.02em;color:var(--ink);}
.blogx-sec .blogx-author{margin-top:auto;padding-top:12px;}

/* Latest Posts */
.blogx-latest{background:#fff;padding:72px 0 88px;}
.blogx-latest-head{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:40px;}
.blogx-lp .blogx-latest-head h2{margin:0;font-family:'Inter Display','Inter',sans-serif;font-size:28px;line-height:36px;font-weight:700;letter-spacing:-.01em;color:var(--ink);}
.blogx-search{display:flex;align-items:center;gap:8px;width:300px;max-width:100%;background:#fff;border:1px solid var(--line);border-radius:999px;padding:10px 18px;transition:.15s;}
.blogx-search:focus-within{border-color:var(--line-strong);box-shadow:0 1px 2px rgba(10,13,20,.05);}
.blogx-search i{font-size:18px;color:var(--soft);}
.blogx-search input{flex:1;min-width:0;border:0;outline:0;background:transparent;font-family:'Inter',sans-serif;font-size:15px;color:var(--ink);}
.blogx-search input::placeholder{color:var(--soft);}

.blogx-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;}
.blogx-lp a.blogx-card{display:flex;flex-direction:column;gap:12px;text-decoration:none;}
.blogx-card-thumb{position:relative;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:#171717;}
.blogx-card-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s;}
.blogx-lp a.blogx-card:hover .blogx-card-thumb img{transform:scale(1.03);}
.blogx-card-body{display:flex;flex-direction:column;gap:12px;padding-top:4px;}
.blogx-lp .blogx-card h3{margin:0;font-family:'Inter',sans-serif;font-size:20px;line-height:28px;font-weight:500;letter-spacing:-.02em;color:var(--ink);}
.blogx-date{font-size:14px;line-height:20px;color:var(--sub);}
.blogx-card .blogx-author{margin-top:4px;}
.blogx-card .blogx-author-name{color:var(--sub);font-weight:400;}
.blogx-noresults{display:none;padding:48px 0;text-align:center;color:var(--soft);font-size:15px;}

/* Newsletter card (dark) */
.blogx-news{position:relative;overflow:hidden;display:flex;flex-direction:column;background:#171717;border-radius:20px;padding:24px;}
.blogx-news-deco{position:absolute;top:0;right:0;width:60%;height:55%;pointer-events:none;
  background:
    linear-gradient(115deg,transparent 48%,rgba(255,255,255,.22) 49%,transparent 50%) 0 0/120px 120px no-repeat,
    linear-gradient(115deg,transparent 48%,rgba(255,255,255,.14) 49%,transparent 50%) 40px 24px/90px 90px no-repeat,
    radial-gradient(1.5px 1.5px at 82% 30%,rgba(255,255,255,.5),transparent),
    radial-gradient(1.5px 1.5px at 60% 55%,rgba(255,255,255,.35),transparent),
    radial-gradient(1.5px 1.5px at 92% 62%,rgba(255,255,255,.3),transparent);}
.blogx-news-eyebrow{position:relative;font-size:12px;line-height:16px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--soft);}
.blogx-lp .blogx-news-title{position:relative;margin:8px 0 0;font-family:'Inter Display','Inter',sans-serif;font-size:28px;line-height:36px;font-weight:700;letter-spacing:-.01em;color:#fff;}
.blogx-news-sub{position:relative;margin:12px 0 0;font-size:16px;line-height:24px;color:var(--soft);}
.blogx-news-form{position:relative;margin-top:auto;padding-top:24px;display:flex;flex-direction:column;gap:12px;}
.blogx-news-input{display:flex;align-items:center;gap:10px;background:#262626;border:1px solid #3a3a3a;border-radius:999px;padding:13px 18px;}
.blogx-news-input .input-icon{font-size:18px;color:var(--soft);}
.blogx-news-input input{flex:1;min-width:0;border:0;outline:0;background:transparent;font-family:'Inter',sans-serif;font-size:15px;color:#fff;}
.blogx-news-input input::placeholder{color:var(--soft);}
.blogx-news-input .input-group-append{display:none;}
.blogx-news-btn{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;width:100%;background:#f5f5f5;color:#171717;border:0;border-radius:999px;padding:14px;font-family:'Inter',sans-serif;font-size:15px;font-weight:500;letter-spacing:-.01em;cursor:pointer;transition:.15s;}
.blogx-news-btn:hover{background:#fff;}
.blogx-news-btn .btn-loading-indicator{display:none;width:20px;height:20px;}

@media(max-width:1000px){
  .blogx-lp a.blogx-feat{grid-template-columns:1fr;}
  .blogx-grid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:760px){
  .blogx-hero{padding:48px 0 40px;}
  .blogx-secondary{grid-template-columns:1fr;}
  .blogx-lp a.blogx-sec,.blogx-lp a.blogx-sec:first-child{border-left:0;padding:24px 0;border-top:1px solid var(--line);}
  .blogx-lp a.blogx-sec:first-child{border-top:0;}
  .blogx-latest{padding:48px 0 64px;}
  .blogx-latest-head{flex-direction:column;align-items:flex-start;gap:16px;}
  .blogx-search{width:100%;}
  .blogx-grid{grid-template-columns:1fr;}
  .blogx-lp .blogx-feat-body h2{font-size:26px;line-height:32px;}
}

/* ================= TOC right-sidebar mode (ETL pages) ================= */
.etl-lp.toc-right .wrap{max-width:1218px;}
.etl-body-cols{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:56px;align-items:start;padding-bottom:16px;}
.etl-body-main{min-width:0;}
.etl-body-main .etl-sec{padding:28px 0;}
.etl-body-main .etl-sec:first-child{padding-top:8px;}
.etl-body-main .wrap{max-width:none;margin:0;padding:0;}
.etl-body-main .col{max-width:none;margin:0;}
.etl-toc-aside{min-width:0;}
.etl-side-sticky{position:sticky;top:100px;display:flex;flex-direction:column;gap:20px;}
.etl-side-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px;box-shadow:0 1px 2px rgba(10,13,20,.03);display:flex;flex-direction:column;gap:16px;}
.etl-side-rule{height:1px;background:var(--line);}
.etl-lp .etl-toc-side-h{font-family:'Inter Display','Inter',sans-serif;font-size:20px;line-height:28px;font-weight:500;letter-spacing:-.01em;color:var(--ink);margin-bottom:16px;}
/* Share */
.etl-side-share-h{font-size:16px;line-height:20px;font-weight:500;color:var(--ink);letter-spacing:-.006em;margin-bottom:12px;}
.etl-side-share-row{display:flex;justify-content:space-between;gap:8px;}
.etl-lp .etl-share-btn{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--ink);cursor:pointer;transition:.15s;text-decoration:none;}
.etl-lp .etl-share-btn:hover{background:var(--weak);border-color:var(--line-strong);}
.etl-share-btn i{font-size:18px;}
.etl-share-btn .ti-check{display:none;}
.etl-share-btn.is-copied .ti-link{display:none;}
.etl-share-btn.is-copied .ti-check{display:block;color:var(--green);}
/* Promo card */
.etl-side-promo{background:var(--faded);border:1px solid var(--line);border-radius:16px;padding:16px;box-shadow:0 1px 2px rgba(10,13,20,.03);display:flex;flex-direction:column;gap:24px;}
.etl-lp .etl-side-promo-title{font-family:'Inter Display','Inter',sans-serif;font-size:20px;line-height:28px;font-weight:500;letter-spacing:-.01em;color:var(--ink);}
.etl-side-promo-note{display:inline-flex;align-items:center;gap:4px;margin-top:8px;font-size:12px;line-height:16px;color:var(--sub);}
.etl-side-promo-note i{font-size:14px;color:var(--ink);}
.etl-lp .etl-side-promo-btn{align-self:flex-start;background:#262626;color:#fff;font-size:12px;font-weight:500;padding:10px 16px;border-radius:999px;text-decoration:none;transition:.15s;}
.etl-lp .etl-side-promo-btn:hover{background:#000;}
.etl-toc-side ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;}
.etl-lp .etl-toc-side a{display:block;font-size:15px;line-height:1.35;color:var(--sub);border-left:2px solid transparent;padding:0 0 0 12px;transition:.15s;}
.etl-lp .etl-toc-side a:hover{color:var(--ink);}
.etl-lp .etl-toc-side a.on{color:var(--ink);font-weight:600;border-left-color:var(--ink);}
@media(max-width:900px){.etl-body-cols{grid-template-columns:1fr;gap:0;}.etl-toc-aside{display:none;}}

/* ==================== Blog/ETL footer (Figma 1134-7163) ==================== */
.blogx-foot{background:#fff;font-family:'Inter',sans-serif;padding:40px 0 40px;}
.blogx-foot-in{max-width:1170px;margin:0 auto;padding:0 24px;}
/* Dark CTA card */
.blogx-foot-cta{background:#171717;border-radius:28px;padding:88px 24px;text-align:center;}
.blogx-foot-cta h2{margin:0;font-family:'Inter Display','Inter',sans-serif;font-size:40px;line-height:48px;font-weight:700;letter-spacing:-.025em;color:#fff;max-width:900px;margin-left:auto;margin-right:auto;}
.blogx-foot-cta p{margin:16px 0 0;font-size:18px;line-height:24px;color:#a3a3a3;}
.blogx-foot-cta-btns{margin-top:32px;display:flex;gap:16px;justify-content:center;flex-wrap:wrap;}
.blogx-foot-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:56px;padding:0 26px;border-radius:999px;font-size:16px;font-weight:500;line-height:1;text-decoration:none;transition:background .15s,border-color .15s,color .15s;}
.blogx-foot-btn i{font-size:18px;}
.blogx-foot-btn--primary{background:#fff;color:#171717;}
.blogx-foot-btn--primary:hover{background:#ececec;color:#171717;}
.blogx-foot-btn--ghost{background:transparent;color:#fff;border:1px solid #3a3a3a;}
.blogx-foot-btn--ghost:hover{background:#262626;color:#fff;}
/* Link grid */
.blogx-foot-links{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;padding:80px 0 0;}
.blogx-foot-h{font-size:16px;line-height:24px;font-weight:600;letter-spacing:-.01em;color:#171717;}
.blogx-foot-col ul{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-direction:column;gap:14px;}
.blogx-foot-col a{display:inline-flex;align-items:center;gap:8px;font-size:16px;line-height:24px;color:#5c5c5c;text-decoration:none;transition:color .15s;width:fit-content;}
.blogx-foot-col a:hover{color:#171717;}
.blogx-foot-badge{font-size:11px;font-weight:600;letter-spacing:.02em;background:#f5f5f5;color:#5c5c5c;border-radius:6px;padding:2px 6px;line-height:1.2;}
/* Bottom bar */
.blogx-foot-bottom{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding-top:64px;}
.blogx-foot-copy{display:flex;align-items:center;gap:16px;}
.blogx-foot-copy img{height:28px;width:auto;display:block;}
.blogx-foot-copy span{font-size:12px;line-height:16px;letter-spacing:.04em;color:#a3a3a3;text-transform:uppercase;}
.blogx-foot-legal{display:flex;align-items:center;gap:24px;}
.blogx-foot-legal > a{font-size:14px;line-height:20px;color:#5c5c5c;text-decoration:none;transition:color .15s;}
.blogx-foot-legal > a:hover{color:#171717;}
.blogx-foot-social{display:inline-flex;align-items:center;gap:12px;}
.blogx-foot-social a{width:24px;height:24px;display:grid;place-items:center;color:#171717;transition:color .15s;}
.blogx-foot-social a:hover{color:#5c5c5c;}
.blogx-foot-social i{font-size:20px;}
@media(max-width:900px){
  .blogx-foot-links{grid-template-columns:repeat(2,1fr);gap:40px 32px;}
  .blogx-foot-cta{padding:56px 20px;}
  .blogx-foot-cta h2{font-size:28px;line-height:34px;}
}
@media(max-width:560px){
  .blogx-foot-links{grid-template-columns:1fr;}
  .blogx-foot-bottom{flex-direction:column;align-items:flex-start;gap:20px;}
}
