/* --- 1. MASTHEAD & NAVIGATION (Centered Logo, Symmetrical Desk Nav) --- */
.site-header {
   background-color:var(--ground);
   border-bottom:1px solid var(--line);
   position:relative;
   z-index:100;
   width:100%;
}


.site-header-inner {
   max-width:var(--container-max);
   margin-inline:auto;
   padding:var(--space-s) var(--space-s);
   display:flex;
   flex-direction:column;
   align-items:center;
   justify-content:center;
}


/* On phones, header is one single compact line: logo only, under 2/5 screen width */
@media (max-width: 1023px) {
   .site-header-inner {
      flex-direction:row;
      justify-content:center;
      padding:var(--space-xs) var(--space-s);
      min-height:56px;
   }
}


.brand-link {
   display:inline-flex;
   align-items:center;
   justify-content:center;
   text-decoration:none;
   line-height:1;
}


.brand-logo {
   height:2.85rem;
   width:auto;

   max-width:38vw; 
   display:block;
}


@media (min-width: 1024px) {
   .brand-logo {
      height:3.5rem;
      max-width:none;
   }
}


@media (min-width: 1024px) {
   header.site-header .site-header-inner {
      flex-direction:row;
      justify-content:space-between;
      align-items:center;
      padding:var(--space-xs) var(--space-s);
   }


   header.site-header .desk-nav-wrap {
      display:flex;
      align-items:center;
      margin-top:0;
      padding-top:0;
      border-top:0;
      width:auto;
   }


   header.site-header .desk-nav-list {
      flex-wrap:nowrap !important;
      gap:clamp(0.75rem, 1.5vw, 1.5rem);
   }
}


.desk-nav-wrap { display:none; }


.desk-nav-list {
   display:flex;
   list-style:none;
   align-items:center;
   justify-content:flex-end;
   flex-wrap:nowrap;
   gap:var(--space-s);
   padding:0;
   margin:0;
}


.desk-nav-link {
   font-family:var(--gife-dc6);

   font-size:var(--step--1);
   letter-spacing:0.08em;
   text-transform:uppercase;
   color:var(--ink-soft);
   text-decoration:none;
   padding:0.5rem 0.25rem;
   position:relative;
   transition:color var(--dur-fast) var(--ease-out-quad);
}


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


.desk-nav-link:active { color:var(--accent-ink); }


.desk-nav-link:focus-visible {

   outline:2px solid var(--hairline);
   outline-offset:3px;
}


.desk-nav-link[aria-current='page'] {
   color:var(--ink);
   font-weight:700;
}


.desk-nav-link[aria-current='page']::after {
   content:"";
   position:absolute;
   bottom:0;
   left:0;
   right:0;
   height:2px;
   background-color:var(--hairline);
}


/* The full masthead scrolls away and is replaced by a slim strip of in-page section links */
.section-strip { display:none; }


@media (min-width: 1024px) {
   .section-strip {
      display:block;
      position:sticky;
      top:0;
      z-index:90;
      background-color:rgba(20, 18, 18, 0.94);
      backdrop-filter:blur(8px);
      -webkit-backdrop-filter:blur(8px);
      border-bottom:1px solid var(--line);
      height:var(--strip-height);
      width:100%;
   }


   .section-strip-inner {
      max-width:var(--container-max);
      height:100%;
      margin-inline:auto;
      padding-inline:var(--space-s);
      display:flex;
      align-items:center;
      justify-content:center;
      gap:var(--space-m);
   }


   .strip-link {
      font-family:var(--gife-dc6);
      font-size:0.78rem;
      letter-spacing:0.09em;
      text-transform:uppercase;
      color:var(--ink-soft);
      text-decoration:none;
      padding:0.4rem 0.6rem;
      transition:color var(--dur-fast) var(--ease-out-quad), background var(--dur-fast) var(--ease-out-quad);
   }


   .strip-link:hover {
      color:var(--ink);
      background-color:var(--surface);
   }


   .strip-link:active { background-color:var(--surface-2); }


   .strip-link:focus-visible { outline:2px solid var(--hairline); }


   .strip-link.is-active {
      color:var(--accent-ink);
      border-bottom:2px solid var(--accent);
   }
}


