/* kit/components.css - quiet, themable styles for the kit components (form, film, proposals, notes). Floor only: directions restyle freely. */
/* ---- Book a demo form ---- */
.df{display:block;max-width:760px}.df-intro{color:var(--ac-ink-2);font-size:var(--ac-fs-md)}
.df-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px 20px}.df-field--textarea,.df-field--select{grid-column:auto}.df-field--textarea{grid-column:1/-1}
.df-label{display:block;margin-bottom:6px;font:600 11px/1.3 var(--ac-font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ac-ink-2)}
.df-input{width:100%;min-height:48px;padding:12px 14px;font:400 16px/1.4 var(--ac-font-ui);color:var(--ac-ink-strong);background:var(--ac-panel-solid);border:1px solid var(--ac-edge);border-radius:var(--ac-r);appearance:none;-webkit-appearance:none}
select.df-input{background-image:linear-gradient(45deg,transparent 50%,var(--ac-ink-2) 50%),linear-gradient(135deg,var(--ac-ink-2) 50%,transparent 50%);background-position:calc(100% - 20px) 21px,calc(100% - 15px) 21px;background-size:5px 5px;background-repeat:no-repeat;padding-right:38px}
textarea.df-input{min-height:110px;resize:vertical}
.df-input:focus-visible{outline:2px solid var(--ac-focus);outline-offset:2px}
.df-field.has-error .df-input{border-color:var(--ac-accent);box-shadow:inset 3px 0 0 var(--ac-accent)}
.df-error{margin:6px 0 0;font:500 13px/1.4 var(--ac-font-ui);color:var(--ac-alert-ink);background:var(--ac-alert-tint);padding:4px 8px;border-radius:var(--ac-r-sm);max-width:none}
.df-submit{margin-top:24px;min-width:200px;min-height:52px}
.df-status{margin:12px 0 0;min-height:1.5em;font:500 13px/1.4 var(--ac-font-mono);color:var(--ac-accent)}
.df-done{padding:24px;background:var(--ac-float);border:1px solid var(--ac-rule);border-left:3px solid var(--ac-accent);border-radius:var(--ac-r)}.df-done-title:empty{display:none}.df-done .df-done-text{font-size:var(--ac-fs-md);margin:0 0 16px}.df-done-title{font:600 1.5rem/1.2 var(--ac-font-display);letter-spacing:.04em}
@media (max-width:640px){.df-grid{grid-template-columns:1fr}.df-submit{width:100%}}
/* ---- film poster ---- */
.film{position:relative;margin:0}.film-link{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;border-radius:var(--ac-r);border:1px solid var(--ac-rule);text-decoration:none;background:var(--ac-fog-3);box-shadow:var(--ac-float-lift)}
.film-poster{display:block;width:100%;height:100%;object-fit:cover}
.film-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:inline-flex;align-items:center;gap:12px;min-height:56px;padding:0 22px;background:var(--ac-info-fill);color:var(--ac-on-fill);border:1px solid var(--ac-info-rim);border-radius:var(--ac-r);font:600 12px/1 var(--ac-font-mono);letter-spacing:.12em;text-transform:uppercase;transition:background var(--ac-t-ui)}
.film-link:hover .film-play{background:var(--ac-info-fill-hover)}
.film-runtime{padding-left:12px;border-left:1px solid rgba(255,255,255,.4)}
.film[data-shape="disc"] .film-play{width:84px;height:84px;padding:0;justify-content:center;border-radius:50%}.film[data-shape="disc"] .film-play-label,.film[data-shape="disc"] .film-runtime{display:none}
.film-chapters{list-style:none;margin:0;padding:0;display:grid;gap:1px}.film-chapters a{display:grid;grid-template-columns:56px 1fr;column-gap:12px;padding:10px 0;color:var(--ac-ink);text-decoration:none;font-weight:400;border-bottom:1px solid var(--ac-hair)}
.film-chapters a:hover .film-ch-title{text-decoration:underline}.film-ch-t{grid-row:span 2;font:500 12px/1.6 var(--ac-font-mono);color:var(--ac-ink-3)}.film-ch-title{font-weight:600;color:var(--ac-ink-strong)}.film-ch-text{font-size:var(--ac-fs-sm);color:var(--ac-ink-2)}
/* ---- proposal chips, SHOW button, flash (briefs.md 3a) ---- */
.mq-prop{position:relative}.m-tag{display:inline-block;margin:0 6px;padding:1px 6px;font:600 10px/1.5 var(--ac-font-mono);letter-spacing:.12em;border:1px solid var(--ac-rule);border-radius:var(--ac-r-sm);color:var(--ac-ink-2)}
.m-tag[data-tag="NEW"]{color:var(--ac-alert-ink);background:var(--ac-alert-tint);border-color:var(--ac-alert-ink)}
.mq-prop [data-show]{min-height:32px;padding:0 12px;font:600 11px/1 var(--ac-font-mono);letter-spacing:.12em;color:var(--ac-ink-strong);background:var(--ac-panel-solid);border:1px solid var(--ac-rule);border-radius:var(--ac-r-sm);cursor:pointer}
.mq-prop [data-show]:hover{border-color:var(--ac-accent)}.mq-prop [data-show]:focus-visible{outline:2px solid var(--ac-focus);outline-offset:2px}
@media (max-width:700px){.mq-prop [data-show]{min-height:44px}}
@keyframes m-flash { from { opacity: .55; } to { opacity: 0; } }
[data-flash]::after { content: ""; position: absolute; inset: 0; background: var(--m-flash, rgba(80,140,255,.35)); pointer-events: none; opacity: 0; animation: m-flash 1.2s ease-out; }
@media (prefers-reduced-motion: reduce) { [data-flash]::after { animation: none; } }
/* ---- site forms (forms.js) ---- */
.sf{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-start}.sf-input{min-height:44px;padding:10px 14px;font:400 16px/1.4 var(--ac-font-ui);color:var(--ac-ink-strong);background:var(--ac-panel-solid);border:1px solid var(--ac-edge);border-radius:var(--ac-r);min-width:0;flex:1 1 220px}
.sf-input:focus-visible{outline:2px solid var(--ac-focus);outline-offset:2px}.sf [aria-invalid="true"]{border-color:var(--ac-accent);box-shadow:inset 3px 0 0 var(--ac-accent)}
.sf-error{flex:1 0 100%;margin:0;font:500 13px/1.4 var(--ac-font-ui);color:var(--ac-alert-ink);background:var(--ac-alert-tint);padding:4px 8px;border-radius:var(--ac-r-sm)}
.sf-done{flex:1 0 100%;margin:0;padding:12px 14px;font:500 15px/1.4 var(--ac-font-ui);color:var(--ac-ink-strong);background:var(--ac-float);border:1px solid var(--ac-rule);border-left:3px solid var(--ac-accent);border-radius:var(--ac-r)}
.sf-chips{display:flex;flex-wrap:wrap;gap:8px;flex:1 0 100%}.sf-chip{min-height:44px;padding:0 14px;font:600 12px/1 var(--ac-font-mono);letter-spacing:.1em;color:var(--ac-ink);background:var(--ac-panel-solid);border:1px solid var(--ac-rule);border-radius:var(--ac-r);cursor:pointer}.sf-chip[aria-pressed="true"]{border-color:var(--ac-accent);box-shadow:inset 0 -2px 0 var(--ac-accent);color:var(--ac-ink-strong)}
/* ---- proposals + notes (sit quietly at the end of the page) ---- */
.mq-props,.mq-notes{max-width:var(--ac-max);margin:0 auto;padding:24px var(--ac-gutter);color:var(--ac-ink-2);font:400 14px/1.5 var(--ac-font-ui)}
.mq-props{border-top:1px solid var(--ac-rule);padding-top:32px}
.mq-h{font:600 11px/1.2 var(--ac-font-mono);letter-spacing:.18em;color:var(--ac-ink-3);margin:0 0 12px}
.mq-props ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px}
.mq-prop{padding:10px 12px;background:var(--ac-panel);border:1px solid var(--ac-panel-edge);border-radius:var(--ac-r);opacity:.72}.mq-prop.is-here{opacity:1;border-color:var(--ac-rule);box-shadow:inset 2px 0 0 var(--ac-accent)}.mq-prop b{color:var(--ac-ink-strong);font-weight:600}
.mq-notes{padding-bottom:calc(var(--mq-bar-h) + 40px)} /* clears the pack.py bar */
.mq-notes details{border:1px solid var(--ac-rule);border-radius:var(--ac-r);background:var(--ac-panel-solid)}
.mq-notes summary{cursor:pointer;padding:12px 14px;font:600 11px/1.2 var(--ac-font-mono);letter-spacing:.18em;color:var(--ac-ink-2);min-height:44px;display:flex;align-items:center}
.mq-notes dl{margin:0;padding:4px 16px 16px;display:grid;grid-template-columns:200px 1fr;gap:12px 20px}.mq-notes dt{font:600 11px/1.5 var(--ac-font-mono);letter-spacing:.14em;color:var(--ac-accent)}.mq-notes dd{margin:0}.mq-notes p{margin:0;max-width:72ch}.mq-notes ul{margin:0;padding-left:18px}.mq-notes h4{font:600 12px/1.4 var(--ac-font-mono);letter-spacing:.1em;margin:0 0 4px;color:var(--ac-ink-strong)}
.mq-two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:700px){.mq-notes dl{grid-template-columns:1fr;gap:4px}.mq-two{grid-template-columns:1fr}.film-play{padding:0 16px}.film-play-label{display:none}}