/* =========================================================
   /resources/automation-scraping/ — Automation (Compliance-first)
   Scoped to .auto-main so other pages stay unchanged
   ========================================================= */
.auto-main{
  --text:#e9ecff; --muted:#a9b0d6; --heading:#ffffff;
  --accent:#7b6cff; --accent-2:#9a8cff; --accent-3:#594fe0;
  --panel-top:#1b2140; --panel-bot:#10152c;
  --panel-ring:rgba(255,255,255,.07); --panel-glow:rgba(121,108,255,.20);
  --radius-lg:28px; --radius-md:16px;
  --shadow-1:0 14px 40px rgba(0,0,0,.35); --shadow-2:0 10px 26px rgba(0,0,0,.28);
  color:var(--text);
}
.auto-main .wrap{max-width:1100px;margin-inline:auto;padding-inline:20px}

/* Center labels and headings (per your global request) */
.auto-main .section-label,
.auto-main .section-lead,
.auto-main h1,.auto-main h2,.auto-main h3{ text-align:center; }

/* Typography */
.auto-main h1{color:var(--heading);font-weight:800;line-height:1.12;
  font-size:clamp(2.2rem,2.6rem + 1vw,3rem);margin:0 0 10px}
.auto-main h2{color:var(--heading);font-weight:800;
  font-size:clamp(1.5rem,1.1rem + 1vw,2rem);margin:0 0 12px}
.auto-main h3{color:var(--heading);font-weight:700;
  font-size:clamp(1.05rem,.95rem + .6vw,1.25rem);margin:0 0 8px}
