/* Customer-supplied reviews. Preserve readable privacy notes alongside each group. */
.customer-proof-band { padding: 48px 0; border-block: 1px solid #e3dfea; background: #f5f2fc; }
.customer-proof-heading { margin-bottom: 24px; }
.customer-proof-heading h2 { margin: 8px 0 0; color: #15111d; font-size: clamp(1.8rem, 3vw, 2.6rem); line-height: 1.15; letter-spacing: -.045em; }
.customer-proof-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.customer-quote { display: flex; flex-direction: column; justify-content: space-between; gap: 24px; margin: 0; padding: 28px; min-width: 0; border: 1px solid #d7cdea; border-radius: 12px; background: #fff; color: #26202f; }
.customer-quote blockquote { margin: 0; font-size: 1rem; line-height: 1.65; }
.customer-quote figcaption { display: flex; align-items: center; gap: 12px; }
.customer-quote img { flex: 0 0 48px; border-radius: 50%; object-fit: cover; }
.customer-quote figcaption span { display: grid; gap: 3px; }
.customer-quote figcaption strong { font-size: .875rem; }
.customer-quote figcaption small { color: #655b72; font-size: .875rem; line-height: 1.5; }
.customer-quote-wide { padding: 32px; border-left: 4px solid #6437ff; }
.customer-quote-wide blockquote { max-width: 70ch; font-size: clamp(1.05rem, 1.7vw, 1.35rem); }
.customer-proof-privacy, .home-v2 .proof-privacy, .home-v2 .proof-stories-privacy { margin: 18px 0 0; color: #686071; font: .8125rem/1.6 var(--sans, sans-serif); letter-spacing: normal; text-transform: none; }
.home-v2 .proof-quote figcaption strong, .home-v2 .proof-story-card figcaption strong,
.home-v2 .proof-quote figcaption small, .home-v2 .proof-story-card figcaption small { font-size: .875rem; line-height: 1.5; }
.home-v2 .proof-story-card blockquote { font-size: 1rem; }
@media (max-width: 900px) { .customer-proof-grid { grid-template-columns: 1fr; } .customer-quote { padding: 24px; } .customer-proof-band { padding: 36px 0; } }

/* Output-first example. Shared by the homepage and Inside CreatStrat. */
.output-preview { min-width: 0; border: 1px solid #d7d3df; border-radius: 16px; background: #fff; overflow: hidden; box-shadow: 0 24px 70px #24133a12; }
.output-preview header { display: flex; align-items: center; gap: 12px; padding: 20px; border-bottom: 1px solid #e7e3ec; }
.output-preview header strong { font-size: 16px; letter-spacing: -.025em; }
.output-preview header small { display: block; margin-top: 4px; color: #686173; font-size: 12px; }
.output-wordmark { display: grid; place-items: center; width: 36px; height: 36px; background: #0c0b12; color: #ae8cff; border-radius: 8px; font-size: 24px; font-weight: 800; position: relative; }
.output-wordmark > span { position: absolute; right: 4px; bottom: 2px; color: #b9ff36; }
.output-preview-main { display: grid; grid-template-columns: 1.15fr .85fr; align-items: center; background: #f7f5ef; }
.output-preview-main > img { display: block; width: 100%; height: auto; }
.output-preview-main aside { padding: 24px; }
.output-preview-main aside > span { font: 10px/1.5 monospace; letter-spacing: .07em; color: #60576c; }
.output-preview-main h2 { font-size: clamp(20px, 2vw, 29px); line-height: 1.12; letter-spacing: -.05em; margin: 16px 0 22px; }
.output-preview dl { margin: 0; }
.output-preview dt { font: 11px/1.4 monospace; text-transform: uppercase; color: #6c607b; margin-top: 15px; }
.output-preview dd { margin: 5px 0 0; font-size: 13px; line-height: 1.5; color: #292331; }
.output-preview footer { padding: 20px; display: grid; gap: 10px; border-top: 1px solid #e7e3ec; }
.output-preview footer a { font-size: 15px; font-weight: 700; color: #6037ff; text-underline-offset: 5px; }
.output-preview footer small { font-size: 12px; line-height: 1.5; color: #6a6272; }
.audience-card > a { display: inline-flex; min-height: 44px; align-items: center; color: #6037ff; font-size: 15px; font-weight: 700; margin-top: 20px; text-underline-offset: 4px; }
.brief-work > p { font-size: 15px; line-height: 1.65; color: #56505f; }
.example-section { padding: 80px 0; background: #f7f6f2; scroll-margin-top: 110px; }
.example-heading { display: flex; align-items: end; justify-content: space-between; gap: 36px; margin-bottom: 26px; }
.example-heading h2 { margin: 12px 0 0; font-size: clamp(32px, 4vw, 50px); letter-spacing: -.055em; line-height: 1.06; }
.example-heading > p { max-width: 340px; color: #665f70; font-size: 16px; line-height: 1.65; }
.example-disclosure { padding: 13px 17px; background: #efebfb; border-left: 3px solid #6037ff; color: #574a6a; font-size: 13px; line-height: 1.6; }
.example-showcase { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; margin-top: 30px; align-items: start; }
.example-showcase figure { margin: 0; position: sticky; top: 110px; }
.example-showcase figure img { width: 100%; height: auto; display: block; border-radius: 12px; }
.example-showcase figcaption { padding: 14px 0; color: #6e6479; font: 14px/1.5 var(--sans, sans-serif); }
.example-artwork { display: grid; place-items: center; border: 1px solid #d7d3df; border-radius: 12px; overflow: hidden; background: #fff; }
.example-showcase .example-artwork img { max-height: 700px; width: 100%; height: auto; object-fit: contain; border-radius: 0; }
.ad-example-tabs:not([hidden]) { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin: 30px 0 0; }
.ad-example-tabs button { display: grid; gap: 5px; align-content: center; min-height: 78px; padding: 14px 16px; border: 1px solid #d7d3df; border-radius: 10px; background: #fff; color: #292331; text-align: left; font: inherit; cursor: pointer; }
.ad-example-tabs button span { font-size: 16px; font-weight: 700; }
.ad-example-tabs button small { font-size: 12px; letter-spacing: .02em; color: #686173; }
.ad-example-tabs button[aria-selected="true"] { background: #15111d; border-color: #15111d; color: #fff; box-shadow: inset 0 -3px #b9ff36; }
.ad-example-tabs button[aria-selected="true"] small { color: #d3c9e3; }
.ad-example-tabs button:hover:not([aria-selected="true"]) { border-color: #6037ff; background: #f1edff; }
.ad-example-tabs button:focus-visible, .niche-example-card:focus-visible, .niche-example-grid:focus-visible, [data-example-panel]:focus-visible { outline: 3px solid #6037ff; outline-offset: 4px; }
.example-status { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.example-brief .example-copy-note { font-size: 13px; color: #6e6479; line-height: 1.6; margin: 18px 0 0; }
.niche-examples { padding: 72px 0; background: #f7f6f2; color: #15111d; border-block: 1px solid #e3dfea; scroll-margin-top: 100px; }
.niche-examples-heading { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 32px; }
.niche-examples-heading h2 { margin: 12px 0 0; font-size: clamp(30px, 3.5vw, 46px); line-height: 1.08; letter-spacing: -.045em; }
.niche-examples-heading > p { max-width: 330px; margin: 0; font-size: 16px; line-height: 1.65; color: #665f70; }
.niche-example-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }
.niche-example-card { display: flex; flex-direction: column; min-width: 0; border: 1px solid #d7d3df; border-radius: 12px; background: #fff; color: #15111d; text-decoration: none; overflow: hidden; }
.niche-example-card:hover { border-color: #6037ff; box-shadow: 0 8px 24px #24133a0d; }
.niche-category { display: block; padding: 12px 14px; font-size: 14px; font-weight: 700; border-bottom: 1px solid #e3dfea; }
.niche-artwork { aspect-ratio: 4 / 5; background: #fff; overflow: hidden; }
.niche-artwork img { display: block; width: 100%; height: 100%; object-fit: contain; }
.niche-card-copy { display: flex; flex-direction: column; flex: 1; padding: 16px 14px; border-top: 1px solid #e3dfea; }
.niche-card-copy small { color: #686173; font-size: 12px; line-height: 1.5; }
.niche-card-copy h3 { margin: 12px 0 20px; font-size: 18px; line-height: 1.3; letter-spacing: -.025em; }
.niche-card-copy > span { margin-top: auto; color: #6037ff; font-size: 14px; font-weight: 650; line-height: 1.5; }
@media (max-width: 1050px) { .niche-example-grid { display: flex; overflow-x: auto; scroll-snap-type: x proximity; padding: 4px 4px 18px; margin: -4px; } .niche-example-card { flex: 0 0 245px; scroll-snap-align: start; } .niche-examples-heading { align-items: start; flex-direction: column; gap: 18px; } .niche-examples-heading > p { max-width: 600px; } }
@media (max-width: 700px) { .ad-example-tabs:not([hidden]) { display: flex; overflow-x: auto; gap: 8px; padding: 4px 4px 14px; margin: 24px -4px 0; } .ad-example-tabs button { flex: 0 0 142px; } .niche-examples { padding: 48px 0; } }
.example-brief { color: #272330; font-size: 16px; line-height: 1.65; }
.example-brief h3 { font-size: 30px; line-height: 1.18; letter-spacing: -.04em; margin: 12px 0 20px; }
.example-brief dl { margin: 0 0 20px; }
.example-brief dt { margin-top: 18px; font-size: 14px; color: #71647f; font-weight: 650; }
.example-brief dd { margin: 3px 0 0; }
.example-brief details { border-top: 1px solid #d7d3df; padding: 18px 0; }
.example-brief summary { cursor: pointer; font-weight: 650; min-height: 32px; }
.example-brief details p { margin: 12px 0 0; color: #62576f; }
.example-offers { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 36px; }
.example-offers article { padding: 28px; border: 1px solid #d7d3df; background: #fff; border-radius: 12px; }
.example-offers article > span { color: #6037ff; font: 11px/1.5 monospace; }
.example-offers h3 { font-size: 24px; letter-spacing: -.035em; margin: 12px 0; }
.example-offers p { color: #665f70; font-size: 16px; line-height: 1.65; }
.example-offers a { display: inline-flex; align-items: center; min-height: 44px; color: #6037ff; font-size: 15px; font-weight: 650; text-underline-offset: 4px; }
.hero-plan-choices a.finished-ads-choice { border-color: #6037ff; background: #f1edff; }
.example-offers .finished-offer { border-color: #6037ff; background: #f1edff; }
.production-paths { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.home-v2 .pricing-options.pricing-three { max-width: none; grid-template-columns: .88fr 1fr 1.14fr; gap: 24px; align-items: start; }
.pricing-three .price-card { padding: 26px; min-width: 0; }
.pricing-three .price-card-head { align-items: flex-start; flex-direction: column; gap: 12px; margin-bottom: 22px; }
.pricing-three .price-kicker { font-size: 22px; line-height: 1.15; }
.pricing-three .plan-includes { margin: 22px 0; }
.pricing-three .plan-includes li { font-size: 14px; line-height: 1.6; }
.pricing-three .strategy-card { border-color: #45404f; box-shadow: 8px 8px 0 #251a56; }
.pricing-three .finished-plan-card { border: 2px solid var(--lime); box-shadow: 8px 8px 0 var(--lime); background: #101016; }
.finished-plan-card .plan-badge { color: #101016; background: var(--lime); }
.finished-plan-card > p, .pricing-three .plan-summary { margin: 10px 0 20px; color: #c2bbcd; font-size: 14px; line-height: 1.6; }
.pricing-three .price { flex-wrap: wrap; gap: 8px; }
.pricing-three .price strong { font-size: clamp(42px, 4vw, 62px); }
.pricing-three .price span { font-size: 14px; }
.pricing-three .briefs-only-control { display: grid; grid-template-columns: 1fr; padding: 18px; margin: 0; }
.pricing-three .briefs-only-control label, .pricing-three .briefs-only-control input[type=range] { grid-column: 1; }
.finished-plan-form { display: grid; gap: 12px; margin-top: 4px; }
.finished-plan-form input, .finished-plan-form select, .multi-brand-request input, .multi-brand-request select, .multi-brand-request textarea { width: 100%; min-width: 0; min-height: 48px; border: 1px solid #51485f; border-radius: 8px; background: #19151f; color: #fff; padding: 12px; font: inherit; font-size: 14px; }
.finished-plan-form input::placeholder, .multi-brand-request input::placeholder, .multi-brand-request textarea::placeholder { color: #b6afc1; opacity: 1; }
.finished-plan-form label, .multi-brand-request label { font-size: 13px; line-height: 1.6; color: #d7cfe3; }
.finished-plan-form > label { display: grid; gap: 8px; }
.finished-plan-form .production-volume-summary { color: var(--lime); font-size: 16px; font-weight: 700; margin: 2px 0; }
.finished-plan-form .mix-guidance, .finished-plan-form > [role=status] { color: #bbb2cb; font-size: 12px; line-height: 1.7; margin: 0; }
.finished-plan-form > [data-production-plan-message]:empty { display: none; }
.finished-plan-form .plan-includes { margin: 12px 0; }
.finished-plan-form .btn { width: 100%; white-space: normal; }
.finished-plan-form .production-sliders { grid-template-columns: 1fr; gap: 22px; min-width: 0; padding: 18px; margin: 0; }
.production-sliders legend { padding: 0 6px; color: #fff; font-size: 14px; font-weight: 650; }
.format-slider { display: grid; gap: 12px; min-width: 0; }
.format-slider-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.finished-plan-form .format-slider .mix-quantity { flex: 0 0 5rem; width: 5rem; min-height: 36px; padding: 6px; background: var(--lime); color: #101016; border-color: transparent; text-align: center; font-family: var(--mono); font-weight: 700; }
.production-sliders .format-slider label { display: flex; grid-column: auto; grid-row: auto; font-size: 14px; }
.finished-plan-form .format-slider input[type=range] { min-height: 0; height: 6px; padding: 0; border: 0; margin: 3px 0; cursor: pointer; }
.format-slider small { color: #bbb2cb; font-size: 12px; text-align: right; line-height: 1.4; }
.price-card .plan-billing-label { margin: 24px 0 4px; color: #cfc6df; font-size: 14px; }
.price-card .plan-cadence { margin: 12px 0 24px; padding: 16px 0; border-block: 1px solid #3a3349; }
.price-card .plan-cadence .plan-delivery-summary { margin: 0 0 8px; color: #fff; font-size: 16px; font-weight: 600; }
.price-card .plan-cadence > p:last-child { margin: 0; color: #cfc6df; font-size: 14px; line-height: 1.5; }
.multi-brand-request { margin: 42px auto 0; padding: 24px; max-width: 900px; background: #23154b; border: 1px solid #a186ff; border-radius: 12px; color: #fff; }
.multi-brand-request summary { font-size: 18px; font-weight: 650; cursor: pointer; line-height: 1.5; }
.multi-brand-request-body { margin-top: 24px; }
.multi-brand-request-body p { color: #e0d8f2; font-size: 15px; line-height: 1.7; }
.multi-brand-request-body a { color: #d2c2ff; text-underline-offset: 4px; }
.multi-brand-request form { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 24px; }
.multi-brand-request form > label { display: grid; gap: 7px; }
.multi-brand-request .full-width, .multi-brand-request form > [role=status], .multi-brand-request form > button { grid-column: 1 / -1; }
.multi-brand-request form > small { color: #d7cfe3; line-height: 1.7; }
.pricing-three :is(input, select, button, a):focus-visible, .multi-brand-request :is(input, select, textarea, summary):focus-visible { outline: 2px solid var(--lime); outline-offset: 3px; }
@media (max-width: 1100px) { .home-v2 .pricing-options.pricing-three { max-width: 700px; grid-template-columns: 1fr; gap: 30px; } .pricing-three .price-card-head { flex-direction: row; align-items: center; } .production-paths { grid-template-columns: repeat(3, minmax(0, 1fr)); } .production-paths article:nth-child(3) { border-left: 1px solid #d7d3df; border-top: 0; } }
@media (max-width: 700px) { .production-paths { grid-template-columns: 1fr; } .production-paths article:nth-child(3) { border-left: 0; border-top: 1px solid #d7d3df; } .multi-brand-request form { grid-template-columns: 1fr; } }
@media (max-width: 440px) { .pricing-three .price-card { padding: 22px; } .pricing-three .price-card-head { align-items: flex-start; flex-direction: column; } }
@media (max-width: 860px) { .output-preview { max-width: 640px; width: 100%; margin: 0 auto; } .example-showcase { gap: 28px; } .example-heading { align-items: start; flex-direction: column; gap: 12px; } .example-heading > p { max-width: 600px; } }
@media (max-width: 600px) { .home-v2 .hero-copy h1 { font-size: clamp(40px, 10.5vw, 56px); line-height: .98; max-width: 480px; } .output-preview-main { grid-template-columns: 1fr 1fr; } .output-preview-main aside { padding: 18px; } .output-preview-main h2 { font-size: 22px; } .output-preview dt { margin-top: 12px; } .example-section { padding: 50px 0; } .example-showcase, .example-offers { grid-template-columns: 1fr; gap: 24px; } .example-showcase figure { position: static; } }
@media (max-width: 380px) { .output-preview-main { grid-template-columns: 1fr; } .output-preview-main aside { padding: 20px; } .output-preview-main dl { display: grid; grid-template-columns: 74px 1fr; gap: 12px; } .output-preview dt, .output-preview dd { margin: 0; } }