

.site-header {
   position:sticky;
   top:0;
   z-index:100;
   background-color:var(--ground);
   border-bottom:1px solid var(--border);
   transition:background-color var(--dur-normal) var(--ease-standard),
                     border-color var(--dur-normal) var(--ease-standard),
                     padding var(--dur-normal) var(--ease-standard);
   width:100%;
}

@supports (backdrop-filter: blur(8px)) {
   .site-header {
      background-color:rgba(228, 234, 227, 0.94);
      backdrop-filter:blur(8px);
   }
}

.site-header.condensed {
   border-bottom-color:var(--border-strong);
   box-shadow:0 4px 16px rgba(20, 34, 26, 0.06);
}

.header-inner {
   display:flex;
   align-items:center;
   justify-content:space-between;
   height:clamp(4.2rem, 6vw, 5.2rem);
   gap:var(--space-m);
}

.site-header.condensed .header-inner { height:clamp(3.6rem, 5vw, 4.4rem); }

.brand {
   display:inline-flex;
   align-items:center;
   text-decoration:none;
   flex-shrink:0;
}

.brand-logo {
   height:3.2rem;
   width:auto;
   display:block;
}

.site-header.condensed .brand-logo { height:2.7rem; }

/* Header Right Group */
.header-right {
   display:flex;
   align-items:center;
   gap:var(--space-m);
}

.header-phone-badge {
   display:inline-flex;
   align-items:center;
   gap:var(--space-2xs);
   font-family:var(--demo-0d6);
   font-size:var(--step--1);
   font-weight:500;
   color:var(--ink);
   text-decoration:none;
   padding:0.45rem 0.85rem;
   background-color:var(--surface);
   border:1px solid var(--border);
   min-height:44px;
   transition:background-color var(--dur-fast) var(--ease-standard),
                     border-color var(--dur-fast) var(--ease-standard),
                     color var(--dur-fast) var(--ease-standard);
}

.header-phone-badge:hover {
   background-color:var(--surface-lift);
   border-color:var(--border-strong);
   color:var(--accent);
}

.header-phone-badge:active {
   background-color:var(--surface-inset);
   border-color:var(--ink);
}

.header-phone-badge:focus-visible {
   outline:2px solid var(--accent);
   outline-offset:2px;
}

/* Compact Right Nav Rail */
.nav-rail {
   display:flex;
   align-items:center;
}

.nav-toggle {
   display:none;
   align-items:center;
   justify-content:center;
   gap:var(--space-2xs);
   background-color:var(--surface);
   border:1px solid var(--border);
   color:var(--ink);
   padding:0.5rem 0.9rem;
   font-family:var(--demo-0d6);
   font-size:var(--step--1);
   text-transform:uppercase;
   letter-spacing:0.05em;
   cursor:pointer;
   min-height:44px;
   min-width:44px;
   transition:background-color var(--dur-fast) var(--ease-standard),
                     border-color var(--dur-fast) var(--ease-standard),
                     color var(--dur-fast) var(--ease-standard);
}

.nav-toggle:hover {
   background-color:var(--surface-lift);
   border-color:var(--border-strong);
}

.nav-toggle:active {
   background-color:var(--surface-inset);
   border-color:var(--ink);
}

.nav-toggle:focus-visible {
   outline:2px solid var(--accent);
   outline-offset:2px;
}

.nav-list {
   display:flex;
   align-items:center;
   list-style:none;
   gap:var(--space-xs);
   margin:0;
   padding:0;
}

.nav-link {
   display:inline-flex;

   align-items:center;
   padding:0.5rem 0.85rem;
   font-family:var(--demo-0d6);
   font-size:var(--step--1);
   color:var(--ink-secondary);
   text-decoration:none;
   border-bottom:2px solid transparent;
   min-height:44px;
   transition:color var(--dur-fast) var(--ease-standard),
                     background-color var(--dur-fast) var(--ease-standard),
                     border-color var(--dur-fast) var(--ease-standard);
}

.nav-link:hover {
   color:var(--ink);
   background-color:var(--surface);
   border-bottom-color:var(--border);
}

.nav-link:active {
   background-color:var(--surface-inset);
   border-bottom-color:var(--accent);
}

.nav-link:focus-visible {
   outline:2px solid var(--accent);
   outline-offset:2px;
}

