:root {
    --navy: #0f2744;
    --navy-2: #1e3a5f;
    --blue: #315f88;
    --orange: #a94816;
    --sand: #f5e8d8;
    --paper: #ffffff;
    --canvas: #eef3f7;
    --ink: #172334;
    --muted: #627083;
    --line: #d8e1e8;
    --success: #18875d;
    --danger: #a63d40;
    --shadow: 0 24px 70px rgba(15, 39, 68, 0.16);
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--canvas); }
body {
    margin: 0;
    min-height: 100vh;
    color: var(--ink);
    background:
        radial-gradient(circle at 8% 16%, rgba(224, 123, 57, 0.14), transparent 25rem),
        radial-gradient(circle at 92% 8%, rgba(49, 95, 136, 0.16), transparent 30rem),
        var(--canvas);
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}

a { color: inherit; }
button, input, textarea { font: inherit; }
button, .choice-button { min-height: 44px; }

.consultation-shell {
    width: min(1180px, calc(100% - 40px));
    margin: calc(var(--header-height, 80px) + 54px) auto 70px;
    display: grid;
    grid-template-columns: minmax(250px, .8fr) minmax(520px, 1.25fr);
    gap: 54px;
    align-items: start;
}
.consultation-intro { padding-top: 34px; position: sticky; top: 20px; }
.eyebrow {
    display: inline-block;
    margin-bottom: 16px;
    color: var(--orange);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
}
h1 {
    margin: 0 0 20px;
    color: var(--navy);
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    font-weight: 700;
    font-size: clamp(2.35rem, 4.7vw, 4.7rem);
    line-height: .98;
    letter-spacing: -.045em;
}
.consultation-intro > p {
    max-width: 34rem;
    margin: 0;
    color: var(--muted);
    font-size: 1.08rem;
    line-height: 1.75;
}
.trust-row {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 28px;
}
.trust-row span {
    padding: 8px 11px;
    border: 1px solid rgba(49, 95, 136, .2);
    border-radius: 999px;
    color: var(--blue);
    background: rgba(255,255,255,.55);
    font-size: .76rem;
    font-weight: 700;
}

.chat-card {
    min-height: 660px;
    overflow: hidden;
    border: 1px solid rgba(15, 39, 68, .08);
    border-radius: 26px;
    background: rgba(255,255,255,.94);
    box-shadow: var(--shadow);
    backdrop-filter: blur(15px);
}
.chat-topbar {
    min-height: 76px;
    padding: 14px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--line);
    background: white;
}
.assistant-identity { display: flex; gap: 12px; align-items: center; }
.assistant-identity > span:last-child { display: grid; }
.assistant-identity strong { color: var(--navy); font-size: .92rem; }
.assistant-identity small { margin-top: 2px; color: var(--muted); }
.assistant-identity small i {
    display: inline-block;
    width: 7px;
    height: 7px;
    margin-right: 5px;
    border-radius: 50%;
    background: #2bb673;
}
.assistant-avatar {
    display: grid;
    place-items: center;
    width: 45px;
    height: 45px;
    border-radius: 15px;
    color: white;
    background: linear-gradient(145deg, var(--navy-2), var(--navy));
    font-weight: 800;
    box-shadow: 0 7px 18px rgba(15,39,68,.2);
}
.restart-button {
    border: 0;
    color: var(--muted);
    background: transparent;
    cursor: pointer;
    font-size: .8rem;
    font-weight: 700;
    white-space: nowrap;
}
.restart-button:hover, .restart-button:focus-visible { color: var(--orange); }

.progress-wrap {
    padding: 14px 22px 10px;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 12px;
    align-items: center;
    color: var(--muted);
    font-size: .72rem;
    font-weight: 700;
}
.progress-track {
    height: 5px;
    overflow: hidden;
    border-radius: 99px;
    background: #e5ebf0;
}
.progress-track span {
    display: block;
    width: 0;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--orange), #eeaa70);
    transition: width .4s ease;
}

.chat-log {
    height: 370px;
    overflow-y: auto;
    padding: 22px;
    scroll-behavior: smooth;
}
.message {
    display: flex;
    gap: 9px;
    margin-bottom: 16px;
    animation: message-in .3s ease both;
}
.message.user { justify-content: flex-end; }
.message-bubble {
    max-width: min(82%, 520px);
    padding: 12px 15px;
    border-radius: 17px 17px 17px 5px;
    color: var(--ink);
    background: #eef3f7;
    line-height: 1.5;
    white-space: pre-wrap;
}
.message.user .message-bubble {
    border-radius: 17px 17px 5px 17px;
    color: white;
    background: var(--navy-2);
}
.message-meta {
    display: block;
    margin-top: 5px;
    color: #4f5f72;
    font-size: .68rem;
}
.message.user .message-meta { color: rgba(255,255,255,.9); }
.typing-bubble { display: inline-flex; gap: 5px; padding: 15px 17px; }
.typing-bubble i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--blue);
    animation: typing 1s infinite ease-in-out;
}
.typing-bubble i:nth-child(2) { animation-delay: .14s; }
.typing-bubble i:nth-child(3) { animation-delay: .28s; }

