/* The customer conversation becomes the office's brief. A single, readable example. */
.cp-page-marketing .mi-intake { padding: 100px 0 85px; background: #edf2f5; color: #14304e; }
.mi-intake .mi-intro { display: grid; grid-template-columns: 1.06fr .94fr; gap: 90px; align-items: start; margin-bottom: 65px; }
.mi-intake .mi-intro h2 { max-width: 18ch; font-size: clamp(44px,4.5vw,68px); line-height: 1.04; font-weight: 500; letter-spacing: -.055em; }
.mi-intake .mi-intro > div { padding-top: 5px; max-width: 49ch; }
.mi-intake .mi-intro p { font-size: 21px; line-height: 1.55; letter-spacing: -.015em; }
.mi-intake .mi-intro p + p { font-size: 16px; line-height: 1.7; color: #5f6d73; margin-top: 22px; }
.mi-intake .mi-example-head { display: flex; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid #ccd6de; padding-bottom: 19px; }
.mi-intake .mi-example-head > p { display: flex; align-items: center; gap: 24px; font-size: 15px; }
.mi-intake .mi-evening-time { font: 600 39px/1 var(--display); color: #8f7039; letter-spacing: -.04em; }
.mi-intake .mi-controls { display: flex; align-items: center; gap: 22px; }
.mi-intake .mi-controls[hidden],.mi-intake .mi-reset[hidden] { display: none; }
.mi-intake .mi-controls button { border: 0; padding: 10px 0; background: none; cursor: pointer; font-size: 14px; color: #14304e; text-decoration: underline; text-decoration-color: #b8924a; text-underline-offset: 6px; }
.mi-intake .mi-play { display: flex; align-items: center; gap: 12px; min-height: 44px; }
.mi-intake .mi-play svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.5; }
.mi-intake .mi-pause-symbol { display: none; }
.mi-intake .mi-play[data-playing] .mi-play-symbol { display: none; }
.mi-intake .mi-play[data-playing] .mi-pause-symbol { display: block; }
.mi-intake .mi-controls button:focus-visible { outline: 2px solid #b8924a; outline-offset: 6px; }
.mi-intake .mi-controls button:hover { text-decoration-color: #14304e; }
.mi-intake .mi-example { display: grid; grid-template-columns: minmax(0,1.13fr) minmax(0,.87fr); align-items: stretch; }
.mi-intake .mi-conversation { padding: 29px 54px 31px 0; }
.mi-intake .mi-conversation-heading { display: flex; align-items: center; gap: 14px; margin-bottom: 27px; }
.mi-intake .mi-conversation-heading > svg { width: 28px; height: 28px; fill: none; stroke: #668574; stroke-width: 1.4; }
.mi-intake .mi-conversation-heading h3 { font-size: 19px; line-height: 1.3; font-weight: 500; letter-spacing: -.02em; }
.mi-intake .mi-conversation-heading p { margin-top: 5px; font-size: 12px; color: #6b7779; }
.mi-intake .mi-messages { display: flex; flex-direction: column; gap: 13px; list-style: none; margin: 0; padding: 0; }
.mi-intake .mi-message { position: relative; max-width: 89%; padding: 13px 17px 9px; font-size: 15px; line-height: 1.5; transition: opacity .32s ease, transform .32s ease; }
.mi-intake .mi-message p { margin: 0; }
.mi-intake .mi-customer { align-self: flex-start; background: #ffffff; border-radius: 0 12px 12px 12px; color: #233e52; }
.mi-intake .mi-assistant { align-self: flex-end; background: #dfe9df; border-radius: 12px 0 12px 12px; color: #284c3b; }
.mi-intake .mi-message time { display: block; margin-top: 5px; text-align: right; font-size: 10px; color: #65776c; }
.mi-intake .mi-customer time { color: #7a8386; }
.mi-intake .mi-message.mi-unrevealed { opacity: 0; transform: translateY(9px); visibility: hidden; }
.mi-intake .mi-brief { position: relative; margin: 29px 0 31px; padding: 30px 38px 28px; color: #14304e; background: #ffffff; box-shadow: 0 12px 40px #14304e06; border-top: 3px solid #b8924a; }
.mi-intake .mi-brief::before { content: ''; position: absolute; top: 82px; left: -54px; width: 54px; border-top: 1px solid #b8924a; }
.mi-intake .mi-brief-top { display: flex; align-items: center; gap: 10px; margin-bottom: 30px; }
.mi-intake .mi-brief-top svg { width: 18px; height: 21px; fill: #b8924a; }
.mi-intake .mi-brief-top p { font-size: 12px; color: #65737c; }
.mi-intake .mi-brief h3 { font: 600 clamp(31px,2.8vw,43px)/1.1 var(--display); letter-spacing: -.04em; }
.mi-intake .mi-brief-caption { color: #6e7c81; margin-top: 11px; font-size: 13px; }
.mi-intake .mi-brief-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 0 24px; margin-top: 27px; }
.mi-intake .mi-brief-fields > div { padding: 13px 0; border-bottom: 1px solid #dce4e9; }
.mi-intake .mi-brief-fields dt { font-size: 12px; color: #6a797f; margin-bottom: 5px; }
.mi-intake .mi-brief-fields dd { margin: 0; font-size: 17px; line-height: 1.4; font-weight: 500; }
.mi-intake [data-intake-fact] { transition: opacity .4s ease, transform .4s ease; }
.mi-intake [data-intake-fact].mi-unrevealed { opacity: .25; }
.mi-intake [data-intake-fact].mi-unrevealed dd,.mi-intake .mi-next.mi-unrevealed p,.mi-intake .mi-next.mi-unrevealed .mi-not-booked { visibility: hidden; }
.mi-intake .mi-next { margin-top: 28px; padding-left: 15px; border-left: 2px solid #b8924a; }
.mi-intake .mi-next-label { display: block; font-size: 12px; color: #806433; }
.mi-intake .mi-next p { margin: 8px 0 12px; font-size: 24px; line-height: 1.2; letter-spacing: -.035em; }
.mi-intake .mi-not-booked { font-size: 12px; color: #6a797f; }
.mi-intake .mi-brief-foot { font-size: 12px; line-height: 1.65; color: #6a797f; margin-top: 35px; max-width: 30ch; }
.mi-intake .mi-example-foot { display: flex; align-items: center; justify-content: space-between; gap: 25px; padding: 17px 0; border-top: 1px solid #ccd6de; color: #647378; font-size: 12px; }
.mi-intake .mi-status { color: #516c5c; }
.mi-intake .mi-agreement { display: grid; grid-template-columns: 1fr 1fr; gap: 100px; margin-top: 48px; align-items: start; }
.mi-intake .mi-agreement h3 { font-size: 25px; letter-spacing: -.035em; font-weight: 500; line-height: 1.3; }
.mi-intake .mi-agreement p { max-width: 55ch; color: #596d77; font-size: 15px; line-height: 1.75; }
.mi-intake .mi-sr { position: absolute; width: 1px; height: 1px; clip-path: inset(50%); overflow: hidden; white-space: nowrap; }
@media (min-width: 1600px) { .mi-intake .mi-conversation { padding-right: 85px; } .mi-intake .mi-message { font-size: 17px; } .mi-intake .mi-brief { padding: 39px 48px; } .mi-intake .mi-brief::before { width: 85px; left: -85px; } }
@media (max-width: 1100px) { .mi-intake .mi-intro { gap: 50px; } .mi-intake .mi-intro p { font-size: 19px; } .mi-intake .mi-conversation { padding-right: 32px; } .mi-intake .mi-message { max-width: 95%; font-size: 14px; } .mi-intake .mi-brief { padding-inline: 25px; } .mi-intake .mi-brief::before { width: 32px; left: -32px; } .mi-intake .mi-agreement { gap: 55px; } }
@media (max-width: 800px) {
 .cp-page-marketing .mi-intake { padding: 66px 0; }
 .mi-intake .mi-intro { grid-template-columns: 1fr; gap: 28px; margin-bottom: 42px; }
 .mi-intake .mi-intro h2 { max-width: 20ch; font-size: clamp(40px,7.5vw,59px); }
 .mi-intake .mi-intro > div { padding: 0; max-width: 60ch; }
 .mi-intake .mi-intro p { font-size: 19px; }
 .mi-intake .mi-intro p + p { margin-top: 15px; font-size: 15px; }
 .mi-intake .mi-example-head { align-items: flex-start; }
 .mi-intake .mi-example-head > p { display: block; }
 .mi-intake .mi-evening-time { display: block; font-size: 33px; margin-bottom: 11px; }
 .mi-intake .mi-example-head > p > span:last-child { font-size: 12px; }
 .mi-intake .mi-controls { flex-direction: column; align-items: flex-end; gap: 0; }
 .mi-intake .mi-controls button { font-size: 12px; padding-top: 5px; padding-bottom: 5px; }
 .mi-intake .mi-play { gap: 8px; }
 .mi-intake .mi-example { grid-template-columns: 1fr; }
 .mi-intake .mi-conversation { padding: 26px 0 32px; }
 .mi-intake .mi-message { font-size: 15px; max-width: 88%; }
 .mi-intake .mi-messages { gap: 12px; }
 .mi-intake .mi-brief { margin: 0 0 24px; padding: 26px; }
 .mi-intake .mi-brief::before { width: 0; height: 32px; top: -35px; left: 27px; border-top: 0; border-left: 1px solid #b8924a; }
 .mi-intake .mi-brief-top { margin-bottom: 23px; }
 .mi-intake .mi-brief h3 { font-size: 35px; }
 .mi-intake .mi-brief-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 0 24px; margin-top: 20px; }
 .mi-intake .mi-brief-fields dd { font-size: 15px; }
 .mi-intake .mi-next { margin-top: 25px; }
 .mi-intake .mi-next p { font-size: 23px; }
 .mi-intake .mi-brief-foot { margin-top: 21px; max-width: none; }
 .mi-intake .mi-example-foot { flex-direction: column; align-items: flex-start; gap: 7px; padding-top: 0; border: 0; font-size: 11px; }
 .mi-intake .mi-agreement { grid-template-columns: 1fr; gap: 17px; margin-top: 32px; padding-top: 30px; border-top: 1px solid #ccd6de; }
}
@media (max-width: 400px) { .mi-intake .mi-example-head { gap: 12px; } .mi-intake .mi-play { gap: 5px; } .mi-intake .mi-play svg { width: 17px; } .mi-intake .mi-message { max-width: 94%; font-size: 14px; } .mi-intake .mi-conversation-heading p { font-size: 11px; } .mi-intake .mi-brief { padding: 22px; } .mi-intake .mi-brief-fields { gap: 0 17px; } }
@media (prefers-reduced-motion: reduce) { .mi-intake .mi-message,.mi-intake [data-intake-fact] { transition: none; } }
/* Keep the example comfortable to read on a phone as well as a desk. */
.mi-intake .mi-controls button { min-height: 44px; font-size: 14px; }
.mi-intake .mi-conversation-heading p,.mi-intake .mi-brief-top p { font-size: 13px; color: #526774; }
.mi-intake .mi-message { font-size: 16px; line-height: 1.55; }
.mi-intake .mi-message time { font-size: 11px; }
.mi-intake .mi-brief-fields dt,.mi-intake .mi-next-label,.mi-intake .mi-not-booked { font-size: 13px; }
.mi-intake .mi-brief-fields dt,.mi-intake .mi-not-booked { color: #536b78; }
.mi-intake .mi-example-foot { font-size: 13px; }
.mi-intake .mi-agreement p { font-size: 16px; }
@media (min-width: 801px) and (max-width: 1100px) {
 .mi-intake .mi-message { font-size: 15px; }
 .mi-intake .mi-brief-fields { grid-template-columns: 1fr; }
 .mi-intake .mi-brief-fields > div { padding-block: 12px; }
 .mi-intake .mi-brief-fields dd { font-size: 16px; }
}
@media (max-width:800px) {
 .mi-intake .mi-intro { margin-bottom: 33px; }
 .mi-intake .mi-intro p + p { font-size: 16px; }
 .mi-intake .mi-example-head { align-items: center; }
 .mi-intake .mi-conversation-heading p { font-size: 12px; }
 .mi-intake .mi-message { padding: 12px 15px 8px; font-size: 16px; }
 .mi-intake .mi-brief-fields dd { font-size: 16px; }
 .mi-intake .mi-example-foot { font-size: 12px; }
 .mi-intake .mi-controls { gap: 0; }
 .mi-intake .mi-controls button { font-size: 14px; }
 .mi-intake .mi-play { gap: 7px; }
 .mi-intake .mi-play svg { width: 19px; height: 19px; }
}
@media (max-width:600px) {
 .cp-page-marketing .mi-intake { padding-block: 57px; }
 .mi-intake .mi-intro h2 { font-size: clamp(37px,10vw,47px); }
 .mi-intake .mi-intro p { font-size: 18px; }
 .mi-intake .mi-conversation { padding-top: 23px; }
 .mi-intake .mi-messages { gap: 10px; }
 .mi-intake .mi-message { max-width: 94%; font-size: 15px; }
 .mi-intake .mi-brief { padding: 24px; }
 .mi-intake .mi-brief-top { margin-bottom: 17px; }
 .mi-intake .mi-brief-caption { margin-top: 8px; }
 .mi-intake .mi-brief-fields { margin-top: 16px; gap: 0 18px; }
 .mi-intake .mi-brief-fields dt { font-size: 12px; }
 .mi-intake .mi-brief-fields dd { font-size: 16px; }
 .mi-intake .mi-agreement { gap: 18px; margin-top: 23px; padding-top: 25px; }
 .mi-intake .mi-agreement h3 { max-width: 20ch; font-size: 26px; }
 .mi-intake .mi-agreement p { font-size: 16px; }
}
@media (max-width:359px) {
 .mi-intake .mi-example-head > p > span:last-child { display: block; max-width: 13ch; line-height: 1.45; }
 .mi-intake .mi-brief-fields { grid-template-columns: 1fr; }
}
.mi-intake .mi-controls { min-width: 245px; justify-content: flex-start; }
.mi-intake .mi-play { min-width: 150px; }
@media (max-width:800px) { .mi-intake .mi-controls { min-width: 150px; min-height: 88px; } }