.nav-link[aria-current='page'] {
   color:#14221a;
   font-weight:700;
   border-bottom-color:var(--accent);
   background-color:var(--surface-lift);
}

/* Mobile & Tablet Nav Behavior */
@media (max-width: 1024px) {
   .header-phone-badge .phone-text { display:none; }
}

@media (max-width: 880px) {
   .nav-toggle { display:inline-flex; }

   .nav-list {
      position:fixed;
      top:clamp(4.2rem, 6vw, 5.2rem);
      right:0;
      width:min(340px, 86vw);
      height:calc(100vh - clamp(4.2rem, 6vw, 5.2rem));
      background-color:var(--ground);
      border-left:1px solid var(--border);
      flex-direction:column;
      align-items:stretch;
      padding:var(--space-m) var(--space-s);
      gap:var(--space-2xs);
      box-shadow:-8px 0 24px rgba(20, 34, 26, 0.12);
      overflow-y:auto;
      transform:translateX(100%);
      transition:transform var(--dur-normal) var(--ease-standard);
      visibility:hidden;
   }

   .nav-list.is-open {
      transform:translateX(0);
      visibility:visible;
   }

   .nav-link {
      width:100%;
      padding:var(--space-s) var(--space-m);
      border-left:3px solid transparent;
      border-bottom:1px solid var(--border-subtle);
   }

   .nav-link:hover { border-left-color:var(--border-strong); }

   .nav-link[aria-current='page'] {
      border-left-color:var(--accent);
      border-bottom-color:var(--border-subtle);
   }
}


.btn {
   display:inline-flex;
   align-items:center;
   justify-content:center;
   gap:var(--space-2xs);
   padding:0.65rem 1.4rem;
   min-height:44px;
   max-width:100%;
   font-family:var(--demo-0d6);
   font-size:var(--step--1);
   font-weight:500;
   text-decoration:none;
   cursor:pointer;
   border-radius:0;
   line-height:1.25;
   white-space:normal;
   text-align:center;
   transition:background-color var(--dur-fast) var(--ease-standard),
                     border-color var(--dur-fast) var(--ease-standard),
                     color var(--dur-fast) var(--ease-standard),
                     box-shadow var(--dur-fast) var(--ease-standard);
}

.footer-col-links .btn {
   white-space:normal;
   padding:0.65rem 1rem;
}

.btn-primary {
   background-color:#824005;

   color:#ffffff;
   border:1px solid #824005;
}

.btn-primary:hover {
   background-color:#6b3402;
   border-color:#6b3402;
   color:#ffffff;
   box-shadow:0 2px 8px rgba(130, 64, 5, 0.28);
}

.btn-primary:active {
   background-color:#552701;
   border-color:#552701;
   box-shadow:inset 0 2px 4px rgba(0, 0, 0, 0.2);
}

.btn-primary:focus-visible {
   outline:2px solid var(--ink);
   outline-offset:3px;
}

.btn-secondary {
   background-color:transparent;
   color:var(--ink);
   border:1px solid var(--ink);
}

.btn-secondary:hover {
   background-color:var(--ink);
   color:var(--ground);
}

.btn-secondary:active {
   background-color:var(--ink-secondary);
   border-color:var(--ink-secondary);
   color:var(--ground);
}

.btn-secondary:focus-visible {
   outline:2px solid var(--accent);
   outline-offset:2px;
}

.btn-outline {
   background-color:var(--surface);
   color:var(--ink);
   border:1px solid var(--border);
}

.btn-outline:hover {
   background-color:var(--surface-lift);
   border-color:var(--border-strong);
}

.btn-outline:active {
   background-color:var(--surface-inset);

   border-color:var(--ink);
}

.btn-outline:focus-visible {
   outline:2px solid var(--accent);
   outline-offset:2px;
}

.btn-signal {
   background-color:var(--signal);
   color:#ffffff;
   border:1px solid var(--signal);
}

.btn-signal:hover {
   background-color:#9c2e1f;
   border-color:#9c2e1f;
   box-shadow:0 2px 8px rgba(179, 57, 39, 0.35);
}

.btn-signal:active {
   background-color:#822416;
   border-color:#822416;
   box-shadow:inset 0 2px 4px rgba(0, 0, 0, 0.25);
}

.btn-signal:focus-visible {
   outline:2px solid var(--ink);
   outline-offset:3px;
}