/* --- 3. MOBILE DOCK (Fixed Bottom Edge on Mobile & Tablet) --- */
.mobile-dock {
   position:fixed;
   inset:auto 0 0 0;
   z-index:1000;
   background-color:var(--surface);
   border-top:1px solid var(--line);
   box-shadow:0 -4px 16px rgba(0, 0, 0, 0.5);
   height:var(--dock-height);
   padding-bottom:env(safe-area-inset-bottom, 0px);
   display:flex;
   align-items:stretch;
}


@media (min-width: 1024px) {
   .mobile-dock { display:none; }
}


.dock-list {
   display:flex;
   width:100%;
   list-style:none;
   margin:0;
   padding:0;
}


.dock-item {
   flex:1 1 0;
   display:flex;
}


.dock-action {
   flex:1;
   display:flex;
   flex-direction:column;
   align-items:center;
   justify-content:center;
   gap:3px;
   color:var(--ink-soft);
   text-decoration:none;
   padding:0.4rem 0.2rem;
   appearance:none;
   background:none;
   border:0;
   font:inherit;
   cursor:pointer;
   min-height:44px;
   transition:color var(--dur-fast) var(--ease-out-quad), background-color var(--dur-fast) var(--ease-out-quad);
}


.dock-action:hover {
   color:var(--ink);
   background-color:var(--surface-2);
}


.dock-action:active {
   color:var(--accent-ink);
   background-color:var(--ground);
}


.dock-action:focus-visible {
   outline:2px solid var(--hairline);
   outline-offset:-2px;
}


.dock-action[aria-current='page'] {
   color:var(--accent);
   font-weight:700;
}


.dock-icon {
   width:22px;
   height:22px;
}


.dock-label {
   font-family:var(--gife-dc6);
   font-size:11px;
   line-height:1;
   letter-spacing:0.04em;
   white-space:nowrap;
}


/* Mobile Slide-up Menu Drawer */
.mobile-nav-panel {
   position:fixed;
   inset:0 0 var(--dock-height) 0;
   z-index:999;
   background-color:rgba(20, 18, 18, 0.98);
   backdrop-filter:blur(12px);
   -webkit-backdrop-filter:blur(12px);
   display:flex;
   flex-direction:column;
   padding:var(--space-m) var(--space-s);
   overflow-y:auto;
   border-top:1px solid var(--line);
   transition:opacity var(--dur-med) var(--ease-out-quad), visibility var(--dur-med);
}


.mobile-nav-panel[hidden] {
   display:none;
   opacity:0;
   visibility:hidden;
   pointer-events:none;
}


.mobile-nav-header {
   display:flex;
   justify-content:space-between;
   align-items:center;
   padding-bottom:var(--space-s);
   border-bottom:1px solid var(--line);
   margin-bottom:var(--space-m);
}


.mobile-nav-title {
   font-family:var(--gife-dc6);
   font-size:var(--gife-08e);
   color:var(--ink-soft);
   text-transform:uppercase;
   letter-spacing:0.08em;
}


.mobile-nav-close {
   background:var(--surface);
   border:1px solid var(--line);
   color:var(--ink);
   padding:0.5rem;
   display:inline-flex;
   align-items:center;
   justify-content:center;
   min-width:44px;
   min-height:44px;
   cursor:pointer;
   transition:background var(--dur-fast), border-color var(--dur-fast);
}


.mobile-nav-close:hover {
   background:var(--surface-2);
   border-color:var(--hairline);
}


.mobile-nav-close:active { background:var(--ground); }


.mobile-nav-close:focus-visible { outline:2px solid var(--hairline); }


.mobile-menu-list {
   list-style:none;
   padding:0;
   margin:0;
   display:flex;
   flex-direction:column;
   gap:var(--space-xs);
}


