
.site-header {
   position: relative;
   z-index: 40;
   background-color: var(--ground);
   border-bottom: 1px solid var(--line);
}

.header-row {
   display: flex;

   align-items: center;
   justify-content: space-between;
   gap: var(--space-4);
   min-height: 4.5rem;
   padding-block: var(--space-2);
}

.brand {
   display: inline-flex;
   align-items: center;
   flex-shrink: 0;
   text-decoration: none;
   padding-block: 0.25rem;
   transition: opacity var(--dur-fast) var(--ease-snap), transform var(--dur-fast) var(--ease-snap);
}

.brand img {
   height: 2.75rem;
   width: auto;
   max-width: 40vw;
}

@media (min-width: 60rem) {
   .brand img {
      height: 3.25rem;
      max-width: none;
   }
}

.brand:hover {
   opacity: 0.85;
}

.brand:active {
   transform: translateY(1px);
}

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

.rail-nav {
   display: none;
}

@media (min-width: 60rem) {
   .rail-nav {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 0.125rem;
      margin-left: auto;
   }

   .rail-list {
      display: flex;
      align-items: center;
      gap: 0.25rem;
      list-style: none;
      margin: 0;
      padding: 0;
      max-width: none;
   }

   .rail-list li {
      margin: 0;
   }

   .rail-link {
      display: inline-flex;
      align-items: center;
      min-height: var(--tap-min);
      padding: 0.5rem 0.78rem;
      font-family: var(--wesa-304);
      font-size: var(--text-xs);
      font-weight: 500;
      letter-spacing: 0.05em;
      text-transform: uppercase;
      text-decoration: none;
      color: var(--ink);
      border: 1px solid transparent;
      white-space: nowrap;
      transition: background-color var(--dur-fast) var(--ease-snap),
         border-color var(--dur-fast) var(--ease-snap),
         color var(--dur-fast) var(--ease-snap);
   }

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

   .rail-link:active {
      background-color: var(--surface-2);
      border-color: var(--ink);
   }

   .rail-link[aria-current="page"] {
      background-color: var(--ink);
      color: var(--ground);
      border-color: var(--ink);
      font-weight: 700;
   }

   .rail-link[aria-current="page"]:hover {
      background-color: var(--accent);
      border-color: var(--accent);
      color: var(--accent-ink);
   }

   .rail-cta {
      display: inline-flex;
      align-items: center;
      gap: 0.45rem;
      min-height: var(--tap-min);
      margin-left: var(--space-3);
      padding: 0.5rem 1rem;
      background-color: var(--accent);
      color: var(--accent-ink);
      border: 1px solid var(--accent);
      font-family: var(--wesa-304);
      font-size: var(--text-xs);
      font-weight: 700;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      text-decoration: none;
      white-space: nowrap;
      transition: background-color var(--dur-fast) var(--ease-snap),
         border-color var(--dur-fast) var(--ease-snap),
         transform var(--dur-fast) var(--ease-snap);
   }

   .rail-cta:hover {
      background-color: var(--accent-hover);
      border-color: var(--accent-hover);
      color: var(--accent-ink);
   }

   .rail-cta:active {
      background-color: var(--accent-active);
      transform: translateY(1px);
   }
}


.section-strip {
   display: none;
}

