/* GetAttn: make researched outbound visible through the work it produces. */
.buyer-site { --muted:#bfc4bf; background:var(--paper); color:var(--ink); }
.buyer-site .header,.buyer-site .mobile-nav { background:var(--ink); color:var(--paper); }
.buyer-site .header { max-width:none; padding-inline:max(var(--pad),calc((100% - 1200px)/2)); height:88px; }
.buyer-site .header nav { gap:25px; }
.buyer-site .eyebrow { font-size:13px; letter-spacing:.1em; text-transform:uppercase; }
.buyer-site p { text-wrap:pretty; }
.buyer-site h1,.buyer-site h2,.buyer-site h3 { text-wrap:balance; }
.buyer-site .section { padding:92px 0; }
.buyer-site .section-heading>p:not(.eyebrow) { max-width:650px; line-height:1.65; }
.buyer-site .text-link,.buyer-site .source-link { min-height:34px; }
.buyer-hero { background:var(--ink); color:var(--paper); padding:48px 0 0; overflow:hidden; position:relative; isolation:isolate; }
.buyer-hero-grid { display:grid; grid-template-columns:1.08fr 1fr; gap:6%; align-items:center; min-height:440px; }
.buyer-hero h1 { font-size:clamp(48px,5vw,75px); line-height:1.06; letter-spacing:-.055em; font-weight:500; margin:22px 0; }
.buyer-hero h1>span { display:block; color:#c4cec3; }
.buyer-hero .hero-body { max-width:510px; color:var(--muted); font-size:18px; line-height:1.65; }
.buyer-hero .hero-actions { display:flex; gap:24px; flex-wrap:wrap; align-items:center; justify-content:flex-start; margin-top:28px; }
.watch-link { display:inline-flex; align-items:center; gap:11px; color:inherit; background:none; font:inherit; font-size:15px; padding:10px 0; }
.watch-link .icon { width:18px; height:18px; }
.buyer-hero .hero-credential { margin-top:25px; font-size:13px; }
.buyer-hero .client-strip { margin-top:44px; padding:25px 0 30px; gap:60px; }
.buyer-hero .client-strip>p { font-size:13px; }
.buyer-hero .client-strip>div { display:flex; align-items:center; gap:45px; }
.buyer-hero .client-strip img { max-height:28px; }
/* Four views of one illustrative buyer journey. Text is DOM, never canvas. */
.buyer-story { perspective:1000px; position:relative; min-width:0; }
.story-shell { border:1px solid #f7f5ef30; padding:8px; border-radius:22px; box-shadow:0 25px 70px #0004; background:#ffffff06; }
.story-top { display:flex; justify-content:space-between; gap:20px; align-items:center; padding:10px 15px 16px; color:#c7cdc6; font-size:12px; }
.story-top img { width:30px; height:30px; }
.story-panels { position:relative; min-height:350px; overflow:hidden; background:var(--paper); color:var(--ink); border-radius:14px; }
.story-panel { padding:29px 27px; min-height:350px; }
.story-panel[hidden] { display:block!important; visibility:hidden; pointer-events:none; }
.story-panel> .eyebrow { font-size:12px; color:#657062; margin-bottom:13px; }
.story-panel h2 { font-size:29px; line-height:1.15; letter-spacing:-.035em; margin:0 0 12px; }
.story-panel>p:not(.eyebrow) { font-size:15px; line-height:1.5; color:#586055; margin-bottom:18px; }
.scene-ui { display:flex; flex-direction:column; gap:7px; }
.scene-row { display:flex; align-items:center; gap:13px; padding:10px 12px; background:white; border:1px solid #19201c17; border-radius:7px; min-height:41px; font-size:13px; box-shadow:0 4px 10px #19201c05; }
.scene-row>.icon { width:17px; height:17px; color:#63755c; }
.scene-row:last-child { border-color:#84967a; }
.scene-ui.message-ui { border:1px solid #19201c21; border-radius:8px; padding:10px; background:white; }
.message-ui .scene-row { padding:8px 3px; border:0; box-shadow:none; min-height:28px; }
.message-ui .scene-row+.scene-row { border-top:1px solid #19201c12; border-radius:0; }
.account-record { display:flex; align-items:center; gap:15px; padding:19px; border:1px solid #19201c25; border-radius:10px; background:white; position:relative; z-index:2; box-shadow:0 5px 20px #19201c0a; }
.account-record strong { font-size:16px; font-weight:500; line-height:1.4; max-width:240px; }
.account-icon { width:44px; height:44px; display:grid; place-items:center; background:var(--ink); color:var(--paper); border-radius:9px; flex-shrink:0; }
.account-icon .icon { width:25px; height:25px; }
.profile-fields { margin:-7px 12px 0; padding:8px 12px; background:#eeede7; border:1px solid #19201c17; border-radius:0 0 10px 10px; }
.profile-fields .scene-row { padding:8px 0; min-height:32px; background:none; border:0; border-radius:0; box-shadow:none; font-size:13px; }
.signal-inputs { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.signal-card { padding:16px; border-radius:9px; border:1px solid #19201c21; background:white; min-height:91px; display:flex; flex-direction:column; gap:12px; box-shadow:0 7px 20px #19201c08; }
.signal-card span { font-size:14px; line-height:1.4; }
.signal-card .icon { width:21px; height:21px; }
.signal-connector { height:37px; margin-top:-7px; }
.signal-connector svg { width:100%; height:100%; overflow:visible; }
.signal-connector path { fill:none; stroke:#829279; stroke-width:1.2; stroke-dasharray:400; stroke-dashoffset:0; }
.signal-output { display:flex; align-items:center; gap:15px; padding:18px; border-radius:8px; color:var(--paper); background:var(--ink); font-size:14px; }
.signal-output img { width:24px; height:24px; }
.scene-2 { background:white; border:1px solid #19201c26; border-radius:11px; box-shadow:0 10px 25px #19201c0b; gap:0; }
.draft-header { display:flex; align-items:center; gap:10px; padding:14px 16px; border-bottom:1px solid var(--edge); font-size:13px; }
.draft-dots { margin-left:auto; letter-spacing:3px; }
.draft-body { padding:20px 17px; min-height:81px; }
.draft-body p { font-size:15px; line-height:1.5; padding-block:3px; }
.draft-footer { display:flex; align-items:center; gap:10px; padding:14px 16px; background:#eeede7; font-size:13px; border-radius:0 0 10px 10px; }
.draft-footer>.icon:last-child { margin-left:auto; }
.interest-start { display:flex; align-items:center; gap:13px; padding:15px 18px; border-radius:9px; border:1px solid #19201c25; background:white; font-size:15px; }
.handoff-path { display:flex; align-items:center; gap:14px; margin-top:10px; }
.handoff-node { flex:1; padding:16px 14px; min-height:100px; border:1px solid #19201c21; border-radius:9px; background:white; display:flex; flex-direction:column; gap:13px; font-size:14px; line-height:1.35; }
.handoff-node:last-child { background:var(--ink); color:var(--paper); }
.timing-alternative { font-size:12px; color:#596650; padding:8px 0 0; }
.story-panel.is-entering .account-record { animation:account-focus .8s both; }
.story-panel.is-entering .signal-card { animation:research-arrive .7s both; animation-delay:calc(var(--row)*160ms); }
.story-panel.is-entering .signal-connector path { animation:signal-draw .85s .2s both; }
.story-panel.is-entering .signal-output { animation:service-row-in .7s .45s both; }
.story-panel.is-entering .draft-body p { animation:message-send .7s both; animation-delay:calc(var(--row)*170ms); }
.story-panel.is-entering .draft-footer { animation:handoff-arrive .65s .4s both; }
.story-panel.is-entering .interest-start { animation:message-send .6s both; }
.story-panel.is-entering .handoff-node { animation:handoff-arrive .7s .2s both; }
.story-panel.is-entering .handoff-node:last-child { animation-delay:.45s; }
@keyframes account-focus { from { opacity:.2; transform:translateY(18px) rotate(-3deg) scale(.94); } to { opacity:1; transform:none; } }
@keyframes signal-draw { from { stroke-dashoffset:400; } to { stroke-dashoffset:0; } }
.story-panel.is-entering { animation:story-panel-in .5s cubic-bezier(.2,.7,.2,1) both; }
.story-panel.is-entering .scene-row { animation:research-arrive .55s cubic-bezier(.2,.7,.2,1) both; animation-delay:calc(var(--row)*80ms); }
.story-tabs { display:grid; grid-template-columns:repeat(4,1fr); gap:4px; margin-top:9px; }
.story-tabs button { background:none; border-radius:9px; padding:15px 3px; font-size:13px; color:#a8b0a6; position:relative; }
.story-tabs button:before { content:''; position:absolute; top:0; left:10%; width:80%; height:2px; background:#f7f5ef24; border-radius:3px; }
.story-tabs button[aria-selected=true] { color:var(--paper); background:#ffffff09; }
.story-tabs button[aria-selected=true]:before { background:var(--paper); transform:scaleX(var(--stage-progress,0)); transform-origin:left; }
.story-note { margin:17px 12px 0; color:#acb4a9; line-height:1.5; font-size:12px; max-width:430px; }
/* An early founder overview and selected client evidence make separate claims. */
.overview-section { border-bottom:1px solid var(--edge); }
.overview-grid { display:grid; grid-template-columns:.9fr 1fr; gap:9%; align-items:center; }
.overview-copy h2 { margin:19px 0 22px; max-width:500px; }
.overview-copy>p:not(.eyebrow) { font-size:18px; line-height:1.65; color:#576153; }
.overview-copy .vsl-context { font-size:13px!important; margin-top:20px; }
.vsl-poster { width:100%; position:relative; border-radius:16px; background:var(--ink); overflow:hidden; aspect-ratio:16/10; color:var(--paper); box-shadow:0 15px 40px #19201c15; }
.vsl-poster>img { width:100%; height:100%; object-fit:cover; object-position:center; }
.vsl-poster:after { content:''; position:absolute; inset:45% 0 0; background:linear-gradient(transparent,#000b); }
.vsl-poster .play-button { z-index:2; }
.vsl-poster .watch-label { position:absolute; bottom:20px; left:25px; z-index:3; }
.buyer-site .proof-section { background:#fff; padding-top:90px; }
.buyer-site .primary-proof { gap:25px; }
.buyer-site .primary-proof .video-card { background:var(--paper); }
.buyer-site .primary-proof .metric-card { background:var(--ink); color:var(--paper); }
.buyer-site .metric-card .card-meta,.buyer-site .metric-card .range,.buyer-site .metric-card .metric-note { color:#bbc4b8; }
.buyer-site .metric-card .metric-values { border-color:#ffffff24; }
.buyer-site .proof-bottom { display:flex; justify-content:space-between; gap:25px; margin-top:26px; border-top:1px solid var(--edge); padding-top:20px; }
.buyer-site .video-copy blockquote { font-size:29px; }
.buyer-site .metric-card .client-logo { filter:none; }
.buyer-site .metric-card .source-link { color:inherit; }
/* Explain client-visible deliverables, with a distinct functional scene per row. */
.buyer-problem { background:var(--ink); color:var(--paper); }
.buyer-problem .section-heading { margin-bottom:42px; }
.problem-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:40px; }
.problem-grid article { border-top:1px solid #ffffff38; padding-top:26px; }
.problem-grid h3 { font-size:24px; line-height:1.2; margin-bottom:14px; }
.problem-grid p { color:#bfc7bc; font-size:16px; line-height:1.65; }
.service-row { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:9%; padding:55px 0; border-top:1px solid var(--edge); }
.service-row:nth-of-type(even) .service-visual { order:-1; }
.service-copy h3 { font-size:36px; line-height:1.12; letter-spacing:-.04em; margin-bottom:20px; }
.service-copy>p { color:#566251; font-size:17px; line-height:1.65; }
.service-copy ul { margin-top:22px; padding:0; list-style:none; }
.service-copy li { display:flex; gap:11px; align-items:flex-start; font-size:15px; margin-top:12px; }
.service-copy li>.icon { width:18px; height:18px; margin-top:2px; }
.service-visual { padding:35px; min-height:290px; background:white; border-radius:18px; border:1px solid #19201c16; position:relative; display:flex; flex-direction:column; justify-content:center; overflow:hidden; box-shadow:0 15px 35px #19201c07; }
.service-visual .visual-heading { display:flex; align-items:center; gap:12px; margin-bottom:23px; font-size:15px; }
.service-visual .visual-heading>.icon { width:24px; height:24px; }
.service-visual .visual-heading>img { width:31px; height:31px; }
.service-visual .visual-heading>svg[role=img] { width:54px; height:31px; flex:none; }
.service-visual .visual-heading>img[src$="getattn-symbol.svg"] { background:var(--ink); padding:6px; width:35px; height:35px; border-radius:6px; }
.service-visual .scene-row { background:var(--paper); padding:13px 15px; margin-bottom:8px; min-height:45px; font-size:14px; }
.service-visual[data-service=message] .scene-row { transform:translateX(0); }
.service-visual[data-service=handoff] .scene-row:last-child { color:var(--paper); background:var(--ink); }
.service-visual.is-revealed .scene-row { animation:service-row-in .8s cubic-bezier(.2,.7,.2,1) both; animation-delay:calc(var(--row)*170ms); }
.service-visual[data-service=message].is-revealed .scene-row { animation-name:message-send; }
.service-visual[data-service=handoff].is-revealed .scene-row { animation-name:handoff-arrive; }
.services-section .tools-row { border-top:1px solid var(--edge); margin-top:20px; padding-top:36px; display:flex; justify-content:space-between; align-items:center; gap:35px; }
.services-section .tools-row>p { color:#52604b; font-size:14px; }
.services-section .tools-row>div { display:flex; flex-wrap:wrap; align-items:center; gap:35px; }
.services-section .tools-row .tool-logo { filter:none; opacity:1; max-width:155px; height:31px; }
.services-section .tools-row svg.tool-logo { width:62px; height:35px; }
.services-section .tools-row img[alt="Claude Code"] { width:153px; height:34px; }
.services-section .tools-row .codex-lockup img { width:30px; height:30px; }
.services-section .tools-row .codex-lockup span { font-size:23px; }
.responsibility-band { border-top:1px solid var(--edge); margin-top:48px; padding-top:35px; display:grid; grid-template-columns:1.15fr 1fr 1fr; gap:35px; }
.responsibility-band h3 { font-size:26px; line-height:1.17; }
.responsibility-band h4 { font-size:15px; margin-bottom:18px; }
.responsibility-band p { font-size:14px; color:#566251; line-height:1.65; margin-top:8px; }
/* The work library and case narratives are native pages. */
.work-section { background:var(--ink); color:var(--paper); }
.work-section .section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:30px; }
.case-library { display:grid; grid-template-columns:repeat(2,1fr); gap:23px; }
.case-teaser { display:flex; flex-direction:column; background:#ffffff05; border:1px solid #ffffff25; border-radius:15px; overflow:hidden; color:inherit; }
.case-teaser .case-image { height:225px; overflow:hidden; background:#f0efea; padding:22px; display:flex; align-items:center; justify-content:center; }
.case-teaser .case-image img { width:100%; height:100%; object-fit:contain; transition:transform .35s; }
.case-teaser:hover .case-image img { transform:scale(1.025); }
.case-teaser .case-copy { padding:26px; display:flex; flex-direction:column; flex:1; }
.case-teaser .eyebrow { color:#adb9a7; font-size:12px; margin-bottom:14px; }
.case-teaser h3 { font-size:29px; line-height:1.16; letter-spacing:-.03em; margin-bottom:16px; }
.case-teaser p { font-size:15px; line-height:1.6; color:#b7c0b2; margin-bottom:22px; }
.case-teaser .text-link { margin-top:auto; }
.library-intro { padding:60px 0 70px; background:var(--ink); color:var(--paper); }
.library-intro h1 { max-width:850px; font-size:clamp(48px,6vw,78px); line-height:1.05; letter-spacing:-.05em; margin:25px 0; }
.library-intro>div>p:last-child { max-width:690px; font-size:18px; line-height:1.6; color:#c0c8bb; }
.case-page .case-hero { background:var(--ink); color:var(--paper); padding:45px 0 75px; }
.case-hero .back-case { font-size:14px; color:#bbc6b5; margin-bottom:38px; display:inline-flex; }
.case-hero h1 { max-width:1000px; font-size:clamp(46px,5.2vw,72px); line-height:1.08; letter-spacing:-.045em; margin:22px 0; }
.case-hero p:not(.eyebrow) { max-width:780px; color:#c2cbbe; font-size:19px; line-height:1.65; }
.case-hero .case-client-logo { width:165px; max-height:48px; object-fit:contain; object-position:left; margin-bottom:25px; }
.case-layout { display:grid; grid-template-columns:220px 1fr; gap:9%; }
.case-sidebar { position:sticky; top:35px; height:max-content; border-top:1px solid var(--edge); padding-top:22px; }
.case-sidebar .eyebrow { margin-bottom:20px; }
.case-sidebar a { display:block; font-size:15px; margin-bottom:15px; line-height:1.4; }
.case-body>section { margin-bottom:50px; }
.case-body h2 { font-size:36px; margin-bottom:20px; }
.case-body p,.case-body li { font-size:18px; line-height:1.75; color:#485343; }
.case-body p+p { margin-top:18px; }
.case-body ul { padding-left:22px; }
.case-body li { margin-bottom:12px; }
.case-evidence { padding-top:30px; border-top:1px solid var(--edge); }
.case-evidence .video-card { max-width:650px; }
.case-evidence .proof-card { margin-top:25px; }
.case-evidence .screenshot-preview { margin-top:25px; }
.case-source { font-size:14px!important; border-top:1px solid var(--edge); padding-top:20px; }
.case-method-graphic { background:white; border:1px solid var(--edge); border-radius:12px; padding:28px; display:flex; align-items:center; gap:22px; }
.case-method-graphic { color:var(--ink); }
.case-method-graphic>svg[role=img] { width:115px; height:70px; flex:none; }
.case-method-graphic img { max-width:120px; max-height:70px; object-fit:contain; }
.buyer-site .about-section { background:var(--paper); }
.buyer-site .about-portrait { aspect-ratio:1/1.07; }
.buyer-site .about-copy p { font-size:20px; line-height:1.65; }
.buyer-site .about-copy .founder-name { margin-top:26px; }
.buyer-site .founder-credential .credential-clay { filter:none; }
.faq-section { background:#fff; }
.faq-grid { display:grid; grid-template-columns:.85fr 1fr; gap:10%; }
.faq-grid h2 { margin-top:20px; }
.faq-list details { padding:24px 0; border-bottom:1px solid var(--edge); }
.faq-list details:first-child { border-top:1px solid var(--edge); }
.faq-list summary { display:flex; justify-content:space-between; gap:25px; cursor:pointer; list-style:none; font-size:19px; line-height:1.4; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary:after { content:'+'; font-size:24px; line-height:1; }
.faq-list details[open] summary:after { content:'−'; }
.faq-list details p { padding-top:17px; color:#5b6556; font-size:16px; line-height:1.7; }
.buyer-site .closing-section { background:var(--ink); color:var(--paper); position:relative; }
.buyer-site .closing-section .wrap>p:not(.eyebrow) { max-width:520px; }
.buyer-site .footer { background:var(--ink); color:var(--paper); border-top:1px solid #ffffff21; }
.buyer-site.wall-page .wall-intro { background:var(--ink); color:var(--paper); width:100%; padding-inline:20px; }
.wall-library-link { display:flex; justify-content:flex-end; margin:0 0 24px; }
.buyer-site .wall-grid .case-teaser { break-inside:avoid; margin-bottom:24px; background:var(--ink); color:var(--paper); }
.buyer-site .wall-grid .case-teaser .case-image { height:160px; }
.buyer-site .wall-grid .case-teaser h3 { font-size:27px; }
.buyer-site button:focus-visible,.buyer-site a:focus-visible,.buyer-site summary:focus-visible { outline:3px solid #809a70; outline-offset:5px; }
@keyframes story-panel-in { from { opacity:0; transform:translateX(30px) rotateY(-5deg); } to { opacity:1; transform:none; } }
@keyframes research-arrive { from { opacity:0; transform:translate(24px,8px); } to { opacity:1; transform:none; } }
@keyframes service-row-in { from { opacity:.1; transform:translateY(26px) rotateX(12deg); } to { opacity:1; transform:none; } }
@keyframes message-send { from { opacity:.1; transform:translateX(-45px); } to { opacity:1; transform:none; } }
@keyframes handoff-arrive { from { opacity:.1; transform:translateY(-24px) scale(.94); } to { opacity:1; transform:none; } }
@media(min-width:1550px) { .buyer-hero { padding-top:60px; }.buyer-hero-grid { min-height:470px; } }
@media(max-width:1100px) { .buyer-hero-grid { gap:5%; }.buyer-hero h1 { font-size:55px; }.story-panel { padding:24px 22px; }.story-panel h2 { font-size:27px; }.story-tabs button { font-size:12px; }.buyer-site .header nav { gap:18px; }.overview-grid { gap:6%; }.case-layout { grid-template-columns:170px 1fr; gap:6%; } }
@media(max-width:850px) { .buyer-site .header { height:80px; }.buyer-site .mobile-nav { top:80px; }.buyer-site .header nav { display:none; }.buyer-site .menu-toggle { display:block; }.buyer-hero-grid { grid-template-columns:1fr; gap:45px; }.buyer-hero h1 { max-width:650px; font-size:64px; }.buyer-hero .hero-body { max-width:630px; }.buyer-story { max-width:600px; width:100%; }.story-panels,.story-panel { min-height:330px; }.buyer-hero .client-strip { margin-top:42px; }.overview-grid { grid-template-columns:1fr 1fr; gap:35px; }.overview-copy h2 { font-size:39px; }.problem-grid { gap:25px; }.problem-grid h3 { font-size:22px; }.service-row { gap:6%; }.service-copy h3 { font-size:31px; }.service-visual { padding:24px; }.responsibility-band { grid-template-columns:1fr 1fr; }.responsibility-band>h3 { grid-column:1/-1; }.case-sidebar { display:none; }.case-layout { grid-template-columns:1fr; }.faq-grid { grid-template-columns:1fr; gap:40px; } }
@media(max-width:600px) { .buyer-site .section { padding:62px 0; }.buyer-site .header { padding-inline:22px; }.buyer-hero { padding-top:32px; }.buyer-hero h1 { font-size:clamp(42px,11vw,58px); line-height:1.08; margin:18px 0; }.buyer-hero .eyebrow { font-size:12px; }.buyer-hero .hero-body { font-size:17px; }.buyer-hero .hero-actions { gap:22px; margin-top:23px; }.buyer-hero-grid { gap:35px; }.buyer-hero .hero-credential { font-size:12px; }.story-top { font-size:12px; padding:9px 9px 15px; }.story-top img { width:23px; height:23px; }.story-panel { padding:24px 19px; }.story-panel h2 { font-size:27px; }.story-panel>p:not(.eyebrow) { font-size:14px; }.story-panels,.story-panel { min-height:350px; }.scene-row { font-size:13px; padding:10px; gap:9px; }.story-tabs button { font-size:12px; padding:14px 2px; }.story-note { margin-top:14px; font-size:12px; }.buyer-hero .client-strip { flex-direction:column; align-items:flex-start; gap:20px; padding-block:24px; }.buyer-hero .client-strip>div { gap:38px; }.overview-grid { grid-template-columns:1fr; gap:30px; }.overview-copy h2 { font-size:39px; }.overview-copy>p:not(.eyebrow) { font-size:17px; }.vsl-poster { aspect-ratio:16/10; }.buyer-site .primary-proof .video-copy blockquote { font-size:27px; }.buyer-site .proof-bottom { flex-direction:column; gap:12px; }.problem-grid { grid-template-columns:1fr; gap:26px; }.problem-grid h3 { font-size:25px; }.problem-grid article { padding-top:22px; }.service-row { grid-template-columns:1fr; gap:30px; padding:35px 0; }.service-row .service-visual,.service-row:nth-child(even) .service-visual { order:2; }.service-copy h3 { font-size:33px; }.service-visual { min-height:265px; padding:24px; }.services-section .tools-row { flex-direction:column; align-items:flex-start; gap:23px; }.services-section .tools-row>div { gap:22px 30px; }.responsibility-band { gap:28px; margin-top:36px; padding-top:28px; }.responsibility-band h3 { font-size:27px; }.responsibility-band p { font-size:14px; }.case-library { grid-template-columns:1fr; gap:24px; }.work-section .section-heading { flex-direction:column; align-items:flex-start; gap:20px; }.case-teaser .case-image { height:190px; }.case-teaser .case-copy { padding:24px; }.case-teaser h3 { font-size:29px; }.library-intro { padding:40px 0 52px; }.library-intro h1 { font-size:50px; }.library-intro>div>p:last-child { font-size:17px; }.case-page .case-hero { padding:30px 0 52px; }.case-hero h1 { font-size:43px; }.case-hero p:not(.eyebrow) { font-size:17px; }.case-hero .back-case { margin-bottom:28px; }.case-body h2 { font-size:33px; }.case-body p,.case-body li { font-size:17px; }.buyer-site .about-copy p { font-size:19px; }.faq-list summary { font-size:18px; }.faq-list details p { font-size:16px; }.buyer-site .closing-section h2 { font-size:48px; } }
@media(max-width:850px) { .story-panels,.story-panel { min-height:350px; } }
@media(max-width:600px) { .service-row:nth-of-type(even) .service-visual { order:2; } }
@media(max-width:600px) { .story-panels,.story-panel { min-height:365px; }.signal-card { padding:14px; }.signal-inputs { gap:12px; }.handoff-path { gap:8px; }.handoff-node { font-size:13px; padding:14px 12px; }.account-record { padding:14px; }.account-record strong { font-size:14px; } }
@media(prefers-reduced-motion:reduce) { .story-panel,.story-panel *,.scene-row,.case-teaser img { animation:none!important; transition:none!important; transform:none!important; }.buyer-site html { scroll-behavior:auto; } }
/* A quiet moving relief supports the story; the foreground stays crisp. */
.hero-ambient { position:absolute; inset:-110px -15% -100px 21%; z-index:-1; opacity:.22; pointer-events:none; mask-image:linear-gradient(90deg,transparent,#000 30%,#000 85%,transparent); }
.hero-ambient canvas,.hero-ambient>img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; }
.hero-ambient canvas { opacity:0; transition:opacity .8s; }
.hero-ambient[data-scene=ready] canvas { opacity:1; }
.hero-ambient[data-scene=ready]>img { opacity:0; }
.buyer-hero-grid,.buyer-hero .client-strip { position:relative; }
.buyer-hero h1 { max-width:620px; }
.buyer-hero .hero-body { max-width:465px; }
.story-shell { background:#19201cd9; }
.story-panel { padding-top:24px; }
.story-panel>.eyebrow { margin-bottom:10px; }
.story-panel>p:not(.eyebrow) { min-height:45px; font-size:16px; line-height:1.45; }
.story-panel h2 { margin-bottom:10px; }
.story-tabs button { font-size:14px; padding:14px 3px; }
.story-tabs button:after { content:''; position:absolute; top:0; left:10%; width:80%; height:2px; background:#f7f5ef25; z-index:-1; }
.story-tabs button[aria-selected=true]:before { transform:scaleX(var(--stage-progress,0)); transform-origin:left; }
.buyer-story[data-motion=manual] .story-tabs button[aria-selected=true]:before { transform:scaleX(1); }
.story-panel.is-entering { animation-duration:.38s; }
/* Stalled outreach: scattering, missed timing, then an unanswered handoff. */
.problem-grid { gap:25px; }
.problem-grid article { border:0; padding:0; }
.problem-grid h3 { margin-top:25px; }
.problem-visual { background:#ffffff05; border:1px solid #ffffff24; border-radius:15px; height:244px; padding:22px; overflow:hidden; display:flex; flex-direction:column; }
.problem-input { font-size:14px; color:#f7f5ef; }
.problem-outcome { margin-top:auto; display:flex; flex-direction:column; gap:7px; font-size:15px; }
.problem-outcome small { font-size:13px; color:#b6beb2; }
.scatter-targets { display:flex; align-items:center; justify-content:space-between; height:70px; }
.scatter-targets span { width:35px; height:35px; display:grid; place-items:center; border:1px solid #ffffff30; border-radius:9px; opacity:.45; }
.scatter-targets .icon { width:18px; }
.broken-route { display:flex; align-items:center; gap:13px; height:27px; color:#aab2a5; }
.broken-route i { height:1px; flex:1; border-top:1px dashed #ffffff3c; }
.broken-route .icon { width:16px; }
.missed-timing { height:98px; position:relative; margin-top:5px; }
.timing-note { position:absolute; top:9px; left:8%; border:1px solid #ffffff38; border-radius:8px; padding:8px; }
.timing-note .icon { width:20px; height:20px; }
.timing-track { display:flex; justify-content:space-between; position:absolute; inset:auto 0 10px; border-top:1px solid #ffffff35; }
.timing-track>i { width:5px; height:5px; border-radius:50%; background:#889181; margin-top:-3px; }
.timing-track>b { position:absolute; right:17%; top:-12px; width:24px; height:24px; background:var(--ink); display:grid; place-items:center; }
.timing-track .icon { width:18px; height:18px; }
.stalled-reply { display:flex; justify-content:space-between; align-items:center; height:105px; }
.stalled-reply>.icon,.empty-slot { border:1px solid #ffffff35; padding:10px; border-radius:8px; width:49px; height:49px; }
.empty-slot { border-style:dashed; opacity:.45; }
.wait-clock { width:30px; height:30px; border:1px solid #c4ccc0; border-radius:50%; position:relative; }
.wait-clock:after { content:''; position:absolute; width:8px; height:1px; background:#c4ccc0; left:14px; top:14px; }
.wait-clock i { height:9px; width:1px; position:absolute; background:#c4ccc0; left:14px; top:6px; transform-origin:bottom; }
.problem-visual.is-revealed .scatter-targets span { animation:scatter-miss 3.8s both; animation-delay:calc(var(--item)*90ms); }
.problem-visual.is-revealed .timing-note { animation:wrong-time 4.6s both; }
.problem-visual.is-revealed .wait-clock i { animation:wait-for-handoff 4.6s ease-in-out both; }
.problem-visual.is-revealed .empty-slot { animation:unclaimed-slot 4.6s both; }
@keyframes scatter-miss { 0%,12% { opacity:1; transform:translateY(-12px); } 38%,100% { opacity:.65; transform:translateY(calc((var(--item) - 2)*3px)); } }
@keyframes wrong-time { 0%,20% { transform:translateX(0); opacity:1; } 65%,100% { transform:translateX(82px); opacity:.65; } }
@keyframes wait-for-handoff { to { transform:rotate(660deg); } }
@keyframes unclaimed-slot { 0%,45% { opacity:.7; } 75%,100% { opacity:.55; } }
/* Three distinct artifacts replace the same repeated four-row checklist. */
.service-visual { padding:28px; min-height:380px; justify-content:flex-start; }
.process-label { font-size:13px; color:#5b6457; display:block; line-height:1.4; }
.research-sources { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:14px; }
.research-source { padding:14px 10px; min-height:100px; border:1px solid #19201c20; border-radius:9px; font-size:13px; line-height:1.4; position:relative; overflow:hidden; }
.research-source>.icon { width:20px; height:20px; display:block; margin-bottom:13px; }
.research-source>i { position:absolute; left:0; right:0; top:0; height:1px; background:#19201c55; }
.research-merge { height:39px; padding-inline:12%; }
.research-merge svg { width:100%; height:100%; }
.research-merge path { fill:none; stroke:#19201c60; stroke-width:1.3; stroke-dasharray:480; }
.research-engine { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:15px 18px; border:1px solid #19201c25; border-radius:10px; background:var(--paper); font-size:14px; }
.research-engine img { width:84px; height:27px; object-fit:contain; }
.target-result { margin:16px 18px 0; border:1px solid #19201c28; border-radius:10px; padding:15px 18px; box-shadow:0 8px 18px #19201c07; }
.target-result>div { display:flex; align-items:center; gap:11px; font-size:14px; }
.target-result>div>.icon { width:18px; height:18px; }
.target-result>div>.icon:last-child { margin-left:auto; }
.target-result strong { font-weight:500; }
.target-result p { font-size:13px; color:#596253; line-height:1.45; margin:7px 0 0 29px; }
.process-note { font-size:12px; color:#61695c; line-height:1.5; margin-top:18px; }
.context-source { padding:16px 18px; border-left:2px solid var(--ink); background:var(--paper); }
.context-source>.process-label { margin-bottom:9px; }
.context-source p { font-size:14px; line-height:1.5; margin-top:3px; }
.message-composer { margin-top:25px; border:1px solid #19201c24; border-radius:11px; box-shadow:0 12px 25px #19201c0b; overflow:hidden; }
.composer-heading { padding:14px 17px; display:flex; align-items:center; gap:12px; border-bottom:1px solid var(--edge); font-size:14px; }
.composer-heading>.icon { width:18px; height:18px; }
.composer-heading>i { margin-left:auto; font-style:normal; }
.composer-body { padding:17px; }
.composer-body p { font-size:15px; line-height:1.5; margin-bottom:7px; }
.approval-stamp { display:flex; align-items:center; gap:9px; background:var(--ink); color:var(--paper); padding:14px 17px; font-size:13px; }
.approval-stamp .icon { width:18px; height:18px; flex:none; }
.approval-stamp .icon:last-child { margin-left:auto; }
.reply-bubble { border:1px solid var(--edge); border-radius:11px 11px 11px 0; padding:17px; display:flex; align-items:center; gap:15px; }
.reply-bubble>.icon { width:23px; height:23px; flex:none; }
.reply-bubble p { font-size:15px; line-height:1.5; margin-top:7px; }
.handoff-context { display:flex; gap:16px; margin:20px 0; }
.handoff-context>span { font-size:13px; display:flex; align-items:center; gap:7px; }
.handoff-context .icon { width:16px; height:16px; flex:none; }
.calendar-handoff { display:grid; grid-template-columns:1fr 1.4fr; gap:22px; align-items:center; background:var(--paper); padding:20px; border:1px solid #19201c1a; border-radius:12px; }
.calendar-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:5px; border-top:3px solid #19201c; padding-top:10px; }
.calendar-grid>i { aspect-ratio:1; border:1px solid #19201c30; border-radius:3px; min-width:0; }
.calendar-grid>.chosen { background:var(--ink); border-color:var(--ink); }
.calendar-art>span { display:block; font-size:12px; line-height:1.4; margin-top:12px; }
.meeting-brief { border-left:1px solid #19201c30; padding-left:18px; }
.meeting-brief strong { font-size:15px; font-weight:500; line-height:1.4; }
.meeting-brief p { margin-top:9px; font-size:13px; line-height:1.5; color:#52604b; }
.is-revealed .research-source>i { animation:scan-source 1.4s both; animation-delay:calc(var(--item)*.25s); }
.is-revealed .research-merge path { animation:signal-draw 1.4s .5s both; }
.is-revealed .target-result { animation:research-result 1.2s 1.7s both; }
.is-revealed .context-source p { animation:context-highlight 1.1s both; animation-delay:calc(var(--item)*.25s); }
.is-revealed .composer-body p { animation:compose-line 1.1s both; animation-delay:calc(1s + var(--item)*.6s); }
.is-revealed .approval-stamp { animation:handoff-arrive .8s 2.6s both; }
.is-revealed .reply-bubble { animation:message-send .7s both; }
.is-revealed .handoff-context { animation:service-row-in .7s .6s both; }
.is-revealed .calendar-grid>.chosen { animation:select-slot 1.5s 1s both; }
.is-revealed .meeting-brief { animation:research-result 1s 1.8s both; }
@keyframes scan-source { 0% { transform:translateY(0); opacity:0; } 15% { opacity:1; } 90% { opacity:1; } 100% { transform:translateY(98px); opacity:0; } }
@keyframes research-result { from { opacity:.1; transform:translateY(14px) scale(.97); } to { opacity:1; transform:none; } }
@keyframes context-highlight { 0%,30% { background:#19201c12; } 100% { background:transparent; } }
@keyframes compose-line { from { clip-path:inset(0 100% 0 0); } to { clip-path:inset(0 0 0 0); } }
@keyframes select-slot { 0%,30% { background:transparent; transform:scale(.8); } 70% { transform:scale(1.2); } 100% { background:var(--ink); transform:none; } }
.services-section .tools-row .clay-primary { width:104px; height:auto; max-height:36px; }
/* Aligned rows allow an actual comparison instead of two unrelated lists. */
.comparison-section { margin-top:65px; }
.comparison-section>h3 { font-size:34px; letter-spacing:-.035em; margin-bottom:28px; }
.before-after { width:100%; border-collapse:separate; border-spacing:0; table-layout:fixed; font-size:16px; line-height:1.6; }
.before-after th { text-align:left; font-size:21px; padding:27px 30px; font-weight:500; }
.before-after td { padding:21px 30px; vertical-align:top; border-top:1px solid #19201c16; }
.before-after th:first-child,.before-after td:first-child { background:white; color:#596153; border-left:1px solid #19201c15; }
.before-after th:last-child,.before-after td:last-child { background:var(--ink); color:var(--paper); border-top-color:#ffffff20; }
.before-after th:first-child { border-radius:14px 0 0 0; border-top:1px solid #19201c15; }
.before-after th:last-child { border-radius:0 14px 0 0; }
.before-after tr:last-child td:first-child { border-radius:0 0 0 14px; border-bottom:1px solid #19201c15; }
.before-after tr:last-child td:last-child { border-radius:0 0 14px 0; }
.before-after td>.icon { width:18px; height:18px; margin-top:4px; float:left; }
.before-after td>span { display:block; padding-left:30px; }
.before-after th img { width:26px; height:26px; vertical-align:middle; margin-right:12px; }
.client-role { display:flex; align-items:baseline; gap:25px; padding-top:25px; font-size:13px; line-height:1.5; color:#576052; }
.client-role strong { color:var(--ink); white-space:nowrap; }
.client-role>span { flex:1; }
.founder-linkedin { display:inline-flex; align-items:center; gap:12px; margin-top:30px; padding:13px 20px; border:1px solid #19201c35; border-radius:50px; font-size:15px; }
.founder-linkedin:hover { background:#19201c08; }
.founder-linkedin>.icon { width:19px; height:19px; }
.motion-suspended * { animation-play-state:paused!important; }
@media(max-width:1100px) { .service-visual { padding:23px; }.research-source { padding:12px 8px; }.calendar-handoff { padding:15px; gap:14px; }.hero-ambient { inset:-80px -25% -50px 10%; } }
@media(max-width:850px) { .buyer-hero-grid { gap:35px; }.buyer-hero h1 { max-width:660px; }.buyer-hero .hero-body { max-width:550px; }.buyer-story { max-width:580px; }.problem-grid { grid-template-columns:1fr; gap:30px; }.problem-grid article { display:grid; grid-template-columns:1fr 1fr; column-gap:30px; align-content:center; }.problem-visual { grid-row:1/3; }.problem-grid h3 { align-self:end; }.problem-grid p { align-self:start; }.service-visual { padding:20px; }.research-sources { gap:6px; }.research-source { font-size:12px; }.research-engine { flex-direction:column; gap:9px; }.target-result { margin-inline:0; }.calendar-handoff { grid-template-columns:1fr; }.calendar-art { display:none; }.meeting-brief { border-left:0; padding-left:0; }.client-role { flex-wrap:wrap; }.client-role strong { flex-basis:100%; }.hero-ambient { inset:-50px -30% 0 0; opacity:.14; } }
@media(max-width:600px) { .hero-ambient { inset:0 -85% 20% -80%; }.story-panel { min-height:365px; }.story-panel>p:not(.eyebrow) { font-size:15px; }.story-tabs button { font-size:14px; }.buyer-hero .hero-body { font-size:17px; }.buyer-hero .client-strip { margin-top:30px; }.problem-grid article { display:block; }.problem-visual { height:228px; }.problem-grid h3 { margin-top:20px; }.service-visual { padding:23px; min-height:360px; }.research-sources { gap:8px; }.research-source { font-size:13px; }.research-engine { flex-direction:row; }.calendar-handoff { grid-template-columns:.9fr 1.3fr; }.calendar-art { display:block; }.meeting-brief { border-left:1px solid #19201c30; padding-left:15px; }.comparison-section { margin-top:45px; }.comparison-section>h3 { font-size:29px; }.before-after { font-size:14px; line-height:1.55; }.before-after th { padding:20px 16px; font-size:17px; }.before-after td { padding:18px 14px; }.before-after td>.icon { width:15px; height:15px; }.before-after td>span { padding-left:22px; }.before-after th img { width:20px; height:20px; margin-right:7px; }.client-role { display:block; }.client-role strong,.client-role span { display:block; margin-top:10px; }.story-shell { border-radius:18px; } }
@media(prefers-reduced-motion:reduce) { .buyer-site *,.buyer-site *:before,.buyer-site *:after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }.hero-ambient { opacity:.12; }.story-tabs button[aria-selected=true]:before { transform:scaleX(1); }.composer-body p { clip-path:none; }.research-source>i { display:none; } }

/* Reserve equal space for all four stages so the page never jumps on advance. */
.story-panels,.story-panel { min-height:406px; }
@media(max-width:600px) { .story-panels,.story-panel { min-height:428px; } }

.story-panels { display:grid; }
.story-panel { grid-area:1/1; }
@media(max-width:600px) { .buyer-hero .hero-actions { align-items:flex-start; gap:13px; }.buyer-hero .hero-credential { margin-top:19px; } }
/* Hero: a buyer-attention network, distinct from the service artifacts below. */
.attention-network { position:relative; min-width:0; width:100%; max-width:580px; justify-self:center; }
.network-example { font-size:12px; text-align:center; color:#b8c1b2; margin-bottom:8px; }
.attention-map { width:100%; aspect-ratio:600/540; position:relative; isolation:isolate; }
.attention-orbits { position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; }
.attention-orbits>.outer-orbit { stroke:#f7f5ef15; stroke-width:1; }
.attention-orbits>.middle-orbit { stroke:#f7f5ef25; stroke-width:1; }
.attention-orbits>.inner-orbit { stroke:#f7f5ef12; stroke-width:1; }
.orbital-glint { transform-origin:300px 266px; animation:attention-orbit 42s linear infinite; }
.orbital-glint circle { stroke:#f7f5ef; stroke-width:1.3; stroke-dasharray:5 95; opacity:.5; }
.attention-route { stroke:#f7f5ef22; stroke-width:1; transition:stroke .6s; }
.attention-network[data-selected="0"] .route-0,.attention-network[data-selected="1"] .route-1,.attention-network[data-selected="2"] .route-2 { stroke:#f7f5efb3; stroke-width:1.6; stroke-dasharray:5 13; animation:attention-route 2.8s linear infinite; }
.attention-core { position:absolute; left:50%; top:49.25%; width:27%; aspect-ratio:1; transform:translate(-50%,-50%); background:radial-gradient(circle at 32% 20%,#344034,#19201c 75%); border:1px solid #f7f5ef28; border-radius:50%; box-shadow:0 15px 45px #0005,inset 0 1px 0 #f7f5ef12; overflow:hidden; z-index:2; }
.attention-core>img { position:absolute; left:24%; top:25%; width:52%; height:50%; object-fit:contain; }
.attention-core>canvas { position:absolute; inset:0; width:100%; height:100%; opacity:0; transition:opacity .5s; }
.attention-core[data-scene=ready]>canvas { opacity:1; }
.attention-core[data-scene=ready]>img { opacity:0; }
.attention-center-label { position:absolute; top:67%; left:50%; transform:translateX(-50%); color:var(--paper); font-size:14px; letter-spacing:.015em; }
.buyer-node { position:absolute; width:32%; padding:16px 13px 14px; border:1px solid #f7f5ef24; border-radius:13px; background:#1b241e; color:var(--paper); font:inherit; display:grid; justify-items:center; text-align:center; gap:9px; z-index:3; box-shadow:0 8px 22px #0002; transition:background .55s,border-color .55s,box-shadow .55s; }
.buyer-node-0 { left:50%; top:2%; transform:translateX(-50%); }
.buyer-node-1 { left:98%; top:62%; transform:translateX(-100%); }
.buyer-node-2 { left:2%; top:62%; }
.buyer-avatar { width:31px; height:31px; border:1px solid #f7f5ef40; border-radius:50%; display:grid; place-items:center; }
.buyer-avatar>.icon { width:19px; height:19px; }
.buyer-node strong { font-size:14px; font-weight:500; line-height:1.3; }
.buyer-reason { font-size:13px; color:#b6c1b0; line-height:1.5; }
.buyer-node[aria-pressed=true] { border-color:#f7f5efb3; background:#283328; box-shadow:0 0 0 5px #f7f5ef04,0 9px 30px #0002; }
.buyer-node[aria-pressed=true] .buyer-avatar { background:var(--paper); color:var(--ink); border-color:var(--paper); }
.buyer-node[aria-pressed=true] .buyer-reason { color:#f0f0e9; }
.network-caption { max-width:410px; margin:20px auto 0; color:#c0c9b9; font-size:15px; line-height:1.65; text-align:center; }
.attention-network[data-motion=paused] .orbital-glint,.attention-network[data-motion=paused] .attention-route,.attention-network[data-motion=manual] .orbital-glint,.attention-network[data-motion=manual] .attention-route { animation-play-state:paused; }
@keyframes attention-orbit { to { transform:rotate(360deg); } }
@keyframes attention-route { to { stroke-dashoffset:-72; } }
@media(max-width:1100px) { .buyer-node { padding:13px 9px; }.buyer-node strong { font-size:13px; }.buyer-reason { font-size:12px; }.network-caption { font-size:14px; } }
@media(max-width:850px) { .attention-network { max-width:560px; justify-self:start; }.buyer-node strong { font-size:15px; }.buyer-reason { font-size:14px; }.network-caption { margin-top:16px; text-align:left; max-width:480px; }.network-example { text-align:left; margin-bottom:20px; } }
@media(max-width:600px) { .attention-network { margin-top:3px; }.attention-map { aspect-ratio:600/760; }.attention-orbits { height:86%; }.buyer-node { width:36%; padding:13px 8px; gap:8px; }.buyer-node strong { font-size:13px; }.buyer-reason { font-size:12px; line-height:1.4; }.buyer-avatar { width:27px; height:27px; }.buyer-avatar>.icon { width:17px; height:17px; }.buyer-node-0 { width:48%; top:0; }.buyer-node-1,.buyer-node-2 { top:58%; }.buyer-node-1 { left:100%; }.buyer-node-2 { left:0; }.attention-core { width:28%; top:42.5%; }.attention-center-label { top:57.5%; font-size:12px; }.network-example { margin-bottom:18px; }.network-caption { margin-top:12px; font-size:14px; }.attention-network .buyer-node:focus-visible { outline-offset:3px; } }
@media(prefers-reduced-motion:reduce) { .attention-network * { animation:none!important; transition:none!important; }.attention-route { stroke-dasharray:none!important; } }

@media(max-width:360px) { .attention-map { aspect-ratio:600/900; } .attention-core { top:43%; } .attention-center-label { top:57%; } }
@media(max-width:340px) { .attention-map { aspect-ratio:600/1060; } }

/* YMX proof uses the verified reply outcomes, not a logo-only placeholder. */
.buyer-site .case-teaser .case-image.ymx-case-image { height:auto; min-height:225px; padding:0; background:#F7F5EF; align-items:stretch; }
.ymx-results-preview { width:100%; color:#19201C; }
.ymx-results-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px 24px; background:#19201C; color:#F7F5EF; }
.case-teaser .ymx-results-heading img { width:80px; height:26px; object-fit:contain; }
.ymx-results-heading>span { font-size:12px; border:1px solid #f7f5ef40; border-radius:30px; padding:6px 10px; }
.ymx-result-rows { padding:4px 24px; }
.ymx-result-row { display:flex; align-items:flex-start; gap:12px; padding:17px 0; }
.ymx-result-row+.ymx-result-row { border-top:1px solid #19201c20; }
.ymx-result-row>.icon { width:18px; height:18px; flex-shrink:0; margin-top:2px; }
.ymx-result-row>div { display:flex; flex-direction:column; gap:5px; }
.ymx-result-row strong { font-size:15px; line-height:1.3; font-weight:600; }
.ymx-result-row span { font-size:13px; line-height:1.45; color:#404740; }
.ymx-result-row time { font-size:11px; line-height:1.4; color:#646b65; }
.ymx-case-replies { display:grid; gap:18px; margin:24px 0; }
.case-body .ymx-case-replies blockquote { font-size:clamp(23px,3vw,30px); line-height:1.35; }
@media(max-width:600px) {
  .ymx-results-heading { padding:16px 20px; }
  .ymx-result-rows { padding:2px 20px; }
}