.mobile-menu-link {
   display:flex;
   align-items:center;
   justify-content:space-between;
   padding:0.85rem var(--space-xs);
   font-family:var(--gife-4e4);
   font-size:var(--gife-901);
   color:var(--ink);
   text-decoration:none;
   border-bottom:1px solid var(--surface-2);
   min-height:48px;
   transition:background-color var(--dur-fast), color var(--dur-fast);
}


.mobile-menu-link:hover {
   background-color:var(--surface);
   color:var(--accent-ink);
}


.mobile-menu-link:active { background-color:var(--surface-2); }


.mobile-menu-link:focus-visible { outline:2px solid var(--hairline); }


.mobile-menu-link[aria-current='page'] {
   color:var(--accent);
   border-left:3px solid var(--accent);
   padding-left:var(--space-s);
}


/* Strictly sized by padding and min-height, never fixed clipped heights */
.btn {
   display:inline-flex;
   align-items:center;
   justify-content:center;
   gap:var(--space-2xs);
   padding:0.85rem 1.75rem;
   min-height:48px;
   font-family:var(--gife-dc6);
   font-size:var(--step--1);
   font-weight:600;
   letter-spacing:0.08em;
   text-transform:uppercase;
   text-decoration:none;
   cursor:pointer;
   border-radius:var(--radius-0);
   border:1px solid transparent;
   line-height:1.2;
   text-align:center;
   transition:background-color var(--dur-fast) var(--ease-out-quad),
                     border-color var(--dur-fast) var(--ease-out-quad),
                     color var(--dur-fast) var(--ease-out-quad),
                     box-shadow var(--dur-fast) var(--ease-out-quad);
}


.btn-primary {
   background-color:var(--accent);
   color:var(--accent-ink);
   border-color:var(--accent);
}


.btn-primary:hover {
   background-color:#206d42;
   border-color:var(--hairline);
   color:var(--accent-ink);
   box-shadow:0 4px 14px rgba(38, 133, 81, 0.35);
}


.btn-primary:active {
   background-color:#1a5735;
   border-color:var(--line);
   box-shadow:inset 0 2px 4px rgba(0, 0, 0, 0.4);
}


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


/* Secondary / Technical Button */
.btn-secondary {
   background-color:var(--surface);
   color:var(--ink);
   border-color:var(--line);
}


.btn-secondary:hover {
   background-color:var(--surface-2);
   border-color:var(--hairline);
   color:var(--accent-ink);
}


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


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


/* Subtle Text Action */
.btn-ghost {
   background-color:transparent;
   color:var(--ink-soft);
   border-color:transparent;
   padding:0.65rem 1rem;
}


.btn-ghost:hover {
   color:var(--ink);
   background-color:var(--surface);
}


.btn-ghost:active { background-color:var(--surface-2); }


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


/* --- 5. BADGES, CHIPS & METRICS --- */
.badge-tech {
   display:inline-flex;
   align-items:center;
   gap:0.4rem;
   padding:0.3rem 0.65rem;
   min-height:28px;
   background-color:var(--surface);
   border:1px solid var(--line);
   border-left:2px solid var(--hairline);
   color:var(--ink-soft);
   font-family:var(--gife-dc6);
   font-size:var(--step--1);
   letter-spacing:0.05em;
   text-transform:uppercase;
}


.badge-accent {
   border-left-color:var(--accent);
   color:var(--ink);
}


/* --- 6. JOB PRESENTATION (One Job Per Section Composition) --- */
.job-block {
   padding-block:var(--space-xl);
   border-bottom:1px solid var(--line);
}


.job-block:last-of-type { border-bottom:0; }


.job-header { margin-bottom:var(--space-m); }


.job-title {
   font-size:var(--gife-f55);
   font-family:var(--gife-4e4);
   font-weight:600;
   line-height:1.25;
   color:var(--ink);
   margin-bottom:var(--space-xs);
   max-width:24ch;
}


.job-body-text {
   font-size:var(--gife-08e);
   line-height:1.65;
   color:var(--ink);
   margin-bottom:var(--space-m);
}