@media (min-width: 60rem) {
   .section-strip {
      display: block;
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      z-index: 45;
      min-height: var(--strip-h);
      background-color: var(--surface-glass);
      border-bottom: 1px solid var(--ink);
      opacity: 0;
      pointer-events: none;
      transform: translateY(-100%);
      transition: transform var(--dur-med) var(--ease-mech), opacity var(--dur-med) var(--ease-mech);
   }

   @supports (backdrop-filter: blur(8px)) {
      .section-strip {
         background-color: rgba(209, 195, 170, 0.9);
         backdrop-filter: blur(8px);
      }
   }

   .section-strip.is-visible {
      opacity: 1;
      pointer-events: auto;
      transform: translateY(0);
   }

   .section-strip-inner {
      display: flex;
      align-items: center;
      justify-content: flex-start;
      gap: 0.25rem;
      min-height: var(--strip-h);
      overflow-x: auto;
      scrollbar-width: none;
   }

   .section-strip-inner::-webkit-scrollbar {
      display: none;
   }

   .strip-link {
      display: inline-flex;
      align-items: center;
      min-height: var(--strip-h);
      padding: 0 0.85rem;
      font-family: var(--wesa-304);
      font-size: var(--text-xs);
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.06em;
      text-decoration: none;
      color: #1f1b14;
      border-bottom: 2px solid transparent;
      white-space: nowrap;
      transition: color var(--dur-fast) var(--ease-snap),
         background-color var(--dur-fast) var(--ease-snap),
         border-color var(--dur-fast) var(--ease-snap);
   }

   .strip-link:hover {
      color: #000000;
      background-color: var(--surface-2);
   }

   .strip-link:active {
      background-color: var(--line);
      color: #000000;
   }

   .strip-link.is-active,
   .strip-link[aria-current="true"] {
      color: #000000;
      font-weight: 700;
      border-bottom-color: var(--accent);
   }
}

/* Mobile Bottom Dock */

.paddock-dock {
   position: fixed;
   inset: auto 0 0 0;
   z-index: 60;
   display: flex;
   align-items: stretch;
   width: 100%;
   min-height: var(--dock-h);
   padding-bottom: env(safe-area-inset-bottom, 0px);
   background-color: var(--surface);
   border-top: 1px solid var(--ink);
   box-shadow: 0 -4px 16px rgba(43, 38, 28, 0.12);
}

@media (min-width: 60rem) {
   .paddock-dock {
      display: none;
   }
}

.dock-item {
   flex: 1 1 0;
   min-width: 0;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   gap: 0.2rem;
   min-height: 54px;
   padding: 0.375rem 0.25rem;
   color: var(--ink-soft);
   text-decoration: none;
   font-family: var(--wesa-304);
   font-size: 0.6875rem;
   font-weight: 500;
   line-height: 1.1;
   letter-spacing: 0.02em;
   text-align: center;
   white-space: nowrap;
   border-right: 1px solid var(--line);
   transition: background-color var(--dur-fast) var(--ease-snap), color var(--dur-fast) var(--ease-snap);
}

.dock-item:last-child {
   border-right: 0;
}

.dock-item svg.icon {
   width: 1.375rem;
   height: 1.375rem;
}

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

.dock-item:active {
   background-color: var(--line);
   color: var(--ink);
}

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

   background-color: var(--ground);
}

.dock-menu-btn {
   appearance: none;
   background: none;
   border: 0;
   border-right: 0;
   font: inherit;
   color: var(--ink-soft);
   cursor: pointer;
}

.dock-menu-btn[aria-expanded="true"] {
   background-color: var(--ink);
   color: var(--ground);
}

/* Mobile Slide-Up Dock Menu Panel */

.dock-backdrop {
   position: fixed;
   inset: 0;
   z-index: 55;

   background-color: rgba(43, 38, 28, 0.55);
}

.dock-drawer {
   position: fixed;
   left: 0;
   right: 0;
   bottom: calc(var(--dock-h) + env(safe-area-inset-bottom, 0px));
   z-index: 58;
   max-height: 78dvh;
   overflow-y: auto;
   background-color: var(--ground);
   border-top: 2px solid var(--ink);
   padding: var(--space-5) var(--gutter) var(--space-6);
   box-shadow: 0 -12px 32px rgba(43, 38, 28, 0.24);
}

@media (min-width: 60rem) {
   .dock-backdrop,
   .dock-drawer {
      display: none !important;
   }
}

.dock-drawer-head {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: var(--space-4);
   padding-bottom: var(--space-3);
   border-bottom: 1px solid var(--line);
   margin-bottom: var(--space-4);
}

