/* Public product tour: requested only by /tour. */
.product-tour-hero { min-height: 745px; padding-block: 88px 82px; position: relative; display: grid; grid-template-columns: minmax(0, 1.04fr) minmax(430px, .82fr); align-items: center; gap: clamp(50px, 7vw, 108px); }
.product-tour-hero::before { content: ""; width: 330px; height: 330px; position: absolute; right: -210px; top: 42px; z-index: -1; border-radius: 43% 57% 61% 39% / 54% 43% 57% 46%; background: rgba(121,205,245,.2); transform: rotate(18deg); }
.product-tour-hero-copy h1 { max-width: 790px; margin: 24px 0 22px; font-size: clamp(53px, 6.4vw, 88px); line-height: .98; letter-spacing: -.072em; }
.product-tour-hero-copy h1 span { display: block; color: #df6f61; }
.product-tour-hero-copy > p { max-width: 730px; margin: 0; color: #617087; font-size: 17px; line-height: 1.8; }
.product-tour-hero-copy .hero-actions { margin-top: 31px; }
.product-tour-hero-proof { margin-top: 26px; display: flex; flex-wrap: wrap; gap: 10px 19px; color: #617087; font-size: 11px; font-weight: 750; }
.product-tour-hero-proof span { display: inline-flex; align-items: center; gap: 6px; }
.product-tour-hero-proof svg { width: 15px; height: 15px; padding: 3px; border-radius: 50%; color: #28755b; background: #dff4e9; stroke-width: 3; }
.product-tour-map { padding: 25px; position: relative; overflow: hidden; border: 1px solid #ddd1e6; border-radius: 32px 32px 13px 32px; background: linear-gradient(145deg, rgba(255,255,255,.9), rgba(249,240,252,.92) 52%, rgba(235,249,255,.9)); box-shadow: 0 12px 0 rgba(86,64,101,.07), var(--soft-shadow); transform: rotate(1.2deg); }
.product-tour-map::after { content: "✦"; position: absolute; right: 20px; bottom: 43px; color: rgba(129,88,151,.17); font-size: 46px; transform: rotate(8deg); }
.product-tour-map-top { padding: 2px 2px 19px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; border-bottom: 1px dashed #d9ccdf; }
.product-tour-map-top > span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 15px 15px 6px 15px; color: #fff; background: #9169a8; box-shadow: 0 5px 0 #76538a; transform: rotate(-3deg); }
.product-tour-map-top > span svg { width: 20px; }
.product-tour-map-top > div { display: grid; gap: 3px; }
.product-tour-map-top small { color: #9378a3; font: 700 8px/1 var(--font-forward-mono), monospace; letter-spacing: .09em; }
.product-tour-map-top strong { font-size: 14px; }
.product-tour-map-top em { padding: 7px 9px; border-radius: 999px; color: #4f7a6a; background: #dff4e9; font-size: 8px; font-style: normal; font-weight: 850; }
.product-tour-map ol { margin: 19px 0 0; padding: 0; display: grid; gap: 7px; list-style: none; }
.product-tour-map li a { min-height: 59px; padding: 8px 11px; display: grid; grid-template-columns: 27px 36px minmax(0, 1fr) auto; align-items: center; gap: 9px; border: 1px solid transparent; border-radius: 15px; transition: transform 160ms ease, border-color 160ms ease, background 160ms ease; }
.product-tour-map li a:hover { transform: translateX(3px); border-color: #e0d5e7; background: rgba(255,255,255,.78); }
.product-tour-map li a > span { color: #a091a8; font: 700 8px var(--font-forward-mono), monospace; }
.product-tour-map li a > i { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 12px 12px 5px 12px; color: #a14d43; background: var(--peach-soft); font-style: normal; }
.product-tour-map li:nth-child(2) a > i { color: #79518e; background: #efe4f7; }
.product-tour-map li:nth-child(3) a > i { color: #2e7b61; background: var(--mint-soft); }
.product-tour-map li:nth-child(4) a > i { color: #397895; background: var(--sky-soft); }
.product-tour-map li:nth-child(5) a > i { color: #87611b; background: var(--sun-soft); }
.product-tour-map li:nth-child(6) a > i { color: #a14d43; background: #ffe1dd; }
.product-tour-map li a > i svg { width: 16px; }
.product-tour-map li a > strong { font-size: 11px; }
.product-tour-map li a > svg { width: 14px; color: #998ba0; }
.product-tour-map > p { margin: 18px 3px 0; position: relative; z-index: 1; display: flex; align-items: center; gap: 7px; color: #788194; font-size: 8px; }
.product-tour-map > p svg { width: 14px; color: #398265; }
.product-tour-jumps { min-height: 72px; position: sticky; z-index: 25; top: 78px; display: flex; align-items: center; border-block: 1px solid var(--line); background: rgba(255,248,237,.9); backdrop-filter: blur(18px); }
.product-tour-jumps > div { display: flex; align-items: center; justify-content: center; gap: 9px; }
.product-tour-jumps a { min-height: 38px; padding: 0 13px; display: inline-flex; align-items: center; gap: 6px; border-radius: 12px; color: #647188; font-size: 10px; font-weight: 800; white-space: nowrap; }
.product-tour-jumps a:hover { color: var(--navy); background: rgba(255,255,255,.84); }
.product-tour-jumps svg { width: 14px; }
.product-tour-note { margin-top: 74px; padding: 21px 24px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 15px; border: 1px solid #e3d3a7; border-radius: 20px 20px 8px 20px; background: linear-gradient(120deg, #fff2c9, #fff9e8); }
.product-tour-note > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 14px 14px 6px 14px; color: #805d18; background: var(--sun); box-shadow: 0 4px 0 #dcb344; transform: rotate(-3deg); }
.product-tour-note > span svg { width: 19px; }
.product-tour-note > div { display: grid; gap: 4px; }
.product-tour-note strong { font-size: 12px; }
.product-tour-note p { margin: 0; color: #756f63; font-size: 10px; line-height: 1.55; }
.product-tour-note > a, .product-tour-copy > a { display: inline-flex; align-items: center; gap: 7px; color: #395c76; font-size: 10px; font-weight: 850; white-space: nowrap; }
.product-tour-note > a svg, .product-tour-copy > a svg { width: 14px; }
.product-tour-chapters { padding-block: 90px 145px; display: grid; gap: 0; }
.product-tour-chapter { min-height: 660px; padding-block: 92px; scroll-margin-top: 148px; display: grid; grid-template-columns: minmax(300px, .78fr) minmax(520px, 1.22fr); align-items: center; gap: clamp(55px, 8vw, 118px); border-bottom: 1px solid var(--line); }
.product-tour-chapter:first-child { padding-top: 40px; }
.product-tour-chapter:nth-child(even) .product-tour-copy { order: 2; }
.product-tour-chapter:last-child { border-bottom: 0; }
.product-tour-copy { max-width: 530px; }
.product-tour-number { width: 52px; height: 52px; margin-bottom: 35px; display: grid; place-items: center; border-radius: 18px 18px 7px 18px; color: #9e4c42; background: var(--peach-soft); box-shadow: 0 5px 0 rgba(225,101,87,.15); font: 800 13px var(--font-forward-mono), monospace; transform: rotate(-3deg); }
.product-tour-number.lavender { color: #76518e; background: #eee2f7; box-shadow-color: rgba(118,81,142,.14); }
.product-tour-number.mint { color: #28775b; background: var(--mint-soft); box-shadow-color: rgba(40,119,91,.13); }
.product-tour-number.sky { color: #347895; background: var(--sky-soft); box-shadow-color: rgba(52,120,149,.13); }
.product-tour-number.sun { color: #805e1b; background: var(--sun-soft); box-shadow-color: rgba(128,94,27,.13); }
.product-tour-number.coral { color: #a24b42; background: #ffe0db; box-shadow-color: rgba(162,75,66,.13); }
.product-tour-copy > small { color: #957f9e; font: 700 9px var(--font-forward-mono), monospace; letter-spacing: .1em; }
.product-tour-copy h2 { margin: 13px 0 17px; font-size: clamp(38px, 4.2vw, 61px); line-height: 1.06; letter-spacing: -.06em; }
.product-tour-copy > p { margin: 0; color: var(--muted); font-size: 15px; line-height: 1.78; }
.product-tour-copy ul { margin: 27px 0 28px; padding: 0; display: grid; gap: 11px; list-style: none; }
.product-tour-copy li { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 9px; color: #56657b; font-size: 11px; line-height: 1.55; }
.product-tour-copy li svg { width: 17px; height: 17px; padding: 4px; border-radius: 50%; color: #2f7b61; background: #dff4e9; stroke-width: 3; }
.product-tour-canvas { min-width: 0; overflow: hidden; border: 1px solid #ddd5cc; border-radius: 30px 30px 12px 30px; background: rgba(255,253,248,.96); box-shadow: 0 20px 60px rgba(36,56,79,.12), 9px 9px 0 rgba(121,205,245,.11); }
.product-tour-canvas > header { min-height: 67px; padding: 0 21px; display: flex; align-items: center; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--line); background: rgba(255,250,243,.88); }
.product-tour-canvas > header > div { display: flex; align-items: center; gap: 9px; }
.product-tour-canvas > header strong { font-size: 12px; }
.product-tour-canvas > header em { padding: 6px 9px; border-radius: 999px; color: #2d745a; background: #dff4e9; font-size: 8px; font-style: normal; font-weight: 850; }
.canvas-dot { width: 12px; height: 12px; border: 3px solid #fff; border-radius: 50%; background: var(--peach); box-shadow: 0 0 0 1px #e6bdb5; }
.canvas-dot.lavender { background: #9a73b0; box-shadow: 0 0 0 1px #dac9e3; }
.canvas-dot.mint { background: #63b795; box-shadow: 0 0 0 1px #b9dfcf; }
.canvas-dot.sky { background: #66bde4; box-shadow: 0 0 0 1px #b8deee; }
.canvas-dot.sun { background: #e4ae37; box-shadow: 0 0 0 1px #ecd594; }
.canvas-dot.coral { background: #ed7768; box-shadow: 0 0 0 1px #eabdb6; }
.product-tour-canvas > footer { min-height: 52px; padding: 0 20px; display: flex; align-items: center; gap: 8px; border-top: 1px solid var(--line); color: #667588; background: #fbfaf7; font-size: 8px; font-weight: 750; }
.product-tour-canvas > footer svg { width: 15px; color: #398267; }
.send-request { margin: 24px 24px 0; padding: 17px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 13px; border: 1px solid #d9dce8; border-radius: 17px; background: #f7f9fd; }
.send-request > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; color: #fff; background: #42668c; }
.send-request > span svg { width: 17px; }
.send-request > div { display: grid; gap: 4px; }
.send-request small { color: #7e8998; font: 8px var(--font-forward-mono), monospace; }
.send-request strong { font-size: 11px; }
.send-request code { color: #3b7f68; font-size: 9px; }
.send-lifecycle { margin: 25px 28px 31px 43px; padding: 0 0 0 27px; display: grid; gap: 18px; border-left: 2px solid #dce7e2; list-style: none; }
.send-lifecycle li { min-height: 44px; position: relative; display: flex; align-items: center; }
.send-lifecycle li > i { width: 22px; height: 22px; position: absolute; left: -39px; display: grid; place-items: center; border: 3px solid #fff; border-radius: 50%; color: #fff; background: #58a786; box-shadow: 0 0 0 1px #bfdccf; }
.send-lifecycle li > i svg { width: 11px; stroke-width: 3; }
.send-lifecycle li > div { display: flex; flex: 1; align-items: center; justify-content: space-between; gap: 14px; }
.send-lifecycle strong { font-size: 10px; }
.send-lifecycle small { color: #8d96a2; font: 8px var(--font-forward-mono), monospace; }
.automation-flow { min-height: 390px; padding: 30px; display: grid; justify-items: center; align-content: center; }
.flow-node { width: min(300px, 100%); padding: 13px 15px; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 12px; border: 1px solid #d8d0df; border-radius: 16px; background: #fff; box-shadow: 0 5px 0 rgba(71,56,83,.05); }
.flow-node > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 12px 12px 5px 12px; color: #fff; background: #8b65a2; }
.flow-node.wait > span { color: #805e1b; background: var(--sun); }
.flow-node.condition > span { color: #2e715b; background: var(--mint); }
.flow-node svg { width: 17px; }
.flow-node > div { display: grid; gap: 3px; }
.flow-node small { color: #91849a; font: 7px var(--font-forward-mono), monospace; letter-spacing: .07em; }
.flow-node strong { font-size: 10px; }
.automation-flow > i { width: 2px; height: 24px; background: #d7cedf; }
.flow-branches { width: min(400px, 100%); margin-top: 13px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.flow-branches span { min-height: 43px; padding: 9px; display: flex; align-items: center; justify-content: center; gap: 6px; border-radius: 13px; color: #41715f; background: #e6f5ee; font-size: 8px; font-weight: 800; }
.flow-branches span:last-child { color: #8a6521; background: #fff2c7; }
.flow-branches svg { width: 13px; }
.audience-filter { margin: 22px; padding: 12px 13px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 9px; border: 1px solid #d9d0e0; border-radius: 14px; color: #76568b; background: #f8f1fb; font-size: 9px; }
.audience-filter svg { width: 15px; }
.audience-filter strong { font-size: 10px; }
.audience-list { margin: 0 22px 22px; overflow: hidden; border: 1px solid var(--line); border-radius: 16px; }
.audience-list > div, .brand-list > div { min-height: 72px; padding: 12px 14px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 11px; border-bottom: 1px solid var(--line); }
.audience-list > div:last-child, .brand-list > div:last-child { border-bottom: 0; }
.audience-list > div > span, .brand-list > div > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 13px 13px 5px 13px; color: #9b4e45; background: var(--peach-soft); font-size: 8px; font-weight: 900; }
.audience-list > div > span.sky, .brand-list > div > span.sky { color: #327696; background: var(--sky-soft); }
.audience-list > div > span.mint { color: #2e775e; background: var(--mint-soft); }
.brand-list > div > span.sun { color: #805d1b; background: var(--sun-soft); }
.audience-list > div > div, .brand-list > div > div { display: grid; gap: 4px; }
.audience-list strong, .brand-list strong { font-size: 10px; }
.audience-list small, .brand-list small { color: #8590a0; font-size: 8px; }
.audience-list em { display: inline-flex; align-items: center; gap: 5px; color: #367960; font-size: 8px; font-style: normal; font-weight: 800; }
.audience-list em i { width: 7px; height: 7px; border-radius: 50%; background: #65b695; }
.broadcast-metrics { padding: 23px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.broadcast-metrics article { min-height: 90px; padding: 13px; display: grid; align-content: center; gap: 4px; border: 1px solid #d9e6ec; border-radius: 15px; background: #f1faff; }
.broadcast-metrics article:nth-child(2) { border-color: #eadbd5; background: #fff5f1; }
.broadcast-metrics article:nth-child(3) { border-color: #e5dcef; background: #f9f4fc; }
.broadcast-metrics small { color: #7f8b9a; font-size: 7px; }
.broadcast-metrics strong { font-size: 20px; letter-spacing: -.05em; }
.broadcast-metrics span { color: #3f8069; font-size: 8px; font-weight: 800; }
.broadcast-chart { height: 160px; margin: 0 24px 27px; padding: 15px 16px 0; display: flex; align-items: end; gap: 7px; border-bottom: 1px solid #d8e4ea; background-image: linear-gradient(#edf3f6 1px, transparent 1px); background-size: 100% 38px; }
.broadcast-chart i { min-width: 5px; flex: 1; border-radius: 5px 5px 0 0; background: linear-gradient(#78cdf3, #aadff6); }
.domain-score { margin: 22px; padding: 17px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 13px; border: 1px solid #d4e5dd; border-radius: 17px; background: #f0faf5; }
.domain-score > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 14px; color: #fff; background: #54a985; }
.domain-score > span svg { width: 19px; }
.domain-score > div { display: grid; gap: 3px; }
.domain-score small { color: #6a8a7e; font: 7px var(--font-forward-mono), monospace; }
.domain-score strong { font-size: 12px; }
.domain-score p { margin: 0; color: #81918b; font-size: 8px; }
.domain-score b { color: #3d8067; font-size: 22px; }
.domain-checks { margin: 0 22px 22px; overflow: hidden; border: 1px solid var(--line); border-radius: 16px; }
.domain-checks > div { min-height: 61px; padding: 10px 13px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; border-bottom: 1px solid var(--line); }
.domain-checks > div:last-child { border-bottom: 0; }
.domain-checks > div > i { width: 25px; height: 25px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #62ae8e; }
.domain-checks > div > i svg { width: 13px; stroke-width: 3; }
.domain-checks > div > span { display: grid; gap: 3px; }
.domain-checks strong { font-size: 9px; }
.domain-checks small { color: #8993a0; font-size: 7px; }
.domain-checks code { color: #32785e; font-size: 7px; font-weight: 850; }
.brand-list { margin: 23px; overflow: hidden; border: 1px solid var(--line); border-radius: 17px; }
.brand-list > div.active { background: #fff6f0; }
.brand-list em { display: inline-flex; align-items: center; gap: 4px; color: #5b6f87; font-size: 8px; font-style: normal; font-weight: 800; }
.brand-list em svg { width: 12px; }
.brand-integrations { margin: -5px 23px 23px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.brand-integrations span { min-height: 50px; padding: 9px; display: flex; align-items: center; justify-content: center; gap: 6px; border: 1px solid #ddd6e4; border-radius: 13px; color: #6e5a7b; background: #faf6fc; font-size: 8px; font-weight: 800; }
.brand-integrations svg { width: 14px; }
.product-tour-finale { margin-bottom: 110px; min-height: 520px; padding: 80px 45px; position: relative; overflow: hidden; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; border: 1px solid #d7d0e2; border-radius: 38px 38px 15px 38px; background: radial-gradient(circle at 12% 18%, rgba(255,211,107,.34), transparent 24%), radial-gradient(circle at 88% 82%, rgba(121,205,245,.31), transparent 25%), linear-gradient(145deg, #fffaf0, #fffdf8 54%, #f4edfa); box-shadow: 0 10px 0 rgba(75,55,91,.05); }
.product-tour-finale h2 { max-width: 890px; margin: 15px 0 17px; font-size: clamp(42px, 5.4vw, 72px); line-height: 1.04; letter-spacing: -.065em; }
.product-tour-finale > p { max-width: 720px; margin: 0; color: var(--muted); font-size: 15px; line-height: 1.75; }
.product-tour-finale-route { margin: 30px 0; display: flex; align-items: center; justify-content: center; gap: 8px; }
.product-tour-finale-route span { padding: 9px 12px; border: 1px solid #ded5e6; border-radius: 999px; color: #6b5c75; background: rgba(255,255,255,.8); font-size: 9px; font-weight: 850; }
.product-tour-finale-route svg { width: 14px; color: #9b8aa4; }

@media (max-width: 1260px) {
  .product-tour-hero { grid-template-columns: minmax(0, 1fr) minmax(390px, .78fr); gap: 50px; }
  .product-tour-chapter { gap: 60px; }
}

@media (max-width: 1050px) {
  .product-tour-hero { min-height: auto; padding-block: 68px 78px; grid-template-columns: 1fr; }
  .product-tour-hero-copy { max-width: 810px; text-align: center; justify-self: center; }
  .product-tour-hero-copy > p { margin-inline: auto; }
  .product-tour-hero-copy .hero-actions, .product-tour-hero-proof { justify-content: center; }
  .product-tour-map { width: min(620px, 100%); justify-self: center; transform: none; }
  .product-tour-jumps { top: 76px; overflow: hidden; }
  .product-tour-jumps > div { justify-content: flex-start; overflow-x: auto; scrollbar-width: none; }
  .product-tour-jumps > div::-webkit-scrollbar { display: none; }
  .product-tour-chapter { grid-template-columns: minmax(270px, .72fr) minmax(430px, 1.28fr); gap: 42px; }
  .product-tour-chapter:nth-child(even) .product-tour-copy { order: 0; }
  .product-tour-copy h2 { font-size: 44px; }
}

@media (max-width: 760px) {
  .product-tour-hero { padding-top: 50px; }
  .product-tour-hero-copy { text-align: left; }
  .product-tour-hero-copy h1 { font-size: clamp(46px, 13.2vw, 66px); }
  .product-tour-hero-copy .hero-actions, .product-tour-hero-proof { justify-content: flex-start; }
  .product-tour-hero-copy .button { width: 100%; }
  .product-tour-map { padding: 18px; }
  .product-tour-map-top { grid-template-columns: auto minmax(0, 1fr); }
  .product-tour-map-top em { grid-column: 2; justify-self: start; }
  .product-tour-jumps { min-height: 62px; top: 76px; }
  .product-tour-note { margin-top: 48px; grid-template-columns: auto minmax(0, 1fr); align-items: start; }
  .product-tour-note > a { grid-column: 2; justify-self: start; }
  .product-tour-chapters { padding-block: 52px 95px; }
  .product-tour-chapter, .product-tour-chapter:first-child { min-height: 0; padding-block: 64px; grid-template-columns: 1fr; gap: 38px; scroll-margin-top: 132px; }
  .product-tour-copy { max-width: none; }
  .product-tour-copy h2 { font-size: clamp(37px, 10vw, 50px); }
  .product-tour-canvas { width: 100%; }
  .product-tour-finale { min-height: 560px; padding: 65px 22px; }
  .product-tour-finale-route { max-width: 340px; flex-wrap: wrap; }
  .product-tour-finale .button { width: 100%; }
}

@media (max-width: 520px) {
  .product-tour-map li a { grid-template-columns: 23px 34px minmax(0, 1fr); }
  .product-tour-map li a > svg { display: none; }
  .product-tour-map > p { max-width: 250px; }
  .product-tour-note { padding: 18px; }
  .product-tour-number { margin-bottom: 27px; }
  .product-tour-canvas > header { padding-inline: 15px; }
  .send-request { margin: 17px 17px 0; padding: 13px; grid-template-columns: minmax(0, 1fr) auto; }
  .send-request > span { display: none; }
  .send-lifecycle { margin-inline: 34px 18px; }
  .automation-flow { padding: 22px 16px; }
  .flow-branches { grid-template-columns: 1fr; }
  .audience-filter, .domain-score { margin: 17px; }
  .audience-list, .domain-checks, .brand-list { margin-inline: 17px; }
  .audience-list em { display: none; }
  .audience-list > div { grid-template-columns: auto minmax(0, 1fr); }
  .broadcast-metrics { padding: 17px; gap: 6px; }
  .broadcast-metrics article { padding: 10px; }
  .broadcast-metrics strong { font-size: 16px; }
  .broadcast-chart { margin-inline: 18px; }
  .domain-score b { font-size: 18px; }
  .domain-checks small { display: none; }
  .brand-list em { font-size: 0; }
  .brand-list em svg { width: 14px; }
  .brand-integrations { margin-inline: 17px; grid-template-columns: 1fr; }
  .product-tour-finale-route svg { display: none; }
}