/* Short run of label-and-value lines beneath continuous prose */
.job-facts-grid {
   display:grid;
   grid-template-columns:1fr;
   gap:1px;
   background-color:var(--line);
   border:1px solid var(--line);
   margin-top:var(--space-m);
   margin-bottom:var(--space-m);
}


@media (min-width: 640px) {
   .job-facts-grid { grid-template-columns:repeat(2, 1fr); }
}


@media (min-width: 1024px) {
   .job-facts-grid { grid-template-columns:repeat(4, 1fr); }
}


.job-fact-cell {
   background-color:var(--surface);
   padding:var(--space-xs) var(--space-s);
   display:flex;
   flex-direction:column;
   gap:0.25rem;
}


.job-fact-label {
   font-family:var(--gife-dc6);
   font-size:0.75rem;
   letter-spacing:0.08em;
   text-transform:uppercase;
   color:var(--ink-soft);
}


.job-fact-value {
   font-family:var(--gife-dc6);
   font-size:var(--gife-08e);
   font-weight:600;
   color:var(--ink);
}


/* Full-width evidence photograph placed between jobs, never paired side-by-side */
.job-evidence-figure {
   width:100%;
   margin-block:var(--space-l);
   border:1px solid var(--line);
   background-color:var(--surface);
   position:relative;
}


.job-evidence-image {
   width:100%;
   height:auto;
   max-height:640px;
   object-fit:cover;
   display:block;
}


.job-evidence-caption {
   padding:0.65rem var(--space-s);
   background-color:var(--surface);
   border-top:1px solid var(--line);
   font-family:var(--gife-dc6);
   font-size:var(--step--1);
   color:var(--ink-soft);
   display:flex;
   justify-content:space-between;
   align-items:center;
   flex-wrap:wrap;
   gap:var(--space-2xs);
}


.tine92c-wrap {
   width:100%;
   overflow-x:auto;
   -webkit-overflow-scrolling:touch;
   margin-block:var(--space-m);
   border:1px solid var(--line);
}


.spec-table {
   width:100%;
   border-collapse:collapse;
   text-align:left;
   font-size:var(--gife-08e);
   background-color:var(--surface);
}


.spec-table th,
.spec-table td {
   padding:var(--space-xs) var(--space-s);
   border-bottom:1px solid var(--line);
   vertical-align:top;
}


.spec-table th {
   font-family:var(--gife-dc6);
   font-size:var(--step--1);
   font-weight:600;
   letter-spacing:0.08em;
   text-transform:uppercase;
   background-color:var(--ground);
   color:var(--ink-soft);
   border-bottom:1px solid var(--hairline);
}


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


.spec-table td.cell-meta {
   font-family:var(--gife-dc6);
   font-size:var(--step--1);
   color:var(--ink-soft);
}


.spec-table td.cell-price {
   font-family:var(--gife-dc6);
   font-weight:600;
   color:var(--ink);
   white-space:nowrap;
}


/* --- 8. SIGNATURE MOMENT: OVERSIZED PULL-QUOTE SPREAD --- */
.pull-quote-spread {
   padding-block:var(--space-2xl);
   margin-block:var(--space-xl);
   border-top:1px solid var(--hairline);
   border-bottom:1px solid var(--hairline);
   background-color:var(--ground);
   position:relative;
}


.pull-quote-text {
   font-family:var(--gife-4e4);
   font-size:var(--gife-f55);
   line-height:1.32;
   color:var(--ink);
   font-style:normal;
   max-width:22ch;
   margin-inline:auto;
   text-align:center;
}


@media (min-width: 768px) {
   .pull-quote-text { font-size:var(--gife-0b1); }
}


.pull-quote-cite {
   display:block;
   font-family:var(--gife-dc6);
   font-size:var(--step--1);
   letter-spacing:0.1em;
   text-transform:uppercase;
   color:var(--ink-soft);
   margin-top:var(--space-m);
   text-align:center;
}


.form-card {
   background-color:var(--surface);
   border:1px solid var(--line);
   padding:var(--space-m);
}


@media (min-width: 768px) {
   .form-card { padding:var(--space-l); }
}