.table-wrap {
   width:100%;
   overflow-x:auto;
   -webkit-overflow-scrolling:touch;
   margin-bottom:var(--space-m);
   border:1px solid var(--border);
   background-color:var(--ground);
}

.spec-table {
   width:100%;
   text-align:left;
   font-size:var(--step--1);
   border-collapse:collapse;
}

.spec-table th,
.spec-table td {
   padding:0.85rem 1rem;
   border-bottom:1px solid var(--border);
   vertical-align:top;
}

@media (max-width: 820px) {
   .note4f5.banu3f8 > table,
   .note4f5.banu3f8 > table > tbody,
   .note4f5.banu3f8 > table > tbody > tr,
   .note4f5.banu3f8 > table > tbody > tr > td,
   .note4f5.banu3f8 > table > tbody > tr > th {
      display:block !important;
      inline-size:auto !important;
      min-inline-size:0 !important;
      width:100% !important;
   }
   .note4f5.banu3f8 > table > thead { display:none !important; }
   .note4f5.banu3f8 > table > tbody > tr {
      margin-block-end:.75rem !important;
      padding:.5rem .75rem !important;
      border:1px solid var(--border) !important;
      background-color:var(--surface) !important;
   }
   .note4f5.banu3f8 > table > tbody > tr > td {
      padding-block:.35rem !important;
      padding-inline:0 !important;
      border-bottom:1px solid var(--border-subtle) !important;
   }
   .note4f5.banu3f8 > table > tbody > tr > td:last-child { border-bottom:none !important; }
   .note4f5.banu3f8 > table > tbody > tr > td[data-label]::before {
      content:attr(data-label);
      display:block !important;
      font-size:.82em !important;
      font-weight:600 !important;
      letter-spacing:.02em !important;
      opacity:.68 !important;
      font-family:var(--demo-0d6) !important;
      text-transform:uppercase !important;
   }
}

.spec-table th {
   font-family:var(--demo-0d6);
   font-size:var(--step--2);
   letter-spacing:0.06em;
   text-transform:uppercase;
   color:var(--muted);
   background-color:var(--surface);
   font-weight:600;
}

.spec-table tr:last-child td { border-bottom:none; }

.spec-table tr:hover td { background-color:var(--surface-lift); }

.spec-table .col-price {
   font-family:var(--demo-0d6);
   font-weight:700;
   color:var(--ink);
   white-space:nowrap;
}

.spec-table .col-basis {
   min-width:130px;
   font-family:var(--demo-0d6);
   color:var(--muted);
   font-size:var(--step--2);
}

.spec-table td[data-label='Trade Scope'],
.spec-table td[data-label='Service Category'] { min-width:140px; }

.spec-table .badge-signal {
   display:inline-block;
   padding:0.2rem 0.5rem;
   background-color:var(--signal-bg);
   border:1px solid var(--signal-border);
   color:var(--signal);
   font-family:var(--demo-0d6);
   font-size:var(--step--2);
   font-weight:600;
}


.margin-block {
   margin-bottom:var(--space-l);
   font-size:var(--step--1);
   line-height:1.5;
}

.margin-block:last-child { margin-bottom:0; }

.margin-block .datum-label {
   font-family:var(--demo-0d6);
   font-size:var(--step--2);
   text-transform:uppercase;
   letter-spacing:0.08em;
   color:var(--muted);
   margin-bottom:var(--space-3xs);
   display:block;
}

.margin-block .datum-figure {
   font-family:var(--demo-0d6);
   font-size:var(--demo-1bc);
   font-weight:700;
   color:var(--ink);
   display:block;
   line-height:1.2;
}

.margin-block .datum-desc {
   font-family:var(--demo-3fd);
   font-size:var(--step--1);
   color:var(--muted);
   margin-top:var(--space-3xs);
}

.margin-thumb {
   margin-top:var(--space-xs);
   margin-bottom:var(--space-xs);
   border:1px solid var(--border);
   background-color:var(--surface);
}

.margin-thumb img {
   width:100%;
   aspect-ratio:4 / 3;
   object-fit:cover;
   display:block;
}

.margin-thumb figcaption {
   font-family:var(--demo-0d6);
   font-size:var(--step--2);
   color:var(--muted);
   padding:0.4rem 0.6rem;
   background-color:var(--surface);
   border-top:1px solid var(--border-subtle);
}


