/* Extra styles for the redesigned sector and audience pages under /advertise (the lgx look, see docs/advertise-redesign-kit.md).
   New classes only (prefix lgs-), loaded after advertise-lgx.css; nothing here changes a rule of another page. */

/* ---- audience map: audience -> newsletter -> placements, one lane per newsletter ---- */
.lgs-lanes{display:grid;gap:14px}
.lgs-lanehead,.lgs-lane{display:grid;grid-template-columns:minmax(0,1fr) 34px minmax(0,1.05fr) 34px minmax(0,1fr);align-items:stretch}
.lgs-lanehead{margin:0 0 -2px}
.lgs-lanehead p{margin:0;font:600 11.5px/1 Inter,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:rgba(13,11,43,.45);padding:0 4px}
.lgs-cell{background:#fff;border:1px solid var(--lg-line);border-radius:18px;padding:18px 20px;min-width:0;box-shadow:0 10px 22px -18px rgba(13,11,43,.35)}
.lgs-cell h3{font:600 16px/1.25 Poppins,Inter,sans-serif;letter-spacing:-.02em;margin:0 0 6px;color:var(--ink)}
.lgs-cell p{font-size:14.5px;line-height:1.5;color:var(--muted);margin:0}
.lgs-arr{position:relative;display:flex;align-items:center;justify-content:center}
.lgs-arr::before{content:"";width:12px;height:12px;border-top:3px solid var(--accent);border-right:3px solid var(--accent);transform:rotate(45deg);opacity:.6;margin-left:-6px}
.lgs-arr::after{content:"";position:absolute;left:3px;right:11px;top:50%;border-top:2px dotted rgba(108,92,251,.5)}
.lgs-nl{display:flex;gap:14px;align-items:flex-start;border-color:rgba(108,92,251,.45);box-shadow:0 0 0 3px rgba(108,92,251,.08),0 12px 24px -18px rgba(13,11,43,.4)}
.lgs-nl img{flex:0 0 44px;width:44px;height:44px;border-radius:12px;object-fit:cover;box-shadow:0 0 0 1px rgba(13,11,43,.07)}
.lgs-nl>div{min-width:0}
.lgs-nl h3{margin:0 0 4px;font-size:17px}
.lgs-nl .st{display:block;font:500 12.5px/1.4 "JetBrains Mono",ui-monospace,Menlo,monospace;color:rgba(13,11,43,.55);margin:0 0 8px}
.lgs-who .lgx-chips,.lgs-buy .lgx-chips{gap:6px}
.lgs-who .lgx-chip{font-size:13px;padding:7px 11px}
.lgs-lab{display:none;font:600 11px/1 Inter,sans-serif;letter-spacing:.09em;text-transform:uppercase;color:rgba(13,11,43,.45);margin:0 0 10px}
.lgs-who,.lgs-buy{display:flex;flex-direction:column;justify-content:center}
.lgs-buy ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.lgs-buy li{display:flex;gap:10px;align-items:center;font:500 14px/1.3 Inter,sans-serif;color:rgba(13,11,43,.8)}
.lgs-buy li::before{content:"";flex:0 0 8px;height:8px;border-radius:50%;background:var(--accent)}
.lgs-lane.is-dim .lgs-nl{border-color:var(--lg-line);box-shadow:0 10px 22px -18px rgba(13,11,43,.35)}

/* ---- dark band (audience pages) ---- */
.lgs-band{position:relative;margin-top:96px;background:var(--ink);color:#fff;overflow:hidden}
.lgs-band::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(700px 320px at 14% 0%,rgba(108,92,251,.34),transparent 70%),radial-gradient(620px 320px at 88% 100%,rgba(32,51,240,.26),transparent 70%)}
.lgs-band>*{position:relative}
.lgs-band .lgx-sec{padding-top:88px;padding-bottom:96px}
.lgs-band .lgx-eyebrow{color:#A9B0FF}
.lgs-band .lgx-h2{color:#fff}
.lgs-band .lgx-sub{color:rgba(255,255,255,.68)}
.lgs-band .lgs-lanehead p{color:rgba(255,255,255,.5)}
.lgs-band .lgs-cell{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.14);box-shadow:none}
.lgs-band .lgs-cell h3{color:#fff}
.lgs-band .lgs-cell p{color:rgba(255,255,255,.66)}
.lgs-band .lgs-nl{border-color:rgba(169,176,255,.6);background:rgba(255,255,255,.1)}
.lgs-band .lgs-lane.is-dim .lgs-nl{border-color:rgba(255,255,255,.16);background:rgba(255,255,255,.07)}
.lgs-band .lgs-nl .st{color:rgba(255,255,255,.62)}
.lgs-band .lgs-lab{color:rgba(255,255,255,.5)}
.lgs-band .lgx-chip{background:rgba(255,255,255,.1);color:#fff}
.lgs-band .lgx-chip.on{background:var(--accent);color:#fff}
.lgs-band .lgx-chip.soft{background:rgba(129,116,255,.28);color:#E7E4FF;border-color:rgba(169,176,255,.45)}
.lgs-band .lgs-buy li{color:rgba(255,255,255,.88)}
.lgs-band .lgs-buy li::before{background:#8174FF}
.lgs-band .lgs-arr::before{border-color:#A9B0FF}
.lgs-band .lgs-arr::after{border-color:rgba(169,176,255,.5)}
.lgs-band .lgx-note{background:rgba(255,255,255,.08);color:rgba(255,255,255,.8)}
.lgs-band .lgs-src{color:rgba(255,255,255,.5)}
.lgs-band .lgs-src a{color:rgba(255,255,255,.75)}

/* ---- audience hero ---- */
.lgs-ahero{max-width:1200px;margin:0 auto;padding:96px 32px 0;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:56px;align-items:center}
.lgs-ahero .aud-breadcrumb{margin:0 0 26px}
.lgs-ahero h1{font:500 44px/1.08 Poppins,Inter,sans-serif;letter-spacing:-.03em;margin:0 0 20px;color:var(--ink);text-wrap:balance}
.lgs-ahero .lede{font-size:18px;line-height:1.6;color:rgba(13,11,43,.6);margin:0 0 30px;max-width:560px}
.lgs-hcard{background:linear-gradient(160deg,#EFEDFF,#FFFFFF 78%);border:1px solid var(--lg-line);border-radius:26px;padding:22px;box-shadow:0 1px 2px rgba(13,11,43,.05),0 28px 54px -30px rgba(13,11,43,.35)}
.lgs-hcard svg{display:block;width:100%;height:auto}
.lgs-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:34px 0 0;max-width:600px}
.lgs-stat{background:#fff;border:1px solid var(--lg-line);border-top:3px solid var(--accent);border-radius:14px;padding:16px 16px 14px}
.lgs-stat:nth-child(2){border-top-color:var(--green)}
.lgs-stat:nth-child(3){border-top-color:var(--blue,#2033F0)}
.lgs-stat .v{font:500 24px/1.1 "JetBrains Mono",ui-monospace,Menlo,monospace;letter-spacing:-.03em;color:var(--ink);margin:0;font-variant-numeric:tabular-nums}
.lgs-stat .l{font-size:12.5px;line-height:1.4;color:rgba(13,11,43,.55);margin:6px 0 0}

/* ---- role cards ---- */
.lgs-roles{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.lgs-role{background:#fff;border:1px solid var(--lg-line);border-radius:18px;padding:18px;display:flex;gap:14px;align-items:center}
.lgs-role svg{flex:0 0 46px}
.lgs-role b{font:600 15.5px/1.25 Poppins,Inter,sans-serif;letter-spacing:-.015em;color:var(--ink)}
.lgs-src{font-size:12.5px;line-height:1.5;color:rgba(13,11,43,.5);margin:12px 0 0}
.lgs-src a{color:inherit;text-decoration:underline;text-underline-offset:3px}

/* ---- campaign rail (audience pages) ---- */
.lgs-rail{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;position:relative;counter-reset:r}
.lgs-rail::before{content:"";position:absolute;left:26px;right:calc((100% - 72px)/5 - 26px);top:25px;border-top:3px dotted rgba(108,92,251,.4)}
.lgs-rs{position:relative;text-align:left}
.lgs-rs svg{display:block;position:relative;box-shadow:0 10px 20px -10px rgba(90,73,242,.65);border-radius:14px;margin:0 0 16px}
.lgs-rs h3{font:600 17px/1.25 Poppins,Inter,sans-serif;letter-spacing:-.02em;margin:0 0 6px;color:var(--ink)}
.lgs-rs p{font-size:14.5px;line-height:1.5;color:var(--muted);margin:0}
.lgs-rs .n{position:absolute;left:38px;top:-8px;width:22px;height:22px;border-radius:50%;background:var(--ink);color:#fff;font:600 11.5px/22px Inter,sans-serif;text-align:center;border:2px solid var(--page,#FAFAFC)}

/* ---- format tiles and quote ---- */
.lgs-fmts{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.lgs-fmts.is-4{grid-template-columns:repeat(4,1fr)}
.lgs-fmt{background:#fff;border:1px solid var(--lg-line);border-radius:18px;padding:20px;display:flex;flex-direction:column;gap:6px;text-decoration:none;color:inherit}
.lgs-fmt svg{margin-bottom:8px}
.lgs-fmt h3{font:600 16.5px/1.25 Poppins,Inter,sans-serif;letter-spacing:-.02em;margin:0;color:var(--ink)}
.lgs-fmt p{font-size:14.5px;line-height:1.5;color:var(--muted);margin:0}
.lgs-fmt .go{margin-top:auto;padding-top:8px;font:600 13.5px/1 Inter,sans-serif;color:var(--accent)}
a.lgs-fmt:hover{border-color:rgba(108,92,251,.45)}
.lgs-quote{background:var(--ink);color:#fff;border-radius:22px;padding:34px 38px;margin-top:32px;position:relative;overflow:hidden}
.lgs-quote::before{content:"";position:absolute;inset:0;background:radial-gradient(520px 260px at 90% 0%,rgba(108,92,251,.4),transparent 70%)}
.lgs-quote>*{position:relative}
.lgs-quote p.q{font:500 22px/1.4 Poppins,Inter,sans-serif;letter-spacing:-.015em;margin:0 0 18px;max-width:820px;color:#fff}
.lgs-quote p.by{margin:0;font-size:14.5px;color:rgba(255,255,255,.65)}
.lgs-quote p.by b{color:#fff;font-weight:600}

/* ---- other audiences row with five cards ---- */
.aud-other-row.is-5{grid-template-columns:repeat(5,1fr)}

/* ---- journeys with 2 or 3 stops ---- */
.lgx-journey.lgs-j3,.lgx-after.lgs-j3,.lgx-flow.lgs-j3{grid-template-columns:repeat(3,1fr)}
.lgx-journey.lgs-j2,.lgx-after.lgs-j2{grid-template-columns:repeat(2,1fr)}
.lgs-j2 .lgx-stop:not(:last-child)::after{display:none}
.lgx-flow.lgs-j4{grid-template-columns:repeat(4,1fr)}
.lgs-tag{display:inline-block;margin:0 0 8px;font:600 11px/1 Inter,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#4a3df0;background:var(--lg-soft);padding:6px 10px;border-radius:999px}
.lgs-two{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.lgs-two .lgx-stop::after{display:none}
.lgs-two .lgx-stop.is-win{border-color:rgba(108,92,251,.55);box-shadow:0 0 0 3px rgba(108,92,251,.1)}

@media (max-width:1000px){
.aud-other-row.is-5{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.lgs-lanehead{display:none}
.lgs-lab{display:block}
.lgs-lane{grid-template-columns:1fr;gap:0}
.lgs-arr{height:30px}
.lgs-arr::before{margin:0;transform:rotate(135deg)}
.lgs-arr::after{left:50%;right:auto;top:2px;bottom:2px;border-top:0;border-left:2px dotted rgba(108,92,251,.5)}
.lgs-ahero{grid-template-columns:1fr;gap:34px;padding:80px 20px 0}
.lgs-ahero h1{font-size:34px}
.lgs-roles,.lgs-fmts.is-4{grid-template-columns:1fr 1fr}
.lgs-fmts{grid-template-columns:1fr 1fr}
.lgs-rail{grid-template-columns:1fr 1fr;row-gap:28px}
.lgs-rail::before{display:none}
.lgx-journey.lgs-j3,.lgx-after.lgs-j3,.lgx-flow.lgs-j3,.lgx-flow.lgs-j4{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
.lgs-role{padding:12px 16px}
.lgs-stats{grid-template-columns:1fr 1fr 1fr;gap:8px}
.lgs-stat{padding:12px 10px}
.lgs-stat .v{font-size:19px}
.lgs-roles,.lgs-fmts,.lgs-fmts.is-4,.lgs-rail,.lgs-two{grid-template-columns:1fr}
.lgx-journey.lgs-j3,.lgx-after.lgs-j3,.lgx-flow.lgs-j3,.lgx-flow.lgs-j4,.lgx-journey.lgs-j2,.lgx-after.lgs-j2{grid-template-columns:1fr}
.lgs-rs{display:grid;grid-template-columns:52px 1fr;column-gap:14px;align-items:start}
.lgs-rs svg{grid-row:1/span 2;margin:0}
.lgs-rs .n{left:34px}
.lgs-quote{padding:26px 22px}
.lgs-quote p.q{font-size:18px}
.lgs-band{margin-top:64px}
.lgs-band .lgx-sec{padding-top:64px;padding-bottom:64px}
.lgs-ahero{padding:72px 16px 0}
.lgs-hcard{padding:14px;border-radius:20px}
}