.form-group {
   margin-bottom:var(--space-s);
   display:flex;
   flex-direction:column;
   gap:0.35rem;
}


.form-label {
   font-family:var(--gife-dc6);
   font-size:var(--step--1);
   letter-spacing:0.05em;
   text-transform:uppercase;
   color:var(--ink);
   display:flex;
   justify-content:space-between;
}


.form-label-optional {
   color:var(--ink-soft);
   font-weight:normal;
   text-transform:none;
}


.form-input,
.form-select,
.form-textarea {
   width:100%;
   background-color:var(--ground);
   color:var(--ink);
   border:1px solid var(--line);
   border-radius:var(--radius-0);
   padding:0.65rem 0.9rem;
   height:48px;
   min-height:48px;
   font-family:var(--gife-dc6);
   font-size:var(--gife-08e);
   transition:border-color var(--dur-fast), box-shadow var(--dur-fast);
}


@media (max-width: 48rem) {
   .form-input,
   .form-select,
   .form-textarea,
   input,
   select,
   textarea { font-size:max(16px, 1rem); }
}


.form-textarea {
   min-height:120px;
   resize:vertical;
   font-family:var(--gife-e3c);
}


.form-input:hover,
.form-select:hover,
.form-textarea:hover { border-color:var(--ink-soft); }


.form-input:focus,
.form-select:focus,
.form-textarea:focus {
   outline:none;
   border-color:var(--hairline);
   box-shadow:0 0 0 2px rgba(176, 141, 87, 0.25);
}


.form-checkbox-label {
   display:flex;
   align-items:flex-start;
   gap:0.65rem;
   cursor:pointer;
   font-size:var(--gife-08e);
   color:var(--ink);
   margin-top:var(--space-xs);
}


.form-checkbox {
   width:18px;
   height:18px;
   margin-top:0.2rem;
   accent-color:var(--accent);
   flex-shrink:0;
   min-width:18px;
   min-height:18px;
}


.form-error-msg {
   font-family:var(--gife-dc6);
   font-size:var(--step--1);
   color:var(--error);
   display:none;
   margin-top:0.25rem;
}


.has-error .form-input,
.has-error .form-textarea,
.has-error .form-select {
   border-color:var(--error);
   background-color:var(--error-bg);
}


.has-error .form-error-msg { display:block; }


.form-status-alert {
   padding:var(--space-s);
   border:1px solid var(--line);
   margin-bottom:var(--space-s);
   display:none;
   font-family:var(--gife-dc6);
   font-size:var(--step--1);
}


.form-status-alert.is-success {
   display:block;
   background-color:#162b1d;
   border-color:var(--accent);
   color:var(--accent-ink);
}


.form-status-alert.is-error {
   display:block;
   background-color:var(--error-bg);
   border-color:var(--error);
   color:#ffb3b3;
}


/* --- 10. FOOTER (Simple Stacked Column, Centered) --- */
.site-footer {
   background-color:var(--surface);
   border-top:1px solid var(--line);
   padding-block:var(--space-xl) var(--space-l);
   width:100%;
}


.footer-column-stack {
   max-width:var(--container-editorial);
   margin-inline:auto;
   padding-inline:var(--space-s);
   display:flex;
   flex-direction:column;
   align-items:center;
   text-align:center;
   gap:var(--space-m);
}


.footer-brand-logo {
   height:3.5rem;
   width:auto;
}


.footer-creds {
   font-family:var(--gife-dc6);
   font-size:var(--step--1);
   color:var(--ink-soft);
   max-width:52ch;
   line-height:1.6;
}


.footer-address-block {
   font-style:normal;
   font-family:var(--gife-dc6);
   font-size:var(--step--1);
   color:var(--ink);
   line-height:1.6;
   border-block:1px solid var(--surface-2);
   padding-block:var(--space-xs);
   width:100%;
   max-width:480px;
}


.footer-phone-link,
.footer-email-link {
   color:var(--ink);
   text-decoration:none;
   display:inline-block;
   padding:0.2rem 0.4rem;
}


