/* Demo + quote form: a dialog on the homepage (opened from the AI agent card), inline on the AI agent case page.
   One question at a time. Theme rules color .portfolio-panel text, so inline selectors stay specific. */
.portfolio-card-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.quote-open{position:relative;z-index:1;height:44px;padding:0 18px;border:1px solid #ffffff66;border-radius:999px;background:transparent;color:#fff;font:600 15px/1 inherit;cursor:pointer;transition:background-color .2s ease,border-color .2s ease}
.quote-open:hover{background:#ffffff1a;border-color:#fff}
.quote-open:focus-visible{outline:3px solid var(--chosen-accent,#ff5a00);outline-offset:3px}

/* Form card (shared) */
.quote-progress{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:.8rem;color:#57667a;margin-bottom:10px;min-height:24px}
.quote-progress b{color:#14161b;letter-spacing:.01em}
.quote-back{border:0;background:none;font:inherit;font-size:.8rem;color:#3d526d;text-decoration:underline;text-underline-offset:3px;cursor:pointer;padding:4px 0}
.quote-back:hover{color:#152238}
.quote-back[hidden],.quote-q[hidden],.quote-other[hidden],.quote-done-note[hidden],.quote-q .button[hidden]{display:none}
.quote-bar{height:6px;background:#e6ecf4;border-radius:999px;overflow:hidden;margin-bottom:24px}
.quote-bar span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--chosen-accent,#ff5a00),#ff9a5c);border-radius:inherit;transition:width .5s cubic-bezier(.2,.8,.2,1)}
:is(.quote-dialog,.quote-inline) .quote-done-note{margin:0 0 14px;color:#863100;font-size:.85rem}
.quote-q{border:0;margin:0;padding:0;min-width:0;display:flex;flex-direction:column;gap:14px;animation:quote-in .3s cubic-bezier(.2,.8,.2,1)}
.quote-q legend{font-weight:650;font-size:1.15rem;line-height:1.35;letter-spacing:-.01em;color:#14161b;padding:0;margin-bottom:16px}
.quote-q legend span{font-weight:400;font-size:.9rem;color:#5d6c7e}
.quote-q legend [data-unit-label]{font-weight:inherit;font-size:inherit;color:inherit}
.quote-unit{display:inline-flex;align-self:flex-start;background:#eef2f7;border-radius:999px;padding:4px;gap:4px}
.quote-unit button{border:0;background:transparent;border-radius:999px;padding:8px 16px;min-height:36px;font:inherit;font-size:.85rem;color:#3d526d;cursor:pointer}
.quote-unit button[aria-pressed=true]{background:#fff;color:#152238;box-shadow:0 1px 3px #1522381f}
.quote-options{display:flex;flex-wrap:wrap;gap:8px}
.quote-options label{position:relative;display:inline-flex;align-items:center;gap:6px;min-height:46px;padding:10px 16px;border:1px solid #d9dce2;background:#fff;border-radius:12px;color:#1d2129;font-size:.93rem;cursor:pointer;box-shadow:0 1px 2px #1522380d;transition:background-color .2s ease,border-color .2s ease,color .2s ease,transform .2s ease,box-shadow .2s ease}
.quote-options label:hover{border-color:var(--chosen-accent,#ff5a00);box-shadow:0 4px 12px #ff5a001f}
.quote-options input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.quote-options label:has(input:checked){background:var(--chosen-accent,#ff5a00);border-color:var(--chosen-accent,#ff5a00);color:#1a100a;box-shadow:0 6px 16px #ff5a0040}
.quote-options label:has(input[type=checkbox]:checked)::before{content:"✓";font-weight:700}
.quote-options label:has(input:focus-visible){outline:3px solid var(--chosen-accent,#ff5a00);outline-offset:3px}
.quote-other,.quote-email,.quote-text{font:inherit;font-size:16px;color:#17293f;background:#fff;border:1px solid #b6c3d1;border-radius:12px;padding:12px 14px;min-height:48px;width:100%;box-sizing:border-box}
.quote-email:-webkit-autofill,.quote-other:-webkit-autofill,.quote-text:-webkit-autofill{-webkit-text-fill-color:#17293f;-webkit-box-shadow:0 0 0 100px #eef3fb inset;caret-color:#17293f}
.quote-q .button{width:100%;margin:0;background:var(--chosen-accent,#ff5a00);border-color:var(--chosen-accent,#ff5a00);color:#1a100a;min-height:50px;border-radius:12px}
.quote-q .button:disabled{opacity:.4;cursor:not-allowed}
:is(.quote-dialog,.quote-inline) .booking-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
:is(.quote-dialog,.quote-inline) .quote-privacy{font-size:12px;line-height:1.6;color:#617282;margin:0}
.quote-privacy a{color:#193d53;text-decoration:underline;text-underline-offset:3px}
.quote-message{padding:14px;background:#e2ebf6;color:#223d61;border:1px solid #afc4df;border-radius:10px;font-size:.9rem;line-height:1.6;margin:16px 0 0}
.quote-message[data-state=error]{background:#fdecea;color:#7a2318;border-color:#f2b8b0}
.quote-done{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;padding:20px 0 8px}
.quote-done-mark{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:#fff1e8;animation:quote-pop .5s cubic-bezier(.2,1.4,.4,1)}
.quote-done-mark svg{width:32px;height:32px;fill:none;stroke:var(--chosen-accent,#ff5a00);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
:is(.quote-dialog,.quote-inline) .quote-done h3{margin:6px 0 0;font-size:1.35rem;color:#152238}
:is(.quote-dialog,.quote-inline) .quote-done p{margin:0;max-width:40ch;color:#3d526d;line-height:1.6}
:is(.quote-dialog,.quote-inline) :focus-visible{outline:3px solid var(--chosen-accent,#ff5a00);outline-offset:3px}
.quote-confetti{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:2147483647}

/* Homepage dialog */
.quote-dialog{width:min(560px,calc(100% - 32px));max-height:calc(100dvh - 32px);padding:32px;border:1px solid #dce3e7;border-radius:20px;background:#fff;color:#152238;box-shadow:0 30px 90px #07111d44;box-sizing:border-box}
.quote-dialog::backdrop{background:#07111d88;backdrop-filter:blur(4px)}
.quote-dialog h2{font-size:1.45rem;line-height:1.25;letter-spacing:-.02em;margin:0 36px 6px 0;color:#152238}
.quote-dialog .quote-lead{margin:0 0 24px;color:#57667a;font-size:.92rem}
.quote-dialog .quote-steps{display:none}
.quote-close{position:absolute;top:14px;right:14px;width:44px;height:44px;border:0;border-radius:50%;background:#eef2f6;color:#20314c;font-size:1.5rem;line-height:1;cursor:pointer}

/* Case page: navy stage with the copy and steps on the left, the form card on the right */
html[data-theme] .case-quote-panel{margin-top:26px}
.quote-inline{position:relative;overflow:hidden;isolation:isolate;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);grid-template-rows:auto auto 1fr;column-gap:56px;padding:64px 56px;border-radius:18px;color:#fff;scroll-margin-top:96px;
  background:radial-gradient(circle at 6% 0%,#ff5a0047,transparent 42%),radial-gradient(circle at 100% 100%,#ff5a0026,transparent 45%),#0f1115}
.quote-inline::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.5;background-image:radial-gradient(#ffffff26 1px,transparent 1.5px);background-size:22px 22px;mask-image:linear-gradient(90deg,#000,transparent 60%)}
html[data-theme] .portfolio-panel .quote-inline h2{grid-column:1;align-self:end;margin:0 0 14px;font-size:clamp(1.7rem,3vw,2.4rem);line-height:1.12;letter-spacing:-.03em;color:#fff}
html[data-theme] .portfolio-panel .quote-inline p.quote-lead{grid-column:1;margin:0 0 32px;color:#c5cbd5;font-size:1rem}
.quote-inline form{grid-column:2;grid-row:1/4;align-self:center;background:#fff;color:#152238;border-radius:18px;padding:30px;box-shadow:0 30px 70px #00000047,0 0 0 1px #ffffff1f}
.quote-steps{grid-column:1;align-self:start;list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;counter-reset:qs}
.quote-steps li{counter-increment:qs;display:grid;grid-template-columns:36px 1fr;column-gap:14px;align-items:center;padding:10px 12px;border-radius:12px;color:#9aa1ad;transition:background-color .3s ease,color .3s ease}
.quote-steps li::before{content:counter(qs);grid-row:1/3;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;border:1px solid #ffffff40;font-weight:650;font-size:.9rem;transition:inherit}
.quote-steps b{font-size:1rem;color:#e8eaee}
.quote-steps span{font-size:.83rem}
.quote-steps li[aria-current]{background:#ffffff12;color:#c5cbd5}
.quote-steps li[aria-current] b{color:#fff}
.quote-steps li[aria-current]::before{background:#fff;color:#14161b;border-color:#fff}
.quote-steps li.is-done::before{content:"✓";background:var(--chosen-accent,#ff5a00);border-color:var(--chosen-accent,#ff5a00);color:#1a100a}

@keyframes quote-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes quote-pop{from{transform:scale(.4);opacity:0}to{transform:none;opacity:1}}
@media(max-width:860px){
  .quote-inline{grid-template-columns:1fr;grid-template-rows:none;padding:36px 20px 20px}
  html[data-theme] .portfolio-panel .quote-inline h2,html[data-theme] .portfolio-panel .quote-inline p.quote-lead,.quote-inline form,.quote-steps{grid-column:1;grid-row:auto}
  html[data-theme] .portfolio-panel .quote-inline p.quote-lead{margin-bottom:20px}
  .quote-steps{flex-direction:row;gap:6px;margin-bottom:20px}
  .quote-steps li{grid-template-columns:28px 1fr;column-gap:8px;padding:8px;flex:1}
  .quote-steps li::before{width:28px;height:28px;font-size:.8rem}
  .quote-steps b{font-size:.85rem}.quote-steps span{display:none}
  .quote-inline form{padding:22px 18px}
}
@media(max-width:480px){.quote-dialog{padding:24px 18px}.quote-dialog h2{font-size:1.25rem}.quote-options label{padding:10px 13px}}
@media(prefers-reduced-motion:reduce){.quote-bar span,.quote-steps li{transition:none}.quote-q,.quote-done-mark{animation:none}}
.quote-q .button:not(:disabled):hover{background:var(--chosen-hover,#d94c00);border-color:var(--chosen-hover,#d94c00)}
/* AI agent and plugin cases: form / call buttons under step 01 of the delivery timeline. */
.case-step-cta{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:16px}
html[data-theme] .portfolio-panel .case-step-cta p{flex-basis:100%;max-width:none;margin:0 0 2px;font-size:13px;color:#5f6573}
.case-step-cta a{display:inline-flex;align-items:center;min-height:42px;padding:0 18px;border-radius:999px;font-size:14px;font-weight:600;text-decoration:none;transition:background-color .2s ease,border-color .2s ease,color .2s ease}
.case-step-cta-main{background:var(--chosen-accent,#ff5a00);border:1px solid var(--chosen-accent,#ff5a00);color:#1a100a}
.case-step-cta-main:hover{background:var(--chosen-hover,#d94c00);border-color:var(--chosen-hover,#d94c00)}
.case-step-cta-alt{border:1px solid #c9ced6;color:#14161b}
.case-step-cta-alt:hover{border-color:#14161b}
.case-step-cta a:focus-visible{outline:3px solid var(--chosen-accent,#ff5a00);outline-offset:3px}
