/* Review v31: consistent header behaviour and honest sibling alignment (no min-height padding) */

/* Same sticky header as the landing page */
.site-header{position:sticky;top:0;z-index:30;background:rgba(18,26,43,.86);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid rgba(255,255,255,.1)}

/* Remove invisible padding that hid uneven wrapping; copy now wraps evenly */
.method p,.takeaways h3,.setting-card h3,.setting-card .card-description{min-height:0!important}

/* Approach steps: each subtitle line stays a line at every width */
@media(max-width:760px){
 .method-line{display:block}
 .method-line+.method-line:before{content:none}
}

/* Endpoint selectors: a 2 x 2 grid on phones instead of a clipped scroller */
@media(max-width:760px){
 .example-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible}
 .example-tabs button{min-width:0;padding:13px 8px}
}

/* Workplace tabs: equal one-line labels on phones */
@media(max-width:760px){
 .workplace-tabs a{padding:12px 6px;font-size:15px;white-space:nowrap}
}

/* Workplace cards: four use cases sit in one row on wide screens, 2 x 2 below */
@media(min-width:1280px){.setting-cards:has(>.setting-card:nth-child(4)){grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1279px) and (min-width:761px){.setting-cards:has(>.setting-card:nth-child(4)){grid-template-columns:repeat(2,minmax(0,1fr))}}
.setting-more:has(>a:nth-of-type(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:760px){.setting-more:has(>a:nth-of-type(2):last-child){grid-template-columns:1fr}}

/* Workplace closing block: lead and privacy line under the heading, button level with the heading */
.workplace-close{row-gap:0}
.workplace-close .close-lead{margin:12px 0 0}
.workplace-close .privacy-line{grid-column:1;grid-row:3;margin:18px 0 0}
@media(max-width:760px){.workplace-close .privacy-line{grid-row:3}.workplace-close .close-actions{grid-row:4}}

/* Use-case closing block: portrait in the demo button, as on workplace pages */
.usecase-close .close-actions .button{display:inline-flex;align-items:center;gap:12px}
.usecase-close .close-actions .button img{width:36px;height:36px;object-fit:cover;border-radius:4px;filter:grayscale(1)}
.usecase-close .close-actions .button:has(img){padding:10px 18px 10px 10px}

/* Landing page: same wrapping across sibling cards without changing the copy */

@media(min-width:851px) and (max-width:1279px){.experience-benefits h3{font-size:16.5px}}
@media(max-width:420px){.hero-trust li{font-size:13px;letter-spacing:-.005em}}

/* Brandbook: replace the last gold accents on the landing page */
.conversation-example{color:#e6a3a3}
.conversation-wave i{background:#8aa4c4}
.experience-number{color:#b97783}
.listening-orb{background:radial-gradient(circle at 30% 27%,#f6dede 0%,#e6a3a3 26%,#b97783 44%,#58759e 66%,#192840 88%)}

/* Intermediate desktop widths: keep short sibling lines on one line */
@media(min-width:861px) and (max-width:1199px){.br-steps>li{padding:24px 18px 22px}.br-steps ul li{padding-left:18px;font-size:15px}}
@media(min-width:761px) and (max-width:1199px){.v24-footer-cols a{white-space:nowrap;font-size:13px}}