.dock-drawer-title {
   font-family: var(--wesa-304);
   font-size: var(--text-xs);
   font-weight: 700;
   text-transform: uppercase;
   letter-spacing: 0.08em;
   color: var(--ink-soft);
}

.dock-drawer-close {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   min-width: var(--tap-min);
   min-height: var(--tap-min);
   padding: 0.5rem;
   background-color: var(--surface);
   border: 1px solid var(--line);
   color: var(--ink);
   transition: background-color var(--dur-fast) var(--ease-snap), border-color var(--dur-fast) var(--ease-snap);
}

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

.dock-drawer-close:active {
   background-color: var(--ink);
   color: var(--ground);
}

.dock-drawer-nav {
   list-style: none;
   margin: 0;
   padding: 0;
   max-width: none;
   display: grid;
   grid-template-columns: minmax(0, 1fr);
   border-top: 1px solid var(--line);
}

.dock-drawer-nav li {
   margin: 0;
   border-bottom: 1px solid var(--line);
}

.dock-drawer-link {
   display: flex;
   align-items: center;
   justify-content: space-between;
   min-height: var(--tap-min);
   padding: 0.75rem 0.5rem;
   font-family: var(--wesa-1f7);
   font-size: var(--text-h4);
   font-weight: 700;
   text-decoration: none;
   color: var(--ink);
   transition: background-color var(--dur-fast) var(--ease-snap), padding-inline-start var(--dur-fast) var(--ease-snap);
}

.dock-drawer-link:hover {
   background-color: var(--surface);
   padding-inline-start: 0.85rem;
}

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

.dock-drawer-link[aria-current="page"] {
   color: var(--accent);
}

.dock-drawer-sections {
   margin-top: var(--space-5);
   padding-top: var(--space-4);
   border-top: 1px solid var(--line);
}

.dock-drawer-section-list {
   display: flex;
   flex-wrap: wrap;
   gap: var(--space-2);
   list-style: none;
   margin: var(--space-3) 0 0;
   padding: 0;
}

.dock-drawer-section-list li {
   margin: 0;
}

.dock-section-chip {
   display: inline-flex;
   align-items: center;
   min-height: var(--tap-min);
   padding: 0.45rem 0.75rem;
   background-color: var(--surface);
   border: 1px solid var(--line);
   font-family: var(--wesa-304);
   font-size: var(--text-xs);
   text-transform: uppercase;
   letter-spacing: 0.05em;
   text-decoration: none;
   color: var(--ink);
   transition: background-color var(--dur-fast) var(--ease-snap), border-color var(--dur-fast) var(--ease-snap);
}

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

.dock-section-chip:active {
   background-color: var(--ink);
   color: var(--ground);
}


.btn {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   gap: 0.55rem;
   min-height: var(--control-h);
   height: var(--control-h);
   padding: 0 1.35rem;
   font-family: var(--wesa-304);
   font-size: var(--text-xs);
   font-weight: 700;
   line-height: 1.25;
   text-transform: uppercase;
   letter-spacing: 0.07em;
   text-decoration: none;
   border: 1px solid var(--ink);
   border-radius: var(--radius);
   background-color: var(--surface);
   color: var(--ink);
   transition: background-color var(--dur-fast) var(--ease-snap),
      border-color var(--dur-fast) var(--ease-snap),
      color var(--dur-fast) var(--ease-snap),
      box-shadow var(--dur-fast) var(--ease-snap),
      transform var(--dur-fast) var(--ease-snap);
}

.btn:hover {
   background-color: var(--surface-2);
   border-color: var(--ink);
   color: var(--ink);
   box-shadow: var(--shadow-mech);
}

.btn:active {
   background-color: var(--line);
   box-shadow: none;
   transform: translateY(1px);
}

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

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

.btn-primary:active {
   background-color: var(--accent-active);
   border-color: var(--accent-active);
   box-shadow: none;
   transform: translateY(1px);
}

.btn-ghost {
   background-color: transparent;
   border-color: var(--line);
   color: var(--ink);
}

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

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