.trade-block {
   border:1px solid var(--border);
   background-color:var(--surface);
   padding:var(--space-m);
   margin-bottom:var(--space-m);
   display:grid;
   grid-template-columns:minmax(0, 1fr) auto;
   gap:var(--space-m);
   align-items:start;
   transition:border-color var(--dur-fast) var(--ease-standard),
                     background-color var(--dur-fast) var(--ease-standard);
}

.trade-block:hover {
   border-color:var(--border-strong);
   background-color:var(--surface-lift);
}

.trade-block-body { min-width:0; }

.trade-block-title {
   font-family:var(--demo-6d4);
   font-size:var(--demo-1bc);
   font-weight:600;
   margin-bottom:var(--space-3xs);
}

.trade-block-desc {
   font-size:var(--step--1);
   color:var(--muted);
   margin-bottom:var(--space-xs);
   max-width:58ch;
}

.trade-block-price {
   font-family:var(--demo-0d6);
   font-size:var(--demo-d82);
   font-weight:700;
   color:var(--ink);
   background-color:var(--ground);
   padding:0.4rem 0.8rem;
   border:1px solid var(--border);
   white-space:nowrap;
   display:inline-block;
}

@media (max-width: 600px) {
   .trade-block {
      grid-template-columns:1fr;
      gap:var(--space-s);
   }
}


.inquiry-form {
   background-color:var(--surface);
   border:1px solid var(--border);
   padding:clamp(1.25rem, 3.5vw, 2.5rem);
}

.form-grid {
   display:grid;
   grid-template-columns:repeat(2, minmax(0, 1fr));
   gap:var(--space-m);
}

@media (max-width: 640px) {
   .form-grid {
      grid-template-columns:1fr;
      gap:var(--space-s);
   }
}

.form-field {
   display:flex;
   flex-direction:column;
   gap:var(--space-3xs);
}

.form-field-full { grid-column:1 / -1; }

.form-label {
   font-family:var(--demo-0d6);
   font-size:var(--step--1);
   font-weight:500;
   color:var(--ink);
   display:flex;
   justify-content:space-between;
   align-items:baseline;
}

.form-label .label-aside {
   font-size:var(--step--2);
   color:var(--muted);
   font-weight:400;
}

.form-control {
   font-family:var(--demo-3fd);
   font-size:var(--demo-d82);
   padding:0.65rem 0.9rem;
   background-color:var(--ground);
   border:1px solid var(--border);
   color:var(--ink);
   border-radius:0;
   min-height:44px;
   line-height:1.4;
   transition:border-color var(--dur-fast) var(--ease-standard),
                     background-color var(--dur-fast) var(--ease-standard),
                     box-shadow var(--dur-fast) var(--ease-standard);
}

.form-control:hover { border-color:var(--border-strong); }

.form-control:focus {
   outline:none;
   border-color:var(--accent);
   box-shadow:0 0 0 2px var(--accent-subtle);
   background-color:#ffffff;
}

.form-control.is-invalid {
   border-color:var(--signal);
   background-color:var(--signal-bg);
}

.form-control.is-invalid:focus { box-shadow:0 0 0 2px rgba(179, 57, 39, 0.25); }

textarea.form-control {
   min-height:110px;
   resize:vertical;
}

.form-error {
   font-family:var(--demo-0d6);
   font-size:var(--step--2);
   color:var(--signal);
   margin-top:var(--space-3xs);
   display:none;
}

.form-control.is-invalid + .form-error,
.form-error.is-visible { display:block; }

/* Consent Checkbox Custom Style */
.checkbox-field {
   display:grid;
   grid-template-columns:auto minmax(0, 1fr);
   gap:var(--space-xs);
   align-items:start;
   margin-top:var(--space-xs);
}

.checkbox-input {
   width:20px;
   height:20px;
   margin-top:3px;
   border:1px solid var(--border-strong);
   border-radius:0;
   accent-color:var(--accent);
   cursor:pointer;
   min-width:20px;
   min-height:20px;
}

.checkbox-input:focus-visible {
   outline:2px solid var(--accent);
   outline-offset:2px;
}

.checkbox-label {
   font-size:var(--step--1);
   color:var(--ink-secondary);
   line-height:1.5;
   cursor:pointer;
}

.checkbox-label a {
   color:var(--ink);
   text-decoration:underline;
}

