/* media-content — merged from the static build's app.css, source order preserved. */

.workflow-section { background-color: var(--paper); background-image: var(--noise); }
.workflow-section--request { min-height: 733px; padding-top: 120px; }
.workflow-section--allocation { min-height: 471px; }
.split-block { display: grid; width: min(100%, 1214px); grid-template-columns: 639px 454px; align-items: center; gap: 41px; margin-inline: auto; }
.split-block--reverse { grid-template-columns: 454px 639px; }
.request-panel { min-height: 493px; }
.request-panel .ui-panel__top { height: 49px; }
.request-panel__body { padding: 23px 22px 29px; }
.request-panel h3 { margin: 0; font-size: 22px; font-weight: 600; line-height: 28px; }
.request-panel blockquote { margin: 16px 0 0; padding: 16px; border: 1px solid rgba(0,0,0,.07); border-radius: 8px; background: #fbfaf7; color: rgba(0,0,0,.75); font-size: 15px; line-height: 22px; }
.request-panel .button { width: 139px; min-width: 0; min-height: 39px; padding: 0; border: 0; border-radius: 6px; font-family: inherit; font-size: 15px; }
.request-status { display: grid; margin: 30px 0 0; padding: 0; gap: 18px; list-style: none; }
.request-status li { display: flex; height: 16px; align-items: center; gap: 13px; color: rgba(0,0,0,.4); font-size: 15px; line-height: 16px; }
.request-status li::before { box-sizing: border-box; flex: none; width: 16px; height: 16px; border: 2px solid rgba(0,0,0,.13); border-radius: 50%; content: ""; }
.request-status .is-done { color: #211e29; }
.request-status .is-done::before { border-color: var(--coral); background: var(--coral) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.6 6.3l2.3 2.3 4.5-4.9' fill='none' stroke='%23fff' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 11px 11px no-repeat; }
.request-status .is-current { color: #211e29; font-weight: 600; }
.request-status .is-current::before { border-color: var(--coral); }
.allocation-panel { min-height: 363px; }
.allocation-panel .ui-panel__top { height: 42px; }
.allocation-panel__body { padding: 22px; }
.allocation-bar { display: flex; height: 12px; overflow: hidden; border-radius: 100px; background: #f1efea; }
.allocation-bar i { width: var(--w); background: var(--c); }
.allocation-summary { display: flex; justify-content: space-between; margin: 10px 0 0; color: rgba(0,0,0,.45); font: 400 12px/14px var(--font-mono); }
.allocation-panel ul { margin: 20px 0 0; padding: 0; list-style: none; }
.allocation-panel li { display: flex; height: 44px; align-items: center; justify-content: space-between; gap: 16px; border-top: 1px solid rgba(0,0,0,.08); }
.allocation-panel li:first-child { height: 43px; border-top: 0; }
.allocation-panel li span { display: flex; align-items: center; gap: 12px; color: #211e29; font-size: 15px; }
.allocation-panel li span::before { box-sizing: border-box; flex: none; width: 9px; height: 9px; border-radius: 2px; background: var(--swatch); content: ""; }
.allocation-panel li b { color: rgba(0,0,0,.72); font: 400 14px/1 var(--font-mono); }
.allocation-add span { color: rgba(0,0,0,.45); }
.allocation-add span::before { border: 1px dashed rgba(0,0,0,.28); background: none; }
.allocation-add b { color: rgba(0,0,0,.45); }
.about-story { position: relative; height: 605px; margin-top: 120px; }
.about-story__grid { position: absolute; z-index: 0; top: 224px; right: 0; left: 0; height: 551px; background-image: linear-gradient(rgba(0,0,0,.025) 1.4px, transparent 1.4px), linear-gradient(90deg, rgba(0,0,0,.025) 1.4px, transparent 1.4px); background-position: calc(50% - 691.7px) 66px; background-size: 33.73px 34.67px; pointer-events: none; }
.about-story__intro, .about-story__row { position: relative; z-index: 1; }
.about-story__intro { display: flex; flex-direction: column; align-items: center; text-align: center; }
.about-story__intro { height: 162px; }
.about-story__intro h2 { width: 690px; margin-top: 27px; font-size: 60px; font-weight: 600; line-height: 54px; }
.about-story__intro h2 em { display: block; }
.about-story__intro h2 em { font-family: var(--font-serif); font-weight: 400; }
.about-story__row { display: grid; grid-template-columns: 555px 535px; justify-content: center; gap: 40px; margin-top: 80px; }
.about-story__row > img { width: 555px; height: 363px; object-fit: cover; }
.about-story__row > div { padding-top: 33px; }
.about-story__row p { color: rgba(0,0,0,.6); font-size: 18px; line-height: 26px; }
.about-story__row p:first-child { color: #000; font-size: 20px; font-weight: 500; line-height: 28px; }
.about-story__row p + p { margin-top: 18px; }
.about-story__row .button { display: flex; width: 232px; margin-top: 54.5px; }
.confirmed-cost { display: flex; align-items: center; justify-content: space-between; margin-top: 19px; padding: 17px 17px 13px; border: 1px solid rgba(0,0,0,.07); border-radius: 8px; }
.confirmed-cost p { margin: 0; }
.confirmed-cost span { display: block; color: rgba(0,0,0,.42); font: 400 11px/1 var(--font-mono); letter-spacing: .08em; text-transform: uppercase; }
.confirmed-cost strong { display: flex; align-items: baseline; gap: 9px; margin-top: 10px; color: #211e29; font-size: 28px; font-weight: 600; line-height: 1; }
.confirmed-cost small { color: rgba(0,0,0,.42); font: 400 13px/1 var(--font-mono); }