.response-area {
    min-height: 132px;
    padding: 18px 22px 22px;
    border-top: 1px solid var(--line);
    background: #fbfcfd;
}
.response-form { display: grid; gap: 12px; }
.response-form label { color: var(--navy); font-size: .82rem; font-weight: 800; }
.response-form input,
.response-form textarea {
    width: 100%;
    border: 1.5px solid #cbd6df;
    border-radius: 14px;
    outline: none;
    padding: 13px 14px;
    color: var(--ink);
    background: white;
    font-size: 1rem;
    transition: border .2s, box-shadow .2s;
}
.response-form textarea { min-height: 98px; resize: vertical; }
.response-form input:focus,
.response-form textarea:focus {
    border-color: var(--blue);
    box-shadow: 0 0 0 4px rgba(49,95,136,.12);
}
.response-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.response-help { color: var(--muted); font-size: .75rem; }
.next-button, .send-button {
    border: 0;
    border-radius: 12px;
    padding: 11px 17px;
    color: white;
    background: var(--orange);
    box-shadow: 0 8px 18px rgba(224,123,57,.23);
    cursor: pointer;
    font-weight: 800;
}
.next-button:hover, .send-button:hover { background: #8f3d12; transform: translateY(-1px); }
.next-button:focus-visible, .send-button:focus-visible, .choice-button:focus-visible {
    outline: 3px solid #315f88;
    outline-offset: 2px;
}
.choice-grid { display: flex; flex-wrap: wrap; gap: 9px; }
.choice-button {
    border: 1px solid #ccd7df;
    border-radius: 12px;
    padding: 9px 12px;
    color: var(--navy-2);
    background: white;
    cursor: pointer;
    font-weight: 700;
    text-align: left;
}
.choice-button:hover, .choice-button.selected {
    border-color: var(--orange);
    color: #9f4e1f;
    background: #fff5ed;
}
.validation-error { margin: 0; color: var(--danger); font-size: .8rem; font-weight: 700; }

.consent-panel {
    padding: 18px 22px 24px;
    border-top: 1px solid var(--line);
    background: #fbfcfd;
}
.consent-label { display: flex; gap: 10px; color: var(--muted); font-size: .79rem; line-height: 1.45; }
.consent-label input { width: 18px; height: 18px; flex: 0 0 auto; accent-color: var(--orange); }
.captcha-row {
    margin: 14px 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    color: var(--navy);
    font-size: .84rem;
}
.captcha-row input {
    width: 78px;
    border: 1px solid #cbd6df;
    border-radius: 9px;
    padding: 9px;
}
.send-button { width: 100%; }
.submit-status { min-height: 1.4em; margin: 10px 0 0; font-size: .83rem; font-weight: 700; }
.submit-status.error { color: var(--danger); }
.submit-status.success { color: var(--success); }
.honeypot { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; }

.office-strip {
    grid-column: 2;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}
.office-strip div {
    padding: 16px 18px;
    display: grid;
    gap: 3px;
    border: 1px solid rgba(15,39,68,.1);
    border-radius: 16px;
    background: rgba(255,255,255,.65);
}
.office-strip strong { color: var(--navy); font-size: .86rem; }
.office-strip a { overflow-wrap: anywhere; color: var(--blue); font-size: .76rem; text-decoration: none; }
.office-strip a:hover { color: var(--orange); }

.site-credit {
    padding: 12px 20px 16px;
    border-top: 1px solid rgba(255,255,255,.06);
    color: rgba(255,255,255,.55);
    background: var(--primary-dark, #0f2744);
    text-align: center;
    font-size: 12px;
}
.site-credit a { color: inherit; }
.site-credit strong { color: #d4a574; }
.site-credit a:hover,
.site-credit a:focus-visible { color: white; }

@keyframes message-in { from { transform: translateY(8px); } }
@keyframes typing { 0%, 60%, 100% { transform: translateY(0); opacity: .45; } 30% { transform: translateY(-4px); opacity: 1; } }

@media (max-width: 900px) {
    .consultation-shell { grid-template-columns: 1fr; gap: 26px; margin-top: calc(var(--header-height, 80px) + 24px); }
    .consultation-intro { position: static; padding-top: 15px; }
    h1 { max-width: 720px; }
    .office-strip { grid-column: 1; }
}
@media (max-width: 620px) {
    .consultation-shell { width: calc(100% - 22px); margin-bottom: 28px; }
    h1 { font-size: 2.55rem; }
    .consultation-intro > p { font-size: .98rem; }
    .chat-card { min-height: 610px; border-radius: 20px; }
    .chat-log { height: 330px; padding: 16px; }
    .response-area, .consent-panel { padding: 16px; }
    .message-bubble { max-width: 88%; }
    .office-strip { grid-template-columns: 1fr; }
    .response-actions { align-items: stretch; flex-direction: column; }
    .next-button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}