/* Honeypot anti-spam fields: completely visually hidden, zero height */
.trap-field {
   position:absolute !important;
   left:-9999px !important;
   width:1px !important;
   height:1px !important;
   opacity:0 !important;
   pointer-events:none !important;
   clip:rect(0, 0, 0, 0) !important;
}

/* Form Status Messages */
.form-status {
   padding:var(--space-m);
   margin-top:var(--space-m);
   font-family:var(--demo-0d6);
   font-size:var(--step--1);
   border:1px solid var(--border);
   display:none;
}

.form-status.status-success {
   display:block;
   background-color:var(--surface-lift);
   border-color:var(--border-strong);
   color:var(--ink);
}

.form-status.status-error {
   display:block;
   background-color:var(--signal-bg);
   border-color:var(--signal-border);
   color:var(--signal);
}


.site-footer {
   background-color:var(--surface);
   border-top:1px solid var(--border);
   padding-top:clamp(3rem, 6vw, 5rem);
   padding-bottom:clamp(2rem, 4vw, 3.5rem);
   margin-top:auto;
   position:relative;
   z-index:2;
}

.footer-grid {
   display:grid;
   grid-template-columns:minmax(0, 1.8fr) repeat(2, minmax(0, 1fr)) minmax(0, 1.2fr);
   gap:var(--space-l);
   margin-bottom:var(--space-2xl);
}

@media (max-width: 960px) {
   .footer-grid {
      grid-template-columns:repeat(2, minmax(0, 1fr));
      gap:var(--space-l);
   }
}

@media (max-width: 580px) {
   .footer-grid {
      grid-template-columns:1fr;
      gap:var(--space-m);
   }
}

.footer-col-brand .footer-logo {
   height:3.6rem;
   width:auto;
   margin-bottom:var(--space-s);
}

.footer-tagline {
   font-size:var(--step--1);
   color:var(--muted);
   max-width:38ch;
   margin-bottom:var(--space-m);
}

.footer-col-title {
   font-family:var(--demo-0d6);
   font-size:var(--step--2);
   text-transform:uppercase;
   letter-spacing:0.08em;
   color:var(--ink);
   margin-bottom:var(--space-s);
   font-weight:700;
}

.footer-links {
   list-style:none;
   padding:0;
   margin:0;
}

.footer-links li { margin-bottom:var(--space-xs); }

.footer-link {
   font-size:var(--step--1);
   color:var(--muted);
   text-decoration:none;
   display:inline-flex;
   align-items:center;
   gap:var(--space-3xs);
   min-height:44px;
}

.footer-link:hover { color:var(--ink); }

.footer-link:active { color:var(--accent); }

.footer-link:focus-visible {
   outline:2px solid var(--accent);
   outline-offset:2px;
}

.footer-contact-item {
   display:flex;
   align-items:flex-start;
   gap:var(--space-2xs);
   font-size:var(--step--1);
   color:var(--ink-secondary);
   margin-bottom:var(--space-xs);
   line-height:1.45;
}

.footer-contact-item .icon {
   margin-top:0.15em;
   color:var(--accent);
}

.footer-contact-item a {
   color:var(--ink);
   text-decoration:none;
}

.footer-contact-item a:hover {
   color:var(--accent);
   text-decoration:underline;
}

/* Mandatory Legal Bar */
.footer-legal-bar {
   border-top:1px solid var(--border);
   padding-top:var(--space-m);
   display:flex;
   align-items:center;
   justify-content:space-between;
   flex-wrap:wrap;
   gap:var(--space-m);
   font-size:var(--step--2);
   font-family:var(--demo-0d6);
   color:var(--muted);
}

.legal-links-list {
   display:flex;
   flex-wrap:wrap;
   align-items:center;
   gap:var(--space-s);
   list-style:none;
   padding:0;
   margin:0;
}

.legal-link {
   color:var(--muted);
   text-decoration:none;
   min-height:44px;
   display:inline-flex;
   align-items:center;
}

.legal-link:hover {
   color:var(--ink);
   text-decoration:underline;
}

.legal-link:active { color:var(--accent); }

.legal-link:focus-visible {
   outline:2px solid var(--accent);
   outline-offset:2px;
}

.consent-reopen-btn {
   background:none;
   border:none;
   padding:0;
   font-family:var(--demo-0d6);
   font-size:var(--step--2);
   color:var(--muted);
   cursor:pointer;
   text-decoration:underline;
   min-height:44px;
   display:inline-flex;
   align-items:center;
}