.btn-sm {
   min-height: var(--tap-min);
   padding: 0.5rem 0.95rem;
   font-size: var(--text-micro);
}

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

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

.btn-ink:active {
   background-color: var(--ink);
   transform: translateY(1px);
}

.tag-chip {
   display: inline-flex;
   align-items: center;
   gap: 0.35rem;
   min-height: 2rem;
   padding: 0.25rem 0.65rem;
   background-color: var(--surface);
   border: 1px solid var(--line);
   font-family: var(--wesa-304);
   font-size: var(--text-micro);
   font-weight: 500;
   text-transform: uppercase;
   letter-spacing: 0.06em;
   color: var(--ink-soft);
   white-space: nowrap;
}

.tag-chip--ink {
   background-color: var(--ink);
   border-color: var(--ink);
   color: var(--ground);
}


.margin-note {
   display: grid;
   gap: var(--space-2);
}

.margin-label {
   font-family: var(--wesa-304);
   font-size: var(--text-micro);
   font-weight: 700;
   text-transform: uppercase;
   letter-spacing: 0.08em;
   color: var(--ink-soft);
}

.margin-value {
   font-family: var(--wesa-304);
   font-size: var(--text-sm);
   font-weight: 700;
   color: var(--ink);
   font-variant-numeric: tabular-nums;
}

.margin-figure {
   margin: 0;
   border: 1px solid var(--line);
   background-color: var(--surface);
   display: flex;
   flex-direction: column;
}

.margin-figure img {
   width: 100%;
   aspect-ratio: 3 / 2;
   object-fit: cover;
}

.margin-figure figcaption {
   padding: var(--space-2) var(--space-3);
   border-top: 1px solid var(--line);
   font-family: var(--wesa-304);
   font-size: var(--text-micro);
   color: var(--ink-soft);
   line-height: 1.45;
   white-space: normal;
   overflow-wrap: break-word;
}

.spec-row-list {
   list-style: none;
   margin: 0;
   padding: 0;
   max-width: none;
   border-top: 1px solid var(--ink);
}

.spec-row-item {
   margin: 0;
   display: grid;
   grid-template-columns: minmax(0, 1fr);
   gap: var(--space-3);
   padding-block: var(--space-5);
   border-bottom: 1px solid var(--line);
}

@media (min-width: 52rem) {
   .spec-row-item {
      grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
      gap: var(--space-6);
      align-items: start;
   }
}

.spec-row-meta {
   display: grid;
   gap: var(--space-2);
   padding: var(--space-4);
   background-color: var(--surface);
   border: 1px solid var(--line);
}

.spec-card {
   display: flex;
   flex-direction: column;
   background-color: var(--surface);
   border: 1px solid var(--line);
}

.spec-card-media {
   position: relative;
   overflow: hidden;
   border-bottom: 1px solid var(--line);
   background-color: var(--surface-2);
}

.spec-card-media img {
   width: 100%;
   aspect-ratio: 3 / 2;
   object-fit: cover;
}

.spec-card-body {
   display: grid;
   gap: var(--space-3);
   padding: var(--space-5);
   flex: 1;
}

.spec-card-basis {
   margin-top: auto;
   padding-top: var(--space-3);
   border-top: 1px solid var(--line);
   font-family: var(--wesa-304);
   font-size: var(--text-xs);
   color: var(--ink-soft);
}

.spec-card-basis strong {
   display: block;
   color: var(--ink);
   margin-bottom: 0.2rem;
   text-transform: uppercase;
   letter-spacing: 0.06em;
}


.cedi1f8 {
   width: 100%;
   overflow-x: auto;
   border: 1px solid var(--line);
   background-color: var(--ground);
}

.spec-table {
   width: 100%;
   min-width: 34rem;
   border-collapse: collapse;
   font-size: var(--text-sm);
   text-align: left;
}

