/* ============================================================
   ClickSambo — Lead Generation page
   (/lead-generation, /tr/lead-generation, /pt-br/geracao-de-leads)
   Scoped to <main class="lgPage">: header, footer and other pages are untouched.
   Every rule is prefixed with .lgPage and every class carries the lg prefix, so the site-wide
   classes in layout.css (.btn, .hero, .card, section .inner, ...) cannot collide and the relative
   specificity of element vs. class rules matches the approved designs. The three language
   designs share the same markup and styles. The lg* row classes are created by the lead-stream
   script in Index.cshtml.
   ============================================================ */
.lgPage{--font-brand:"Nunito",-apple-system,"Segoe UI",Roboto,sans-serif; --font-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace; --navy:#1C2841; --ink:#0F1420; --orange:#F94C10; --orange-bright:#FF3800; --orange-d:#D93D08; --orange-soft:rgba(249,76,16,.1); --green:#22B573; --green-d:#17835A; --green-soft:#E9F7F0; --cream:#FFF1E9; --cream-2:#FDF6F1; --white:#fff; --line:#ECECF3; --line-2:#F0E2D8; --muted:#51607A; --muted-2:#7C8AA3; --wrap:1120px; --r:20px; --r-sm:12px; --shadow:0 12px 40px rgba(28,40,65,.06); --shadow-lg:0 18px 50px rgba(28,40,65,.09)}
.lgPage *{box-sizing:border-box}
.lgPage{margin:0; background:var(--cream); color:var(--navy); font-family:var(--font-brand); font-size:16px; line-height:1.7; -webkit-font-smoothing:antialiased}
/* layout.css sets `*{font-family:Mulish}`, `b,strong{font-weight:700}`, `ol,ul{list-style:none}` and
   zeroes the margins of dl/ul; restore the browser defaults the design relies on. */
.lgPage *{font-family:inherit}
.lgPage b,.lgPage strong{font-weight:bolder}
.lgPage dl,.lgPage ul{margin:1em 0}
.lgPage ul{list-style:disc; padding-left:40px}
.lgPage .lgWrap{max-width:var(--wrap); margin:0 auto; padding:0 24px}
.lgPage h1,.lgPage h2,.lgPage h3{margin:0; font-weight:800; letter-spacing:-.015em; color:var(--navy)}
.lgPage h1{font-size:clamp(32px,4.2vw,48px); line-height:1.15}
.lgPage h2{font-size:clamp(26px,3vw,36px); line-height:1.2}
.lgPage h3{font-size:clamp(19px,1.6vw,21px); line-height:1.25; font-weight:800}
.lgPage p{margin:0 0 1rem}
.lgPage a{color:inherit}
.lgPage .lgBtn{display:inline-flex; align-items:center; gap:9px; background:var(--orange); color:#fff; text-decoration:none; font-weight:700; padding:14px 26px; border-radius:10px; font-size:1rem; transition:background .15s ease, transform .15s ease, box-shadow .2s ease;}
.lgPage .lgBtn:hover{background:var(--orange-d); transform:translateY(-1px)}
.lgPage .lgBtn svg{width:17px;height:17px;flex:none}
.lgPage .lgBtn.lgGhost{background:transparent; border:1.6px solid var(--navy); color:var(--navy)}
.lgPage .lgBtn.lgGhost:hover{background:var(--navy); color:#fff}
.lgPage .lgHero{position:relative; overflow:hidden; padding:74px 0 84px; background: radial-gradient(760px 420px at 85% 0%, rgba(249,76,16,.09), transparent 62%), radial-gradient(620px 380px at 0% 100%, rgba(34,181,115,.08), transparent 60%), var(--cream);}
.lgPage .lgHero .lgCols{display:grid; grid-template-columns:1.02fr .98fr; gap:52px; align-items:center}
.lgPage .lgTag{display:inline-flex; align-items:center; gap:9px; font-size:12px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--orange); background:var(--orange-soft); border-radius:999px; padding:6px 14px; margin-bottom:20px;}
.lgPage .lgTag svg{width:14px;height:14px}
.lgPage .lgHero p.lgLead{color:var(--muted); font-size:16px; line-height:1.7; margin-top:20px; max-width:52ch}
.lgPage .lgHero .lgActs{display:flex; gap:14px; margin-top:28px; flex-wrap:wrap}
.lgPage .lgFlow{display:flex; gap:10px; margin-top:30px; flex-wrap:wrap; font-size:.92rem; color:var(--muted); align-items:center}
.lgPage .lgFlow b{color:var(--navy); font-weight:800}
.lgPage .lgFlow i{color:#C3B2A7; font-style:normal}
.lgPage .lgTrust{display:flex; align-items:center; gap:10px; margin-top:22px; font-size:.88rem; color:var(--muted)}
.lgPage .lgTrust svg{width:18px;height:18px;color:var(--green-d);flex:none}
@media(max-width:940px){
  .lgPage .lgHero .lgCols{grid-template-columns:1fr; gap:40px}
}
.lgPage section{padding:84px 0}
.lgPage section[id]{scroll-margin-top:86px}
.lgPage section.lgAlt{background:var(--white)}
.lgPage .lgHead{max-width:66ch; margin-bottom:40px}
.lgPage .lgHead p{color:var(--muted); margin-top:12px; font-size:16px; line-height:1.7}
.lgPage .lgGrid3{display:grid; grid-template-columns:repeat(3,1fr); gap:20px}
.lgPage .lgGrid4{display:grid; grid-template-columns:repeat(4,1fr); gap:18px}
@media(max-width:900px){
  .lgPage .lgGrid3,.lgPage .lgGrid4{grid-template-columns:1fr}
}
.lgPage .lgCard{background:var(--white); border:1px solid var(--line); border-radius:var(--r); padding:30px; box-shadow:var(--shadow)}
.lgPage .lgAlt .lgCard{background:var(--cream-2); box-shadow:none; border-color:var(--line-2)}
.lgPage .lgCard h3{margin-bottom:8px}
.lgPage .lgCard p{color:var(--muted); font-size:16px; line-height:1.7; margin:0}
.lgPage .lgChip{width:58px; height:58px; border-radius:50%; display:grid; place-items:center; background:var(--cream); color:var(--orange-bright); margin-bottom:18px;}
.lgPage .lgAlt .lgChip{background:var(--cream)}
.lgPage .lgChip svg{width:27px;height:27px}
.lgPage .lgChip.lgN{background:#EDF0F6; color:var(--navy)}
.lgPage .lgChip.lgG{background:var(--green-soft); color:var(--green-d)}
.lgPage .lgNote{background:var(--cream); border:1px solid var(--line-2); border-radius:var(--r); padding:30px; display:flex; gap:22px; align-items:flex-start}
.lgPage .lgNote .lgChip{margin:0; flex:none; background:#fff}
.lgPage .lgNote h3{color:var(--orange-d); margin-bottom:8px}
.lgPage .lgNote p{color:var(--muted); margin:0}
@media(max-width:700px){
  .lgPage .lgNote{flex-direction:column}
}
.lgPage details{background:var(--white); border:1px solid var(--line); border-radius:var(--r-sm); padding:20px 24px; margin-bottom:12px; box-shadow:var(--shadow)}
.lgPage details[open]{border-color:var(--line-2)}
.lgPage summary{font-weight:800; cursor:pointer; list-style:none; font-size:17px}
.lgPage summary::-webkit-details-marker{display:none}
.lgPage summary::after{content:"+"; float:right; color:var(--orange); font-weight:800}
.lgPage details[open] summary::after{content:"–"}
.lgPage details p{margin:12px 0 0; color:var(--muted); font-size:16px; line-height:1.7}
.lgPage .lgCta{background:var(--navy); border-radius:var(--r); padding:44px; display:flex; justify-content:space-between; align-items:center; gap:26px; flex-wrap:wrap;}
.lgPage .lgCta h2{color:#fff; max-width:22ch}
.lgPage .lgCta p{color:#C3CEE1; margin:10px 0 0}
.lgPage :focus-visible{outline:2px solid var(--orange); outline-offset:3px}
@media(prefers-reduced-motion:reduce){
  .lgPage *{transition:none !important; animation:none !important}
}
.lgPage .lgCrumbs{background:var(--cream); border-top:1px solid var(--line-2)}
.lgPage .lgCrumbs .lgWrap{display:flex; justify-content:space-between; align-items:center; gap:14px; padding:13px 24px; flex-wrap:wrap}
.lgPage .lgCrumbs ol{display:flex; flex-wrap:wrap; gap:8px; list-style:none; margin:0; padding:0; font-size:.84rem; font-weight:700; color:var(--muted-2)}
.lgPage .lgCrumbs li+li::before{content:"\203A"; margin-right:8px; color:#C9B4A5}
.lgPage .lgCrumbs a{text-decoration:none; color:inherit; transition:color .15s ease}
.lgPage .lgCrumbs a:hover{color:var(--orange)}
.lgPage .lgCrumbs [aria-current]{color:var(--navy)}
.lgPage .lgCrumbs .lgUpdated{margin:0; font-size:.82rem; color:var(--muted-2); font-weight:600}
.lgPage .lgGapi{display:inline-flex; align-items:center; gap:6px; font-size:10.5px; font-weight:800; color:var(--muted); background:var(--cream); border:1px solid var(--line-2); border-radius:999px; padding:3px 10px; white-space:nowrap}
.lgPage .lgGapi svg{width:13px; height:13px; flex:none}
.lgPage .lgLstream{background:#fff; border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--shadow-lg); padding:18px 18px 16px; position:relative; overflow:hidden}
.lgPage .lgLstreamHead{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:14px}
.lgPage .lgLstreamHead .lgT{display:inline-flex; align-items:center; gap:8px; font-weight:800; font-size:.92rem}
.lgPage .lgLstreamHead .lgDot{width:8px; height:8px; border-radius:50%; background:var(--green); box-shadow:0 0 0 4px var(--green-soft); animation:lgLsdot 1.6s ease-in-out infinite}
@keyframes lgLsdot{0%,100%{opacity:1}50%{opacity:.3}}
.lgPage .lgLstreamHead .lgSrc{display:inline-flex; gap:6px}
.lgPage .lgLstreamRows{display:flex; flex-direction:column; height:270px; overflow:hidden}
.lgPage .lgLrow{display:flex; align-items:center; gap:10px; padding:9px 11px; border-radius:12px; background:var(--cream); border:1px solid var(--line-2); margin-bottom:8px; max-height:64px; overflow:hidden; animation:lgLrowIn .34s cubic-bezier(.2,.7,.3,1); transition:max-height .32s ease, opacity .32s ease, padding .32s ease, margin .32s ease, transform .32s ease}
@keyframes lgLrowIn{from{opacity:0; transform:translateY(-9px)} to{opacity:1; transform:none}}
.lgPage .lgLrow.lgOut{max-height:0; padding-top:0; padding-bottom:0; margin-bottom:0; opacity:0; transform:translateY(-4px)}
@keyframes lgLrowOut{to{opacity:0; transform:translateY(-6px)}}
.lgPage .lgLrow .lgLsrc{flex:none; width:26px; height:26px; border-radius:8px; background:#fff; border:1px solid var(--line); display:grid; place-items:center}
.lgPage .lgLrow .lgLsrc .lgLg{width:15px; height:15px}
.lgPage .lgLrow .lgLmeta{flex:1; min-width:0; display:flex; flex-direction:column; gap:1px}
.lgPage .lgLrow .lgWho{font-weight:800; font-size:.8rem; color:var(--navy); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.lgPage .lgLrow .lgWhy{font-size:.74rem; color:var(--muted-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.lgPage .lgLrow .lgLv{flex:none; display:flex; align-items:center}
.lgPage .lgLrow .lgLv .lgSpin{display:block; width:15px; height:15px; border-radius:50%; border:2px solid var(--line-2); border-top-color:var(--muted-2); animation:lgLspin .7s linear infinite}
@keyframes lgLspin{to{transform:rotate(360deg)}}
.lgPage .lgLrow .lgTag{display:inline-flex; align-items:center; gap:5px; font-weight:800; font-size:.72rem; padding:4px 8px; border-radius:999px; line-height:1; white-space:nowrap}
.lgPage .lgLrow .lgTag svg{width:12px; height:12px}
.lgPage .lgLrow.lgOk{background:var(--green-soft); border-color:#CDEBDD}
.lgPage .lgLrow.lgOk .lgTag{background:#fff; color:var(--green-d)}
.lgPage .lgLrow.lgOk .lgWhy{color:var(--green-d)}
.lgPage .lgLrow.lgNo{background:var(--orange-soft); border-color:#F7D8C8}
.lgPage .lgLrow.lgNo .lgTag{background:#fff; color:var(--orange-d)}
.lgPage .lgLrow.lgNo .lgWho{text-decoration:line-through; text-decoration-color:rgba(217,61,8,.45)}
.lgPage .lgLrow.lgNo .lgWhy{color:var(--orange-d)}
.lgPage .lgLstreamFoot{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:14px}
.lgPage .lgLstat{border-radius:12px; padding:10px 12px; display:flex; flex-direction:column; gap:3px}
.lgPage .lgLstat .lgK{font-size:.72rem; font-weight:800; letter-spacing:.01em; line-height:1.2}
.lgPage .lgLstat .lgV{font-size:1.6rem; font-weight:800; line-height:1; font-family:var(--font-mono)}
.lgPage .lgLstat.lgReal{background:var(--green-soft)}
.lgPage .lgLstat.lgReal .lgK{color:var(--green-d)}
.lgPage .lgLstat.lgReal .lgV{color:var(--green-d)}
.lgPage .lgLstat.lgFake{background:var(--orange-soft)}
.lgPage .lgLstat.lgFake .lgK{color:var(--orange-d)}
.lgPage .lgLstat.lgFake .lgV{color:var(--orange-d)}
.lgPage .lgLstreamNote{margin:12px 0 0; font-size:.72rem; color:var(--muted-2); text-align:center; font-family:var(--font-mono)}
.lgPage .lgPgrid{display:grid; grid-template-columns:1fr 1fr; gap:22px}
@media(max-width:820px){
  .lgPage .lgPgrid{grid-template-columns:1fr}
}
.lgPage .lgPcard{background:#fff; border:1px solid var(--line-2); border-radius:var(--r); box-shadow:var(--shadow); padding:26px 26px 24px; display:flex; flex-direction:column}
.lgPage .lgPcardHead{display:flex; align-items:center; gap:13px; margin-bottom:22px}
.lgPage .lgPcardHead .lgIco{width:46px; height:46px; border-radius:14px; background:var(--cream); display:grid; place-items:center; flex:none}
.lgPage .lgPcardHead .lgIco svg{width:24px; height:24px}
.lgPage .lgPcardHead h3{margin:0}
.lgPage .lgPtl{list-style:none; margin:0; padding:0; position:relative}
.lgPage .lgPtlStep{position:relative; padding:0 0 24px 46px}
.lgPage .lgPtlStep:last-child{padding-bottom:0}
.lgPage .lgPtlStep::before{content:""; position:absolute; left:16px; top:30px; bottom:2px; width:2px; background:var(--line-2)}
.lgPage .lgPtlStep:last-child::before{display:none}
.lgPage .lgPtlMarker{position:absolute; left:0; top:0; width:34px; height:34px; border-radius:50%; background:var(--navy); color:#fff; display:grid; place-items:center; z-index:1; box-shadow:0 0 0 4px #fff}
.lgPage .lgPtlMarker svg{width:17px; height:17px}
.lgPage .lgPtlStep .lgSt{display:block; font-weight:800; font-size:.72rem; letter-spacing:.07em; text-transform:uppercase; color:var(--muted-2); margin:5px 0 4px}
.lgPage .lgPtlStep p{margin:0; color:var(--muted); font-size:16px; line-height:1.7}
.lgPage .lgPtlStep.lgDone .lgPtlMarker{background:var(--green)}
.lgPage .lgPtlStep.lgDone::before{background:linear-gradient(var(--line-2), var(--green))}
.lgPage .lgPtlStep.lgDone .lgSt{color:var(--green-d)}
.lgPage .lgPextra{margin-top:22px; border:1.5px dashed #E7B9A4; border-radius:16px; padding:16px 17px; background:var(--orange-soft)}
.lgPage .lgPextraH{display:flex; align-items:center; gap:7px; font-weight:800; font-size:.7rem; letter-spacing:.07em; text-transform:uppercase; color:var(--orange-d); margin-bottom:13px}
.lgPage .lgPextraH svg{width:14px; height:14px}
.lgPage .lgPextraItem{display:flex; gap:12px; align-items:flex-start}
.lgPage .lgPextraItem + .lgPextraItem{margin-top:13px; padding-top:13px; border-top:1px solid rgba(217,61,8,.14)}
.lgPage .lgPextraItem .lgEi{width:32px; height:32px; border-radius:10px; background:#fff; border:1px solid rgba(217,61,8,.18); display:grid; place-items:center; flex:none; color:var(--orange-d)}
.lgPage .lgPextraItem .lgEi svg{width:17px; height:17px}
.lgPage .lgPextraItem h4{margin:0 0 2px; font-size:.98rem; font-weight:800; color:var(--navy)}
.lgPage .lgPextraItem p{margin:0; font-size:16px; line-height:1.65; color:var(--muted)}
.lgPage .lgPextraItem a{color:var(--orange-d); font-weight:800; text-decoration:none}
.lgPage .lgPextraItem a:hover{text-decoration:underline}
.lgPage .lgPchoose{display:grid; grid-template-columns:1fr 1fr; gap:18px}
@media(max-width:640px){
  .lgPage .lgPchoose{grid-template-columns:1fr}
}
.lgPage .lgPchooseCard{display:flex; flex-direction:column; gap:8px; padding:26px; border-radius:var(--r); text-decoration:none; border:1px solid var(--line-2); background:#fff; box-shadow:var(--shadow); transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease}
.lgPage .lgPchooseCard:hover{transform:translateY(-3px); box-shadow:var(--shadow-lg); border-color:var(--orange)}
.lgPage .lgPchooseCard .lgIco{width:48px; height:48px; border-radius:14px; display:grid; place-items:center; margin-bottom:6px}
.lgPage .lgPchooseCard .lgIco svg{width:24px; height:24px}
.lgPage .lgPchooseCard h3{margin:0}
.lgPage .lgPchooseCard p{margin:0; color:var(--muted); font-size:16px; line-height:1.7}
.lgPage .lgPchooseCard .lgGo{margin-top:6px; font-weight:800; font-size:.95rem; display:inline-flex; align-items:center; gap:6px}
.lgPage .lgPchooseCard.lgContact .lgIco{background:var(--navy); color:#fff}
.lgPage .lgPchooseCard.lgContact .lgGo{color:var(--navy)}
.lgPage .lgPchooseCard.lgPricing .lgIco{background:var(--orange-soft); color:var(--orange-d)}
.lgPage .lgPchooseCard.lgPricing .lgGo{color:var(--orange-d)}
.lgPage .lgPunified{margin-top:22px; display:flex; gap:16px; align-items:center; background:var(--navy); color:#fff; border-radius:var(--r); padding:20px 24px}
.lgPage .lgPunified .lgIco{width:46px; height:46px; border-radius:13px; background:rgba(255,255,255,.12); display:grid; place-items:center; flex:none}
.lgPage .lgPunified .lgIco svg{width:24px; height:24px}
.lgPage .lgPunified h3{margin:0 0 3px; color:#fff}
.lgPage .lgPunified p{margin:0; color:rgba(255,255,255,.82); font-size:16px; line-height:1.6}
@media(max-width:560px){
  .lgPage .lgPunified{flex-direction:column; text-align:center}
}
@media(max-width:820px){
  .lgPage section{padding:52px 0}
}
.lgPage .lgOc{display:grid; grid-template-columns:1fr auto 1fr; gap:18px; align-items:stretch}
@media(max-width:820px){
  .lgPage .lgOc{grid-template-columns:1fr; gap:12px}
}
.lgPage .lgOcCard{border-radius:var(--r); padding:28px; border:1px solid; display:flex; flex-direction:column}
.lgPage .lgOcCard .lgBig{width:60px; height:60px; border-radius:16px; display:grid; place-items:center; margin-bottom:16px; background:#fff}
.lgPage .lgOcCard .lgBig svg{width:32px; height:32px}
.lgPage .lgOcCard h3{margin:0}
.lgPage .lgOcCard .lgSub{margin:4px 0 18px; font-weight:800; font-size:1.06rem}
.lgPage .lgOcCard ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:11px}
.lgPage .lgOcCard li{display:flex; gap:9px; align-items:flex-start; font-size:16px; line-height:1.55; color:var(--muted)}
.lgPage .lgOcCard li svg{width:18px; height:18px; flex:none; margin-top:2px}
.lgPage .lgOcCard.lgBad{background:var(--orange-soft); border-color:#F7D8C8}
.lgPage .lgOcCard.lgBad .lgBig{color:var(--orange-d)}
.lgPage .lgOcCard.lgBad h3,.lgPage .lgOcCard.lgBad .lgSub{color:var(--orange-d)}
.lgPage .lgOcCard.lgGood{background:var(--green-soft); border-color:#CDEBDD}
.lgPage .lgOcCard.lgGood .lgBig{color:var(--green-d)}
.lgPage .lgOcCard.lgGood h3,.lgPage .lgOcCard.lgGood .lgSub{color:var(--green-d)}
.lgPage .lgOcArrow{display:flex; align-items:center; justify-content:center}
.lgPage .lgOcArrow span{width:46px; height:46px; border-radius:50%; background:var(--navy); color:#fff; display:grid; place-items:center; box-shadow:var(--shadow)}
@media(max-width:820px){
  .lgPage .lgOcArrow span{transform:rotate(90deg)}
}