.consent-reopen-btn:hover { color:var(--ink); }

.consent-reopen-btn:active { color:var(--accent); }

.consent-reopen-btn:focus-visible {
   outline:2px solid var(--accent);
   outline-offset:2px;
}


.cookie-banner {
   position:fixed;
   bottom:0;
   left:0;
   right:0;
   z-index:900;
   background-color:#14221a;
   color:var(--ground);
   border-top:2px solid #824005;
   padding:0.85rem var(--gutter);
   box-shadow:0 -4px 20px rgba(0, 0, 0, 0.18);
   transform:translateY(110%);
   transition:transform var(--dur-normal) var(--ease-standard);
}

.cookie-banner.is-visible { transform:translateY(0); }

.cookie-banner-inner {
   max-width:var(--max-width);
   margin-left:auto;
   margin-right:auto;
   display:flex;
   align-items:center;
   justify-content:space-between;
   gap:var(--space-m);
   flex-wrap:wrap;
}

.cookie-text {
   font-family:var(--demo-0d6);
   font-size:var(--step--2);
   line-height:1.45;
   color:#dce3db;
   margin:0;
   max-width:72ch;
}

.cookie-text a {
   color:#ffffff;
   text-decoration:underline;
}

.cookie-text a:hover { color:var(--accent-subtle); }

.cookie-actions {
   display:flex;
   align-items:center;
   gap:var(--space-xs);
   flex-shrink:0;
}

.cookie-btn {
   font-family:var(--demo-0d6);
   font-size:var(--step--2);
   font-weight:600;
   padding:0.45rem 1rem;
   border-radius:0;
   cursor:pointer;
   min-height:44px;
   line-height:1.2;
   transition:background-color var(--dur-fast) var(--ease-standard),
                     border-color var(--dur-fast) var(--ease-standard),
                     color var(--dur-fast) var(--ease-standard);
}

.cookie-btn-accept {
   background-color:#824005;
   color:#ffffff;
   border:1px solid #824005;
}

.cookie-btn-accept:hover {
   background-color:#6b3402;
   border-color:#6b3402;
}