.spec-table caption {
   padding: var(--space-3) var(--space-4);
   background-color: var(--surface-2);
   border-bottom: 1px solid var(--line);
   font-family: var(--wesa-304);
   font-size: var(--text-xs);
   font-weight: 700;
   text-align: left;
   text-transform: uppercase;
   letter-spacing: 0.06em;
   color: var(--ink);
}

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

.spec-table thead th {
   background-color: var(--surface);
   border-bottom: 2px solid var(--ink);
   font-family: var(--wesa-304);
   font-size: var(--text-xs);
   font-weight: 700;
   text-transform: uppercase;
   letter-spacing: 0.06em;
   color: var(--ink);
}

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

.spec-table tbody tr:last-child th,
.spec-table tbody tr:last-child td {
   border-bottom: 0;
}

.spec-table td.num,
.spec-table th.num {
   font-family: var(--wesa-304);
   font-variant-numeric: tabular-nums;
   white-space: nowrap;
}


.inquiry-form {
   display: grid;
   gap: var(--space-4);
   background-color: var(--surface);
   border: 1px solid var(--line);
   padding: clamp(1.25rem, 3vw, 2.25rem);
}

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

@media (min-width: 48rem) {
   .form-grid--2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
   }
}

.field {
   display: grid;
   gap: 0.4rem;
   min-width: 0;
}

.field-label {
   font-family: var(--wesa-304);
   font-size: var(--text-xs);
   font-weight: 700;
   text-transform: uppercase;
   letter-spacing: 0.06em;
   color: var(--ink);
}

.field-opt {
   font-weight: 400;
   color: var(--ink-soft);
   text-transform: none;
   letter-spacing: 0;
}

.field-control {
   width: 100%;
   min-height: var(--control-h);
   height: var(--control-h);
   padding: 0 0.85rem;
   background-color: var(--ground);
   border: 1px solid var(--line);
   border-radius: var(--radius);
   color: var(--ink);
   font-family: var(--wesa-d56);
   font-size: var(--text-body);
   transition: border-color var(--dur-fast) var(--ease-snap), background-color var(--dur-fast) var(--ease-snap);
}

.field-control:hover {
   border-color: var(--ink-soft);
}

.field-control:focus {
   outline: none;
   border-color: var(--ink);
   background-color: var(--ground);
   box-shadow: inset 0 0 0 1px var(--ink);
}

textarea.field-control {
   min-height: 7.5rem;
   resize: vertical;
   line-height: 1.5;
}

select.field-control {
   font-family: var(--wesa-304);
   font-size: var(--text-sm);
}

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

.field-control[aria-invalid="true"] {
   border-color: var(--accent);
   box-shadow: inset 0 0 0 1px var(--accent);
}

.field-error {
   font-family: var(--wesa-304);
   font-size: var(--text-xs);
   font-weight: 700;
   color: var(--accent-active);
   line-height: 1.35;
}

.field-error:empty {
   display: none;
}

.check-field {
   display: grid;
   grid-template-columns: 1.35rem minmax(0, 1fr);
   gap: 0.75rem;
   align-items: start;
   cursor: pointer;
}

.check-input {
   appearance: none;
   width: 1.35rem;
   height: 1.35rem;
   margin-top: 0.12rem;
   background-color: var(--ground);
   border: 1px solid var(--ink);
   border-radius: 0;
   display: grid;
   place-items: center;
   cursor: pointer;
   transition: background-color var(--dur-fast) var(--ease-snap), border-color var(--dur-fast) var(--ease-snap);
}

.check-input:hover {
   background-color: var(--surface-2);
}

.check-input:checked {
   background-color: var(--accent);
   border-color: var(--accent);
}

.check-input:checked::after {
   content: "";
   width: 0.65rem;
   height: 0.35rem;
   border-left: 2px solid var(--accent-ink);
   border-bottom: 2px solid var(--accent-ink);
   transform: rotate(-45deg) translateY(-1px);
}

.check-copy {
   font-size: var(--text-sm);
   line-height: 1.5;
   color: var(--ink);
}