.auto-main p{color:var(--text)}
.auto-main .muted{color:var(--muted)}
.auto-main a{color:var(--accent-2);text-decoration:none}
.auto-main a:hover{color:#d7d1ff}
.auto-main .section-lead{margin:2px 0 10px}

/* Buttons */
.auto-main .btn{display:inline-flex;align-items:center;justify-content:center;
  gap:.5rem;font-weight:700;border-radius:14px;padding:12px 18px;
  border:1px solid transparent;transition:transform .2s,box-shadow .2s,background .2s,border-color .2s;
  box-shadow:var(--shadow-2);cursor:pointer}
.auto-main .btn-primary{color:#fff;background:linear-gradient(180deg,var(--accent-2),var(--accent-3));
  border-color:rgba(255,255,255,.08)}
.auto-main .btn-primary:hover{transform:translateY(-1px)}
.auto-main .btn-ghost{color:#fff;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12)}
.auto-main .btn-ghost:hover{background:rgba(255,255,255,.11)}
.auto-main .cta-row{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:12px}

/* Hero */
.auto-main .auto-hero{padding:clamp(28px,4vw,40px) 0 clamp(22px,4vw,36px)}
.auto-main .auto-hero .hero-card{
  background:
    radial-gradient(80% 110% at 86% 12%, rgba(121,108,255,.20) 0%, rgba(121,108,255,0) 45%),
    linear-gradient(180deg,#1c2144 0%, #131731 100%);
  border:1px solid var(--panel-ring);border-radius:30px;
  padding:clamp(26px,4vw,44px);box-shadow:var(--shadow-1)
}
.auto-main .section-label{font-weight:800;letter-spacing:.06em;color:#d7d1ff;opacity:.9;margin:0 0 6px}

/* Panels */
.auto-main section.panel{padding-block:clamp(18px,3vw,28px)}
.auto-main section.panel .wrap{
  background:
    radial-gradient(80% 120% at 85% 0%, var(--panel-glow) 0%, rgba(89,79,224,0) 45%),
    linear-gradient(180deg,var(--panel-top) 0%, var(--panel-bot) 100%);
  border:1px solid var(--panel-ring);border-radius:var(--radius-lg);
  padding:clamp(20px,3.5vw,36px);box-shadow:var(--shadow-1)
}

/* Cards + grid */
.auto-main .grid{display:grid;gap:16px}
.auto-main .grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:860px){.auto-main .grid.two{grid-template-columns:1fr}}
.auto-main .card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.10);
  border-radius:var(--radius-md);padding:16px 16px 18px}

/* Compliance note */
.auto-main .compliance-note{
  margin:14px 0 0;color:#d8dbff;opacity:.9;text-align:center;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.10);
  padding:10px 12px;border-radius:12px
}


/* =========================================================
   /resources/automation-scraping/anti-bot-considerations/
   Page-specific styles (scoped to this page only)
   ========================================================= */
.anti-bot-page{
  --text:#e9ecff; --muted:#a9b0d6; --heading:#ffffff;
  --accent:#7b6cff; --accent-2:#9a8cff; --accent-3:#594fe0;
  --ring:rgba(255,255,255,.10); --glow:rgba(121,108,255,.22);
  --panel-top:#1b2140; --panel-bot:#10152c;
  --shadow-1:0 14px 40px rgba(0,0,0,.35); --shadow-2:0 10px 26px rgba(0,0,0,.28);
  --radius:28px;
  color:var(--text);
}
.anti-bot-page .wrap{max-width:1100px;margin-inline:auto;padding-inline:20px}

/* Center label & headings on this page only (do not affect others) */
.anti-bot-page .section-label,
.anti-bot-page h1,
.anti-bot-page h2,
.anti-bot-page .lead{ text-align:center; }

/* Links: no underline, themed color */
.anti-bot-page a{ text-decoration:none; color:var(--accent-2) }
.anti-bot-page a:hover{ color:#d7d1ff }

/* Hero */
.anti-bot-page .hero{ padding:clamp(28px,4vw,40px) 0 }
.anti-bot-page .hero-card{
  background:
    radial-gradient(80% 110% at 86% 12%, rgba(121,108,255,.20) 0%, rgba(121,108,255,0) 45%),
    linear-gradient(180deg,#1c2144 0%, #131731 100%);
  border:1px solid var(--ring); border-radius:30px;
  padding:clamp(26px,4vw,44px); box-shadow:var(--shadow-1)
}
.anti-bot-page .section-label{font-weight:800;letter-spacing:.06em;color:#d7d1ff;margin:0 0 6px}
.anti-bot-page h1{color:var(--heading);font-weight:800;line-height:1.12;
  font-size:clamp(2.05rem,2.3rem + 1vw,3rem);margin:0 0 8px}
.anti-bot-page .lead{max-width:860px;margin:0 auto;color:var(--text)}

/* Panels */
.anti-bot-page .panel{ padding-block:clamp(18px,3vw,28px) }
.anti-bot-page .panel .wrap{
  background:
    radial-gradient(80% 120% at 85% 0%, var(--glow) 0%, rgba(89,79,224,0) 45%),
    linear-gradient(180deg,var(--panel-top) 0%, var(--panel-bot) 100%);
  border:1px solid var(--ring); border-radius:var(--radius);
  padding:clamp(20px,3.5vw,36px); box-shadow:var(--shadow-1)
}
.anti-bot-page h2{color:#fff;margin:0 0 8px}

/* Lists */
.anti-bot-page .bullets{list-style:none;padding:0;margin:12px auto 0;max-width:900px}
.anti-bot-page .bullets li{
  position:relative; padding:14px 16px 14px 56px; margin:8px 0;
  background:#0d1124; border:1px solid rgba(255,255,255,.12);
  border-radius:14px; color:#e8eaff; box-shadow:var(--shadow-2)
}
.anti-bot-page .bullets li::before{
  content:""; position:absolute; left:16px; top:50%; transform:translateY(-50%);
  width:10px; height:10px; border-radius:50%; background:#bfc6ff; box-shadow:0 0 0 8px rgba(191,198,255,.12)
}

/* CTAs */
.anti-bot-page .quick-cta{
  display:flex; gap:10px; flex-wrap:wrap; justify-content:center; margin-top:16px
}
.anti-bot-page .btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  font-weight:700; border-radius:14px; padding:12px 18px; border:1px solid transparent;
  transition:transform .2s,box-shadow .2s,background .2s,border-color .2s;
  box-shadow:var(--shadow-2); cursor:pointer; color:#fff; text-decoration:none
}
.anti-bot-page .btn-primary{
  background:linear-gradient(180deg,var(--accent-2),var(--accent-3));
  border-color:rgba(255,255,255,.08)
}
.anti-bot-page .btn-primary:hover{ transform:translateY(-1px) }
.anti-bot-page .btn-ghost{ background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.12) }
.anti-bot-page .btn-ghost:hover{ background:rgba(255,255,255,.11) }



/* =========================================================
   /resources/automation-scraping/tos-compliance/
   Page-specific styles (scoped)
   ========================================================= */
.tos-compliance-page{
  --text:#e9ecff; --muted:#a9b0d6; --heading:#ffffff;
  --accent:#7b6cff; --accent-2:#9a8cff; --accent-3:#594fe0;
  --ring:rgba(255,255,255,.10); --glow:rgba(121,108,255,.22);
  --panel-top:#1b2140; --panel-bot:#10152c;
  --shadow-1:0 14px 40px rgba(0,0,0,.35); --shadow-2:0 10px 26px rgba(0,0,0,.28);
  --radius:28px;
  color:var(--text);
}
.tos-compliance-page .wrap{max-width:1100px;margin-inline:auto;padding-inline:20px}

/* Center label & headings on this page only */
.tos-compliance-page .section-label,
.tos-compliance-page h1,
.tos-compliance-page h2,
.tos-compliance-page .lead{ text-align:center; }

/* Links: remove underline, themed color */
.tos-compliance-page a{ text-decoration:none; color:var(--accent-2) }
.tos-compliance-page a:hover{ color:#d7d1ff }

/* Hero */
.tos-compliance-page .hero{ padding:clamp(28px,4vw,40px) 0 }
.tos-compliance-page .hero-card{
  background:
    radial-gradient(80% 110% at 86% 12%, rgba(121,108,255,.20) 0%, rgba(121,108,255,0) 45%),
    linear-gradient(180deg,#1c2144 0%, #131731 100%);
  border:1px solid var(--ring); border-radius:30px;
  padding:clamp(26px,4vw,44px); box-shadow:var(--shadow-1)
}
.tos-compliance-page .section-label{font-weight:800;letter-spacing:.06em;color:#d7d1ff;margin:0 0 6px}
.tos-compliance-page h1{color:var(--heading);font-weight:800;line-height:1.12;
  font-size:clamp(2.05rem,2.3rem + 1vw,3rem);margin:0 0 8px}
.tos-compliance-page .lead{max-width:860px;margin:0 auto;color:var(--text)}

/* Panels */
.tos-compliance-page .panel{ padding-block:clamp(18px,3vw,28px) }
.tos-compliance-page .panel .wrap{
  background:
    radial-gradient(80% 120% at 85% 0%, var(--glow) 0%, rgba(89,79,224,0) 45%),
    linear-gradient(180deg,var(--panel-top) 0%, var(--panel-bot) 100%);
  border:1px solid var(--ring); border-radius:var(--radius);
  padding:clamp(20px,3.5vw,36px); box-shadow:var(--shadow-1)
}
.tos-compliance-page h2{color:#fff;margin:0 0 8px}

/* Lists */
.tos-compliance-page .bullets{list-style:none;padding:0;margin:12px auto 0;max-width:900px}
.tos-compliance-page .bullets li{
  position:relative; padding:14px 16px 14px 56px; margin:8px 0;
  background:#0d1124; border:1px solid rgba(255,255,255,.12);
  border-radius:14px; color:#e8eaff; box-shadow:var(--shadow-2)
}
.tos-compliance-page .bullets li::before{
  content:""; position:absolute; left:16px; top:50%; transform:translateY(-50%);
  width:10px; height:10px; border-radius:50%; background:#bfc6ff; box-shadow:0 0 0 8px rgba(191,198,255,.12)
}

/* CTAs */
.tos-compliance-page .quick-cta{
  display:flex; gap:10px; flex-wrap:wrap; justify-content:center; margin-top:16px
}
.tos-compliance-page .btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  font-weight:700; border-radius:14px; padding:12px 18px; border:1px solid transparent;
  transition:transform .2s,box-shadow .2s,background .2s,border-color .2s;
  box-shadow:var(--shadow-2); cursor:pointer; color:#fff; text-decoration:none
}
.tos-compliance-page .btn-primary{
  background:linear-gradient(180deg,var(--accent-2),var(--accent-3));
  border-color:rgba(255,255,255,.08)
}
.tos-compliance-page .btn-primary:hover{ transform:translateY(-1px) }
.tos-compliance-page .btn-ghost{ background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.12) }
.tos-compliance-page .btn-ghost:hover{ background:rgba(255,255,255,.11) }


/* =========================================================
   /resources/automation-scraping/headless-vs-mv3-constraints/
   Page-specific styles (scoped)
   ========================================================= */
.headless-mv3-page{
  --text:#e9ecff; --muted:#a9b0d6; --heading:#ffffff;
  --accent:#7b6cff; --accent-2:#9a8cff; --accent-3:#594fe0;
  --ring:rgba(255,255,255,.10); --glow:rgba(121,108,255,.22);
  --panel-top:#1b2140; --panel-bot:#10152c;
  --shadow-1:0 14px 40px rgba(0,0,0,.35); --shadow-2:0 10px 26px rgba(0,0,0,.28);
  --radius:28px;
  color:var(--text);
}
.headless-mv3-page .wrap{max-width:1100px;margin-inline:auto;padding-inline:20px}

/* Center the label, headings, and subhead on this page only */
.headless-mv3-page .section-label,
.headless-mv3-page h1,
.headless-mv3-page h2,
.headless-mv3-page .lead{ text-align:center; }

/* Links: remove underline; themed color */
.headless-mv3-page a{ text-decoration:none; color:var(--accent-2) }
.headless-mv3-page a:hover{ color:#d7d1ff }

/* Hero */
.headless-mv3-page .hero{ padding:clamp(28px,4vw,40px) 0 }
.headless-mv3-page .hero-card{
  background:
    radial-gradient(80% 110% at 86% 12%, rgba(121,108,255,.20) 0%, rgba(121,108,255,0) 45%),
    linear-gradient(180deg,#1c2144 0%, #131731 100%);
  border:1px solid var(--ring); border-radius:30px;
  padding:clamp(26px,4vw,44px); box-shadow:var(--shadow-1)
}
.headless-mv3-page .section-label{font-weight:800;letter-spacing:.06em;color:#d7d1ff;margin:0 0 6px}
.headless-mv3-page h1{color:var(--heading);font-weight:800;line-height:1.12;
  font-size:clamp(2.05rem,2.3rem + 1vw,3rem);margin:0 0 8px}
.headless-mv3-page .lead{max-width:860px;margin:0 auto;color:var(--text)}

/* Panels */
.headless-mv3-page .panel{ padding-block:clamp(18px,3vw,28px) }
.headless-mv3-page .panel .wrap{
  background:
    radial-gradient(80% 120% at 85% 0%, var(--glow) 0%, rgba(89,79,224,0) 45%),
    linear-gradient(180deg,var(--panel-top) 0%, var(--panel-bot) 100%);
  border:1px solid var(--ring); border-radius:var(--radius);
  padding:clamp(20px,3.5vw,36px); box-shadow:var(--shadow-1)
}
.headless-mv3-page h2{color:#fff;margin:0 0 8px}

/* Lists */
.headless-mv3-page .bullets{list-style:none;padding:0;margin:12px auto 0;max-width:900px}
.headless-mv3-page .bullets li{
  position:relative; padding:14px 16px 14px 56px; margin:8px 0;
  background:#0d1124; border:1px solid rgba(255,255,255,.12);
  border-radius:14px; color:#e8eaff; box-shadow:var(--shadow-2)
}
.headless-mv3-page .bullets li::before{
  content:""; position:absolute; left:16px; top:50%; transform:translateY(-50%);
  width:10px; height:10px; border-radius:50%; background:#bfc6ff; box-shadow:0 0 0 8px rgba(191,198,255,.12)
}

/* CTAs */
.headless-mv3-page .quick-cta{
  display:flex; gap:10px; flex-wrap:wrap; justify-content:center; margin-top:16px
}
.headless-mv3-page .btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  font-weight:700; border-radius:14px; padding:12px 18px; border:1px solid transparent;
  transition:transform .2s,box-shadow .2s,background .2s,border-color .2s;
  box-shadow:var(--shadow-2); cursor:pointer; color:#fff; text-decoration:none
}
.headless-mv3-page .btn-primary{
  background:linear-gradient(180deg,var(--accent-2),var(--accent-3));
  border-color:rgba(255,255,255,.08)
}
.headless-mv3-page .btn-primary:hover{ transform:translateY(-1px) }
.headless-mv3-page .btn-ghost{ background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.12) }
.headless-mv3-page .btn-ghost:hover{ background:rgba(255,255,255,.11) }