.cookie-btn-accept:active { background-color:#552701; }

.cookie-btn-accept:focus-visible {
   outline:2px solid #ffffff;
   outline-offset:2px;
}

.cookie-btn-decline {
   background-color:transparent;
   color:#dce3db;
   border:1px solid #8f9e8d;
}

.cookie-btn-decline:hover {
   background-color:rgba(255, 255, 255, 0.12);
   color:#ffffff;
   border-color:#ffffff;
}

.cookie-btn-decline:active { background-color:rgba(255, 255, 255, 0.2); }

.cookie-btn-decline:focus-visible {
   outline:2px solid #ffffff;
   outline-offset:2px;
}


.chat-widget {
   position:fixed;
   bottom:var(--space-m);
   right:var(--space-m);
   z-index:850;
   display:flex;
   flex-direction:column;
   align-items:flex-end;
   transition:bottom var(--dur-normal) var(--ease-standard);
}

/* Step up when cookie banner is visible */
body.cookie-banner-open .chat-widget { bottom:clamp(4.5rem, 10vh, 6.5rem); }

.chat-launcher {
   display:inline-flex;
   align-items:center;
   justify-content:center;
   gap:var(--space-2xs);
   padding:0.65rem 1.15rem;
   min-height:44px;
   background-color:var(--ink);
   color:var(--ground);
   border:1px solid var(--ink);
   font-family:var(--demo-0d6);
   font-size:var(--step--1);
   font-weight:500;
   cursor:pointer;
   box-shadow:0 4px 16px rgba(20, 34, 26, 0.2);
   border-radius:0;
   transition:background-color var(--dur-fast) var(--ease-standard),
                     border-color var(--dur-fast) var(--ease-standard),
                     transform var(--dur-fast) var(--ease-standard),
                     box-shadow var(--dur-fast) var(--ease-standard);
}

.chat-launcher:hover {
   background-color:var(--ink-secondary);
   border-color:var(--accent);
   box-shadow:0 6px 20px rgba(20, 34, 26, 0.28);
}

.chat-launcher:active {
   background-color:#0a130e;
   transform:translateY(1px);
}

.chat-launcher:focus-visible {
   outline:2px solid var(--accent);
   outline-offset:3px;
}

.chat-launcher .unread-badge {
   background-color:var(--signal);
   color:#ffffff;
   font-size:var(--step--2);
   font-weight:700;
   padding:0.15rem 0.45rem;
   border-radius:0;
   display:none;
}

.chat-launcher .unread-badge.is-visible { display:inline-block; }

/* Chat Panel */
.chat-panel {
   width:min(380px, 92vw);
   height:min(520px, 78vh);
   background-color:var(--ground);
   border:1px solid var(--border-strong);
   box-shadow:0 12px 36px rgba(20, 34, 26, 0.24);
   display:none;
   flex-direction:column;
   margin-bottom:var(--space-xs);
   position:relative;
}

.chat-panel.is-open { display:flex; }

.chat-panel-header {
   background-color:var(--ink);
   color:var(--ground);
   padding:0.75rem 1rem;
   display:flex;
   align-items:center;
   justify-content:space-between;
   border-bottom:2px solid var(--accent);
}

.chat-title-group {
   display:flex;
   flex-direction:column;
}

.chat-panel-title {
   font-family:var(--demo-6d4);
   font-size:var(--demo-d82);
   font-weight:600;
   color:#ffffff;
   margin:0;
}

.chat-panel-sub {
   font-family:var(--demo-0d6);
   font-size:var(--step--2);
   color:#b6c2b4;
}

.chat-close-btn {
   background:transparent;
   border:1px solid #405347;
   color:#dce3db;
   padding:0.35rem;
   cursor:pointer;
   min-height:44px;
   min-width:44px;
   display:inline-flex;
   align-items:center;
   justify-content:center;
   transition:background-color var(--dur-fast) var(--ease-standard),
                     color var(--dur-fast) var(--ease-standard);
}

.chat-close-btn:hover {
   background-color:rgba(255, 255, 255, 0.15);
   color:#ffffff;
}

.chat-close-btn:active { background-color:rgba(255, 255, 255, 0.25); }

.chat-close-btn:focus-visible {
   outline:2px solid var(--accent);
   outline-offset:2px;
}

.chat-body {
   flex:1 1 auto;
   overflow-y:auto;
   padding:var(--space-s);
   display:flex;
   flex-direction:column;
   gap:var(--space-xs);
   background-color:var(--surface);
}

.chat-msg {
   max-width:82%;
   padding:0.65rem 0.85rem;
   font-size:var(--step--1);
   line-height:1.45;
}

.chat-msg-agent {
   align-self:flex-start;
   background-color:var(--ground);
   border:1px solid var(--border);
   color:var(--ink);
}

.chat-msg-user {
   align-self:flex-end;
   background-color:var(--ink);
   color:#ffffff;
   border:1px solid var(--ink);
}

.chat-msg-meta {
   font-family:var(--demo-0d6);
   font-size:var(--step--2);
   color:var(--muted);
   margin-top:0.25rem;
   display:block;
}

.chat-msg-user .chat-msg-meta { color:#b6c2b4; }

/* Chat Gate / First Step Form */
.chat-gate {
   padding:var(--space-s);
   background-color:var(--ground);
   border-top:1px solid var(--border);
   display:flex;
   flex-direction:column;
   gap:var(--space-xs);
}

.chat-input-wrap {
   padding:var(--space-xs);
   background-color:var(--ground);
   border-top:1px solid var(--border);
   display:flex;
   gap:var(--space-2xs);
}

.chat-text-input {
   flex:1 1 auto;
   padding:0.5rem 0.75rem;
   background-color:var(--surface);
   border:1px solid var(--border);
   font-size:var(--step--1);
   min-height:44px;
}

.chat-text-input:focus {
   outline:none;
   border-color:var(--accent);
   background-color:#ffffff;
}

.chat-send-btn {
   padding:0.5rem 0.9rem;
   background-color:#824005;
   color:#ffffff;
   border:1px solid #824005;
   cursor:pointer;
   min-height:44px;
   font-family:var(--demo-0d6);
   font-size:var(--step--1);
   transition:background-color var(--dur-fast) var(--ease-standard);
}

.chat-send-btn:hover { background-color:#6b3402; }

.chat-send-btn:active { background-color:#552701; }

.chat-send-btn:focus-visible {
   outline:2px solid var(--ink);
   outline-offset:2px;
}