.form-honeypot {
   position: absolute;
   left: -9999px;
   width: 1px;
   height: 1px;
   overflow: hidden;
   opacity: 0;
   pointer-events: none;
}

.form-status {
   padding: var(--space-3) var(--space-4);
   border: 1px solid var(--ink);
   background-color: var(--ground);
   font-family: var(--wesa-304);
   font-size: var(--text-sm);
   color: var(--ink);
}

.form-status:empty {
   display: none;
}

.form-status.is-error {
   border-color: var(--accent);
   color: var(--accent-active);
}


.tool-box {
   background-color: var(--surface);
   border: 1px solid var(--ink);
   display: grid;
   grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 56rem) {
   .tool-box {
      grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
   }
}

.tool-inputs {
   padding: clamp(1.25rem, 3vw, 2rem);
   display: grid;
   gap: var(--space-4);
   border-bottom: 1px solid var(--line);
}

@media (min-width: 56rem) {
   .tool-inputs {
      border-bottom: 0;
      border-right: 1px solid var(--ink);
   }
}

.tool-readout {
   padding: clamp(1.25rem, 3vw, 2rem);
   background-color: var(--surface-2);
   display: grid;
   gap: var(--space-4);
   align-content: start;
}

.tool-formula {
   padding: var(--space-3);
   background-color: var(--ground);
   border: 1px solid var(--line);
   font-family: var(--wesa-304);
   font-size: var(--text-xs);
   line-height: 1.5;
   color: var(--ink-soft);
}

.tool-primary-metric {
   font-family: var(--wesa-304);
   font-size: clamp(1.65rem, 3vw, 2.65rem);
   font-weight: 700;
   line-height: 1.1;
   color: var(--ink);
   font-variant-numeric: tabular-nums;
}

.tool-metrics-grid {
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
   gap: var(--space-3);
   border-top: 1px solid var(--line);
   padding-top: var(--space-4);
}

.tool-metric-cell {
   background-color: var(--ground);
   border: 1px solid var(--line);
   padding: var(--space-3);
}

.tool-metric-cell dt {
   font-family: var(--wesa-304);
   font-size: var(--text-micro);
   text-transform: uppercase;
   letter-spacing: 0.06em;
   color: var(--ink-soft);
}

.tool-metric-cell dd {
   margin: 0.25rem 0 0;
   font-family: var(--wesa-304);
   font-size: var(--text-h4);
   font-weight: 700;
   color: var(--ink);
   font-variant-numeric: tabular-nums;
}

.tool-note-line {
   font-family: var(--wesa-304);
   font-size: var(--text-xs);
   color: var(--ink);
   line-height: 1.5;
}

.tool-disclaimer {
   font-size: var(--text-xs);
   color: var(--ink-soft);
   border-top: 1px solid var(--line);
   padding-top: var(--space-3);
}

input[type="range"].range-control {
   width: 100%;
   accent-color: var(--accent);
   min-height: var(--tap-min);
   cursor: pointer;
}


.site-footer {
   background-color: var(--ink);
   color: var(--ground);
   border-top: 3px solid var(--accent);
   padding-block: clamp(2.75rem, 5vw, 4.5rem) clamp(2rem, 4vw, 3rem);
}

.site-footer a {
   color: var(--ground);
   text-decoration-color: var(--line);
}

.site-footer a:hover {
   color: var(--surface);
   text-decoration-color: var(--accent);
}

.site-footer a:active {
   color: var(--ground);
}

.footer-grid {
   display: grid;
   grid-template-columns: minmax(0, 1fr);
   gap: var(--space-6);
}

@media (min-width: 56rem) {
   .footer-grid {
      grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr) minmax(0, 1fr);
   }
}

.footer-brand img {
   height: 3.75rem;
   width: auto;
}

.footer-fact-list {
   list-style: none;
   margin: var(--space-4) 0 0;
   padding: 0;
   font-family: var(--wesa-304);
   font-size: var(--text-xs);
   line-height: 1.65;
   color: var(--surface);
}

.footer-fact-list li {
   margin: 0;
}