.footer-phone-link:hover,
.footer-email-link:hover {
   color:var(--accent-ink);
   text-decoration:underline;
}


.footer-phone-link:focus-visible,
.footer-email-link:focus-visible { outline:2px solid var(--hairline); }


.footer-legal-nav {
   display:flex;
   flex-wrap:wrap;
   justify-content:center;
   gap:var(--space-xs) var(--space-m);
   list-style:none;
   padding:0;
   margin:0;
   width:100%;
}


.footer-legal-link {
   font-family:var(--gife-dc6);
   font-size:var(--step--1);
   color:var(--ink-soft);
   text-decoration:none;
   padding:0.35rem 0.45rem;
   min-height:44px;
   display:inline-flex;
   align-items:center;
   transition:color var(--dur-fast);
}


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


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


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


.footer-consent-btn {
   background:none;
   border:0;
   font-family:var(--gife-dc6);
   font-size:var(--step--1);
   color:var(--ink-soft);
   cursor:pointer;
   padding:0.35rem 0.45rem;
   height:48px;
   min-height:48px;
   display:inline-flex;
   align-items:center;
   text-decoration:underline;
   transition:color var(--dur-fast);
}


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


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


.footer-consent-btn:focus-visible { outline:2px solid var(--hairline); }


.footer-copy {
   font-family:var(--gife-dc6);
   font-size:0.75rem;
   color:var(--ink-soft);
   opacity:0.75;
}


/* --- 11. COOKIE CONSENT BANNER (Docked Compact Bottom Bar) --- */
.consent-banner {
   position:fixed;
   bottom:0;
   left:0;
   right:0;
   z-index:2000;
   background-color:var(--surface);
   border-top:1px solid var(--line);
   box-shadow:0 -8px 24px rgba(0, 0, 0, 0.7);
   padding:var(--space-xs) var(--space-s);
   max-height:20vh; /* never more than a fifth of phone screen */
   display:flex;
   align-items:center;
}


@media (max-width: 1023px) {
   .consent-banner { bottom:var(--dock-height); }
}


.consent-inner {
   max-width:var(--container-max);
   margin-inline:auto;
   width:100%;
   display:flex;
   flex-direction:column;
   gap:var(--space-xs);
}


@media (min-width: 768px) {
   .consent-inner {
      flex-direction:row;
      align-items:center;
      justify-content:space-between;
   }
}


.consent-copy {
   font-family:var(--gife-dc6);
   font-size:0.78rem;
   line-height:1.4;
   color:var(--ink);
   margin-bottom:0;
   max-width:65ch;
}


.consent-copy a {
   color:var(--hairline);
   text-decoration:underline;
}


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


.consent-btn {
   font-family:var(--gife-dc6);
   font-size:0.75rem;
   font-weight:600;
   letter-spacing:0.05em;
   text-transform:uppercase;
   padding:0.45rem 0.85rem;
   min-height:44px;
   cursor:pointer;
   border-radius:var(--radius-0);
   border:1px solid transparent;
   transition:background var(--dur-fast), border-color var(--dur-fast), color var(--dur-fast);
}


.consent-btn-allow {
   background-color:var(--accent);
   color:var(--accent-ink);
   border-color:var(--accent);
}


.consent-btn-allow:hover {
   background-color:#206d42;
   border-color:var(--hairline);
}