.footer-heading {
   font-family: var(--wesa-304);
   font-size: var(--text-xs);
   font-weight: 700;
   text-transform: uppercase;
   letter-spacing: 0.08em;
   color: var(--surface-2);
   margin-bottom: var(--space-3);
}

.footer-nav-list {
   list-style: none;
   margin: 0;
   padding: 0;
   display: grid;
   gap: 0.15rem;
}

.footer-nav-list li {
   margin: 0;
}

.footer-nav-list a {
   display: inline-flex;
   align-items: center;
   min-height: var(--tap-min);
   padding-block: 0.35rem;
   font-size: var(--text-sm);
   text-decoration: none;
   border-bottom: 1px solid transparent;
   transition: color var(--dur-fast) var(--ease-snap), border-color var(--dur-fast) var(--ease-snap);
}

.footer-nav-list a:hover {
   border-bottom-color: var(--accent);
}

.footer-legal-bar {
   margin-top: var(--space-6);
   padding-top: var(--space-4);
   border-top: 1px solid var(--ink-soft);
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
   align-items: center;
   gap: var(--space-3) var(--space-6);
   font-family: var(--wesa-304);
   font-size: var(--text-xs);
   color: var(--surface-2);
}

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

.footer-legal-links li {
   margin: 0;
}

.footer-legal-links a,
.footer-consent-trigger {
   display: inline-flex;
   align-items: center;
   min-height: var(--tap-min);
   padding: 0.25rem 0.15rem;
   font-family: var(--wesa-304);
   font-size: var(--text-xs);
   color: var(--surface);
   text-decoration: underline;
   text-decoration-color: var(--line);
   background: none;
   border: 0;
   transition: color var(--dur-fast) var(--ease-snap);
}

.footer-legal-links a:hover,
.footer-consent-trigger:hover {
   color: var(--accent-ink);
   text-decoration-color: var(--accent);
}

.footer-legal-links a:active,
.footer-consent-trigger:active {
   color: var(--surface-2);
}


.consent-banner {
   position: fixed;
   left: 0;
   right: 0;
   bottom: 0;
   z-index: 70;
   background-color: var(--ink);
   color: var(--ground);
   border-top: 2px solid var(--accent);
   padding: 0.65rem var(--gutter);
   box-shadow: 0 -8px 24px rgba(43, 38, 28, 0.28);
}

@media (max-width: 59.99rem) {
   .consent-banner {
      bottom: calc(var(--dock-h) + env(safe-area-inset-bottom, 0px));
   }
}

.consent-inner {
   max-width: var(--container-max);
   margin-inline: auto;
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   justify-content: space-between;
   gap: 0.65rem var(--space-4);
}

.consent-copy {
   margin: 0;
   max-width: 58ch;
   font-size: var(--text-xs);
   line-height: 1.4;
   color: var(--ground);
}

.consent-copy a {
   color: var(--surface);
   text-decoration-color: var(--accent);
   font-weight: 600;
}

.consent-copy a:hover {
   color: var(--accent-ink);
}

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

.consent-btn {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   min-height: var(--tap-min);
   padding: 0.45rem 0.95rem;
   font-family: var(--wesa-304);
   font-size: var(--text-micro);
   font-weight: 700;
   text-transform: uppercase;
   letter-spacing: 0.06em;
   border: 1px solid var(--surface);
   background-color: transparent;
   color: var(--ground);
   transition: background-color var(--dur-fast) var(--ease-snap),
      border-color var(--dur-fast) var(--ease-snap),
      color var(--dur-fast) var(--ease-snap);
}

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

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

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

.consent-btn--accept:hover {
   background-color: var(--accent-hover);
   border-color: var(--accent-hover);
}

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