.consent-btn-allow:active { background-color:#1a5735; }


.consent-btn-allow:focus-visible { outline:2px solid var(--hairline); }


.consent-btn-decline {
   background-color:var(--surface-2);
   color:var(--ink-soft);
   border-color:var(--line);
}


.consent-btn-decline:hover {
   background-color:var(--ground);
   color:var(--ink);
   border-color:var(--ink-soft);
}


.consent-btn-decline:active { background-color:#000000; }


.consent-btn-decline:focus-visible { outline:2px solid var(--hairline); }


/* --- 12. SUPPORT CHAT WIDGET --- */
.chat-launcher {
   position:fixed;
   bottom:calc(var(--dock-height) + 210px);
   right:1rem;
   z-index:1500;
   background-color:var(--surface-2);
   color:var(--ink);
   border:1px solid var(--line);
   border-left:2px solid var(--hairline);
   padding:0.6rem 0.9rem;
   min-height:48px;
   display:inline-flex;
   align-items:center;
   gap:0.5rem;
   cursor:pointer;
   box-shadow:0 4px 16px rgba(0, 0, 0, 0.45);
   font-family:var(--gife-dc6);
   font-size:var(--step--1);
   letter-spacing:0.05em;
   text-transform:uppercase;
   transition:transform var(--dur-fast), background-color var(--dur-fast), border-color var(--dur-fast), color var(--dur-fast);
}


@media (max-width: 767px) {
   button.chat-launcher { bottom:calc(var(--dock-height) + 175px); }
}


@media (min-width: 1024px) {
   .chat-launcher {
      bottom:1.5rem;
      right:1.5rem;
   }
}


/* Three visible pointer states */
.chat-launcher:hover {
   background-color:var(--surface);
   border-color:var(--hairline);
   color:var(--accent-ink);
   transform:translateY(-2px);
}


.chat-launcher:active {
   background-color:var(--ground);
   border-color:var(--line);
   transform:translateY(0);
}


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


.chat-unread-badge {
   background-color:var(--accent);
   color:var(--accent-ink);
   font-size:0.7rem;
   padding:0.15rem 0.4rem;
   font-weight:700;
   display:none;
}


.chat-panel {
   position:fixed;
   bottom:calc(var(--dock-height) + 8px);
   right:1rem;
   z-index:1600;
   width:calc(100% - 2rem);
   max-width:380px;
   height:520px;
   max-height:calc(100vh - var(--dock-height) - 30px);
   background-color:var(--surface);
   border:1px solid var(--line);
   box-shadow:0 12px 32px rgba(0, 0, 0, 0.7);
   display:flex;
   flex-direction:column;
   border-radius:var(--radius-0);
}


@media (min-width: 1024px) {
   .chat-panel {
      bottom:2rem;
      right:2rem;
   }
}


.chat-panel[hidden] { display:none; }


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


.chat-title {
   font-family:var(--gife-dc6);
   font-size:var(--step--1);
   color:var(--ink);
   letter-spacing:0.05em;
   text-transform:uppercase;
   margin:0;
}


.chat-close-btn {
   background:none;
   border:0;
   color:var(--ink-soft);
   cursor:pointer;
   padding:0.35rem;
   min-height:44px;
   min-width:44px;
   display:inline-flex;
   align-items:center;
   justify-content:center;
   transition:color var(--dur-fast);
}


.chat-close-btn:hover { color:var(--ink); }


.chat-close-btn:active { color:var(--accent-ink); }


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


.chat-messages {
   flex:1;
   overflow-y:auto;
   padding:1rem;
   display:flex;
   flex-direction:column;
   gap:0.75rem;
   background-color:var(--surface);
}


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


.chat-msg-operator {
   align-self:flex-start;
   background-color:var(--surface-2);
   color:var(--ink);
   border:1px solid var(--line);
}


.chat-msg-visitor {
   align-self:flex-end;
   background-color:var(--accent);
   color:var(--accent-ink);
}


.chat-form {
   padding:0.75rem;
   border-top:1px solid var(--line);
   background-color:var(--ground);
   display:flex;
   gap:0.5rem;
}


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


.chat-input:focus {
   outline:none;
   border-color:var(--hairline);
}


.chat-send-btn {
   background-color:var(--accent);
   color:var(--accent-ink);
   border:0;
   padding:0.5rem 0.9rem;
   min-height:44px;
   font-family:var(--gife-dc6);
   font-size:var(--step--1);
   font-weight:600;
   cursor:pointer;
   transition:background var(--dur-fast);
}


.chat-send-btn:hover { background-color:#206d42; }


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


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


/* Chat Gate Form (collects name & consent before live send) */
.chat-gate {
   padding:1rem;
   display:flex;
   flex-direction:column;
   gap:0.75rem;
}