.chat-launcher {
   position: fixed;
   right: var(--gutter);
   bottom: 1rem;
   z-index: 65;
   display: inline-flex;
   align-items: center;
   gap: 0.5rem;
   min-height: var(--tap-min);
   padding: 0.6rem 1rem;
   background-color: var(--ink);
   color: var(--ground);
   border: 1px solid var(--ground);
   box-shadow: var(--shadow-mech);
   font-family: var(--wesa-304);
   font-size: var(--text-xs);
   font-weight: 700;
   text-transform: uppercase;
   letter-spacing: 0.06em;
   transition: background-color var(--dur-fast) var(--ease-snap),
      border-color var(--dur-fast) var(--ease-snap),
      color var(--dur-fast) var(--ease-snap),
      transform var(--dur-fast) var(--ease-snap),
      bottom var(--dur-med) var(--ease-mech);
}

.chat-launcher:hover {
   background-color: var(--accent);
   border-color: var(--ink);
   color: var(--accent-ink);
   transform: translateY(-1px);
}

.chat-launcher:active {
   background-color: var(--accent-active);
   color: var(--accent-ink);
   transform: translateY(1px);
}

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

@media (max-width: 59.99rem) {
   .chat-launcher {
      bottom: calc(var(--dock-h) + env(safe-area-inset-bottom, 0px) + 0.75rem);
   }
}

body.has-consent-open .chat-launcher {
   bottom: 12rem;
}

@media (max-width: 59.99rem) {
   body.has-consent-open .chat-launcher {
      bottom: calc(var(--dock-h) + env(safe-area-inset-bottom, 0px) + 14rem);
   }
}

.chat-badge {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   min-width: 1.35rem;
   height: 1.35rem;
   padding-inline: 0.35rem;
   background-color: var(--accent);
   color: var(--accent-ink);
   font-size: var(--text-micro);
   font-weight: 700;
}

.chat-panel {
   position: fixed;
   right: var(--gutter);
   bottom: 4.5rem;
   z-index: 75;
   width: min(24rem, calc(100vw - (var(--gutter) * 2)));
   max-height: min(34rem, 74dvh);
   display: flex;
   flex-direction: column;
   background-color: var(--ground);
   border: 2px solid var(--ink);
   box-shadow: var(--shadow-float);
}

@media (max-width: 59.99rem) {
   .chat-panel {
      bottom: calc(var(--dock-h) + env(safe-area-inset-bottom, 0px) + 0.75rem);
   }
}

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

.chat-title {
   font-family: var(--wesa-304);
   font-size: var(--text-xs);
   font-weight: 700;
   text-transform: uppercase;
   letter-spacing: 0.07em;
}

.chat-close {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   min-width: var(--tap-min);
   min-height: var(--tap-min);
   background: transparent;
   border: 1px solid var(--ink-soft);
   color: var(--ground);
   transition: background-color var(--dur-fast) var(--ease-snap), border-color var(--dur-fast) var(--ease-snap);
}

.chat-close:hover {
   background-color: var(--accent);
   border-color: var(--accent);
   color: var(--accent-ink);
}

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

.chat-body {
   flex: 1;
   overflow-y: auto;
   padding: var(--space-4);
   display: grid;
   gap: var(--space-3);
   align-content: start;
}

.chat-msg {
   padding: 0.65rem 0.85rem;
   border: 1px solid var(--line);
   background-color: var(--surface);
   font-size: var(--text-sm);
   line-height: 1.45;
   max-width: 88%;
}

.chat-msg--visitor {
   justify-self: end;
   background-color: var(--ink);
   border-color: var(--ink);
   color: var(--ground);
}

.chat-msg--staff {
   justify-self: start;
}

.chat-msg-time {
   display: block;
   margin-top: 0.25rem;
   font-family: var(--wesa-304);
   font-size: var(--text-micro);
   opacity: 0.75;
}

.chat-form {
   display: grid;
   gap: var(--space-2);
   padding: var(--space-3) var(--space-4);
   background-color: var(--surface);
   border-top: 1px solid var(--line);
}

.chat-compose-row {
   display: flex;
   gap: var(--space-2);
   align-items: stretch;
}

.chat-compose-row .field-control {
   flex: 1;
   min-width: 0;
}
