/* Components: Centru de Antrenament și Forță Masculină */

.site-header {
   position: relative;
   width: 100%;
   background-color: var(--ground);
   border-bottom: 1px solid var(--line);
   z-index: 100;
   transition: background-color var(--dur-base) var(--ease-out), border-color var(--dur-base) var(--ease-out);
}

.site-header__inner {
   display: flex;
   align-items: center;
   justify-content: space-between;
   height: 4.25rem;
   gap: var(--space-m);
}

.brand {
   display: inline-flex;
   align-items: center;
   flex-shrink: 0;
   max-width: 40vw;
   outline: none;
}

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

.brand-logo {
   height: 2.1rem;
   width: auto;
   max-height: 2.25rem;
   display: block;
}

.site-nav {
   display: none;
}

.site-header__action {
   display: none;
}

@media (min-width: 980px) {
   .site-nav {
      display: flex;
      align-items: center;
      gap: var(--space-s);
   }

   .site-nav__list {
      display: flex;
      align-items: center;
      gap: 0.25rem;
   }

   .site-nav__link {
      display: inline-flex;
      align-items: center;
      padding: 0.5rem 0.75rem;
      font-family: var(--raca-6c9);
      font-size: var(--step--1);
      font-weight: 700;
      color: var(--ink-soft);
      text-transform: uppercase;
      letter-spacing: 0.04em;
      border: 1px solid transparent;
      transition: color var(--dur-fast) var(--ease-out), background-color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
   }

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

   .site-nav__link:active {
      background-color: var(--surface-2);
   }

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

   .site-nav__link[aria-current="page"] {
      color: var(--accent);
      border-bottom: 2px solid var(--accent);
      background-color: var(--surface);
   }

   .site-header__action {
      display: inline-flex;
      align-items: center;
      flex-shrink: 0;
   }
}

.section-strip {
   display: none;
}

@media (min-width: 980px) {
   .section-strip {
      display: block;
      position: sticky;
      top: 0;
      z-index: 90;
      width: 100%;
      background-color: var(--surface);
      border-bottom: 1px solid var(--line);
      transition: transform var(--dur-fast) var(--ease-out);
   }

   .section-strip__inner {
      display: flex;
      align-items: center;
      height: 2.5rem;
      overflow-x: auto;
      scrollbar-width: none;
   }

   .section-strip__inner::-webkit-scrollbar {
      display: none;
   }

   .section-strip__list {
      display: flex;
      align-items: center;
      gap: 0;
      width: 100%;
   }

   .section-strip__item {
      flex-shrink: 0;
   }

   .section-strip__link {
      display: inline-flex;
      align-items: center;
      padding: 0.35rem 1rem;
      font-family: var(--raca-3c7);
      font-size: var(--step--1);
      font-weight: 500;
      color: var(--ink-soft);
      letter-spacing: 0.02em;
      border-right: 1px solid var(--line);
      transition: color var(--dur-fast) var(--ease-out), background-color var(--dur-fast) var(--ease-out);
   }

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

   .section-strip__link:active {
      background-color: var(--line);
   }

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

   .section-strip__link.is-active {
      color: var(--accent-ink);
      background-color: var(--accent);
      font-weight: 600;
   }

}

/* Mobile Dock Navigation: Fixed bottom, 5 items, max 72px */
.mobile-dock {
   position: fixed;
   inset: auto 0 0 0;
   height: 68px;
   background-color: var(--surface);
   border-top: 1px solid var(--line);
   z-index: 150;
   display: flex;
   align-items: stretch;
   padding-bottom: env(safe-area-inset-bottom);
}

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

.mobile-dock__list {
   display: flex;
   width: 100%;
   height: 100%;
   margin: 0;
   padding: 0;
}

.mobile-dock__item {

   flex: 1 1 0;
   display: flex;
   min-width: 0;
}

.mobile-dock__link,
.mobile-dock__button {
   appearance: none;
   background: none;
   border: 0;
   font: inherit;
   color: var(--ink-soft);
   width: 100%;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   gap: 3px;
   padding: 0.4rem 0.2rem;
   text-decoration: none;
   cursor: pointer;
   min-height: 48px;
   transition: color var(--dur-fast) var(--ease-out), background-color var(--dur-fast) var(--ease-out);
}

.mobile-dock__link:hover,
.mobile-dock__button:hover {
   color: var(--ink);

   background-color: var(--surface-2);
}

.mobile-dock__link:active,
.mobile-dock__button:active {
   background-color: var(--line);
}

.mobile-dock__link:focus-visible,
.mobile-dock__button:focus-visible {
   outline: 2px solid var(--accent);
   outline-offset: -2px;
}

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

.mobile-dock__icon {
   width: 22px;
   height: 22px;
   flex-shrink: 0;
}

.mobile-dock__label {
   font-family: var(--raca-6c9);
   font-size: 11px;
   line-height: 1;
   font-weight: 700;
   text-transform: uppercase;
   letter-spacing: 0.03em;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   max-width: 100%;
}

/* Mobile Drawer / Navigation Panel */
.nav-drawer {
   position: fixed;
   inset: 0;
   background-color: rgba(39, 41, 43, 0.65);
   backdrop-filter: blur(4px);
   -webkit-backdrop-filter: blur(4px);
   z-index: 200;
   opacity: 0;
   pointer-events: none;
   transition: opacity var(--dur-base) var(--ease-out);
}

.nav-drawer.is-open {
   opacity: 1;
   pointer-events: auto;
}

.nav-drawer__panel {
   position: absolute;
   bottom: 0;
   left: 0;
   right: 0;
   max-height: 85vh;
   background-color: var(--ground);
   border-top: 2px solid var(--accent);
   display: flex;
   flex-direction: column;
   transform: translateY(100%);
   transition: transform var(--dur-base) var(--ease-out);
   overflow-y: auto;
   padding-bottom: calc(var(--space-m) + env(safe-area-inset-bottom));
}

.nav-drawer.is-open .nav-drawer__panel {
   transform: translateY(0);
}

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

.nav-drawer__title {
   font-family: var(--raca-6c9);
   font-size: var(--raca-9b1);
   font-weight: 800;
   text-transform: uppercase;
   letter-spacing: 0.05em;
   color: var(--ink);
}

.nav-drawer__close {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   width: 44px;
   height: 44px;
   background: transparent;
   border: 1px solid var(--line);
   color: var(--ink);
   cursor: pointer;
   transition: background-color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}

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

.nav-drawer__close:active {
   background-color: var(--surface-2);
}

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

.nav-drawer__list {
   padding: var(--space-s) var(--space-m);
   display: flex;
   flex-direction: column;
   gap: 0;
}

.nav-drawer__link {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: var(--space-s) 0;
   border-bottom: 1px solid var(--line);
   font-family: var(--raca-6c9);
   font-size: var(--raca-eff);
   font-weight: 800;
   color: var(--ink);
   letter-spacing: -0.01em;
   min-height: 44px;
   transition: color var(--dur-fast) var(--ease-out), padding-left var(--dur-fast) var(--ease-out);
}

.nav-drawer__link:hover {
   color: var(--accent);
   padding-left: 0.5rem;
}

.nav-drawer__link:active {
   color: var(--ink);
}

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

.nav-drawer__link[aria-current="page"] {
   color: var(--accent);
   border-left: 4px solid var(--accent);
   padding-left: 0.5rem;
}

/* Buttons - Unified control height (48px), radius (0), shadow across all buttons */
.btn {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   gap: 0.5rem;
   padding: 0 1.25rem;
   height: 48px;
   min-height: 48px;
   font-family: var(--raca-6c9);
   font-size: var(--step--1);
   font-weight: 800;
   text-transform: uppercase;
   letter-spacing: 0.03em;
   text-decoration: none;
   cursor: pointer;
   border: 1px solid transparent;
   border-radius: 0;
   box-shadow: none;
   transition: background-color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out);
   white-space: nowrap;
   text-align: center;
   line-height: 1;
}

@media (max-width: 480px) {
   .btn {
      padding: 0 0.85rem;
   }
}

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

.btn-primary:hover {
   background-color: #24646D;
   border-color: #24646D;
   transform: translateY(-1px);
}

.btn-primary:active {
   background-color: #1D5057;
   border-color: #1D5057;
   transform: translateY(0);
}

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

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

.btn-secondary:hover {
   background-color: var(--surface);
   border-color: var(--ink);
   transform: translateY(-1px);
}

.btn-secondary:active {
   background-color: var(--surface-2);
   border-color: var(--ink);
   transform: translateY(0);
}

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

.btn-sm {
   padding: 0 1.15rem;
   height: 48px;
   min-height: 48px;
   font-size: var(--step--1);
}

.btn-block {
   width: 100%;
}

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

.form-label {
   font-family: var(--raca-6c9);
   font-size: var(--step--1);
   font-weight: 800;
   color: var(--ink);
   letter-spacing: 0.02em;
   text-transform: uppercase;
}

.form-label-optional {
   font-family: var(--raca-3c7);
   font-size: 0.8em;
   color: var(--ink-soft);
   font-weight: 400;
   text-transform: none;
   margin-left: 0.35rem;
}

.form-input,
.form-select,
.form-textarea {
   width: 100%;
   padding: 0 1rem;
   height: 48px;
   background-color: var(--surface);
   border: 1px solid var(--line);
   color: var(--ink);
   font-family: var(--raca-e7a);
   font-size: var(--raca-9b1);
   border-radius: 0;
   transition: border-color var(--dur-fast) var(--ease-out), background-color var(--dur-fast) var(--ease-out);
   min-height: 48px;
}

.form-textarea {
   height: auto;
   padding: 0.75rem 1rem;
}

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

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

.form-input:focus,
.form-select:focus,
.form-textarea:focus {
   background-color: var(--ground);
   border-color: var(--accent);
   outline: 2px solid var(--accent);
   outline-offset: 1px;
}

.form-input:active,
.form-select:active,
.form-textarea:active {
   background-color: var(--ground);
}

.form-input[aria-invalid='true'],
.form-select[aria-invalid='true'],
.form-textarea[aria-invalid='true'] {
   border-color: #A32D2D;
   background-color: #F8EDED;
}

.form-error {
   font-family: var(--raca-3c7);
   font-size: var(--step--1);
   color: #A32D2D;
   font-weight: 500;
   margin-top: 0.25rem;
   display: none;
}

.form-error.is-visible {
   display: block;
}

.form-checkbox-label {
   display: flex;
   align-items: flex-start;
   gap: 0.5rem;
   cursor: pointer;
   font-family: var(--raca-e7a);
   font-size: var(--raca-9b1);
   color: var(--ink-soft);
   line-height: 1.45;
}

.form-checkbox-label a {
   display: inline;
}

.form-checkbox {
   appearance: none;
   width: 22px;
   height: 22px;
   flex-shrink: 0;
   margin: 0.15rem 0 0 0;
   background-color: var(--surface);
   border: 1px solid var(--line);
   display: inline-grid;
   cursor: pointer;
   place-content: center;
   transition: background-color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}

.form-checkbox:hover {
   border-color: var(--ink);
   background-color: var(--surface-2);
}

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

.form-checkbox:checked {
   background-color: var(--accent);
   border-color: var(--accent);
}

.form-checkbox:checked::after {
   content: "";
   width: 10px;
   height: 6px;
   border-left: 2px solid var(--accent-ink);
   border-bottom: 2px solid var(--accent-ink);
   transform: rotate(-45deg) translate(1px, -1px);
}

/* Directory Index Table */
.index-table {
   width: 100%;
   border: 1px solid var(--line);
   background-color: var(--surface);
}

.index-table__row {
   display: grid;
   grid-template-columns: 3.5rem 1fr auto;
   align-items: center;
   padding: var(--space-s) var(--space-m);
   border-bottom: 1px solid var(--line);
   gap: var(--space-m);
   text-decoration: none;
   transition: background-color var(--dur-fast) var(--ease-out);
}

.index-table__row:last-child {
   border-bottom: none;
}

.index-table__row:hover {
   background-color: var(--ground);
}

.index-table__row:active {
   background-color: var(--surface-2);
}

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

.index-table__num {
   font-family: var(--raca-3c7);
   font-size: var(--raca-9b1);
   font-weight: 600;
   color: var(--ink-soft);
}

.index-table__content {
   min-width: 0;
}

.index-table__heading {
   font-family: var(--raca-6c9);
   font-size: var(--raca-eff);
   font-weight: 800;
   color: var(--ink);
   letter-spacing: -0.01em;
   margin-bottom: 0.25rem;
}

.index-table__desc {
   font-family: var(--raca-e7a);
   font-size: var(--step--1);
   color: var(--ink-soft);
   max-width: 60ch;
}

.index-table__action {
   color: var(--ink-soft);
   transition: color var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out);
}

.index-table__row:hover .index-table__action {
   color: var(--accent);
   transform: translateX(3px);
}

@media (max-width: 640px) {
   .index-table__row {
      grid-template-columns: 1fr auto;
      padding: var(--space-s);
      gap: var(--space-xs);
   }

   .index-table__num {
      display: none;
   }
}

/* Service Item Cards / Blocks */
.service-block {
   background-color: var(--surface);
   border: 1px solid var(--line);
   display: flex;
   flex-direction: column;
   height: 100%;
   transition: border-color var(--dur-fast) var(--ease-out);
}

.service-block:hover {
   border-color: var(--ink);
}

.service-block__media {
   width: 100%;
   aspect-ratio: 16 / 10;
   position: relative;
   overflow: hidden;
   border-bottom: 1px solid var(--line);
   background-color: var(--surface-2);
}

.service-block__img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   display: block;
}

.service-block__body {
   padding: var(--space-m);
   display: flex;
   flex-direction: column;
   flex-grow: 1;
   gap: var(--space-xs);
}

.service-block__price {
   font-family: var(--raca-3c7);
   font-size: var(--raca-eff);
   font-weight: 600;
   color: var(--accent);
   font-variant-numeric: tabular-nums;
}

.service-block__title {
   font-family: var(--raca-6c9);
   font-size: var(--raca-a38);
   font-weight: 800;
   line-height: 1.15;
   color: var(--ink);
}

.service-block__desc {
   font-size: var(--raca-9b1);
   color: var(--ink-soft);
   line-height: 1.55;
   margin-top: 0.25rem;
}

.service-block__footer {
   padding: var(--space-s) var(--space-m);
   border-top: 1px solid var(--line);
   background-color: var(--ground);
   margin-top: auto;
}

.spec-table {
   width: 100%;
   border: 1px solid var(--line);
   background-color: var(--surface);
   margin-block: var(--space-m);
}

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

.spec-table th {
   font-family: var(--raca-6c9);
   font-size: var(--step--1);
   font-weight: 800;
   text-transform: uppercase;
   letter-spacing: 0.04em;
   background-color: var(--surface-2);
   color: var(--ink);
}

.spec-table td {
   font-size: var(--raca-9b1);
   color: var(--ink);
}

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

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

.spec-table td.col-mono {
   font-family: var(--raca-3c7);
   font-variant-numeric: tabular-nums;
   font-weight: 600;
}

.spec-kinu594 {
   overflow-x: auto;
   -webkit-overflow-scrolling: touch;
   border: 1px solid var(--line);
   max-width: 100%;
}

.spec-kinu594 .spec-table {
   border: none;
   margin: 0;
}

@media (max-width: 1200px) {
   .spec-table {
      display: block;
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
      max-width: 100%;
   }
}

/* FAQ Accordion */
.accordion {
   border-top: 1px solid var(--line);
   margin-top: var(--space-m);
}

.accordion__item {
   border-bottom: 1px solid var(--line);
}

.accordion__trigger {
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: var(--space-s) 0;
   background: transparent;
   border: none;
   font-family: var(--raca-6c9);
   font-size: var(--raca-eff);
   font-weight: 800;
   color: var(--ink);
   text-align: left;
   cursor: pointer;
   gap: var(--space-s);
   transition: color var(--dur-fast) var(--ease-out);
   min-height: 48px;
}

.accordion__trigger:hover {
   color: var(--accent);
}

.accordion__trigger:active {
   color: var(--ink);
}

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

.accordion__icon {
   width: 20px;
   height: 20px;
   transition: transform var(--dur-fast) var(--ease-out);
   flex-shrink: 0;
}

.accordion__trigger[aria-expanded='true'] .accordion__icon {
   transform: rotate(180deg);
}

.accordion__content {
   padding-bottom: var(--space-m);
   color: var(--ink-soft);
   font-size: var(--raca-9b1);
   line-height: 1.65;
}

/* Site Footer */
.site-footer {
   background-color: var(--surface);
   border-top: 1px solid var(--line);
   padding-top: var(--space-2xl);
   padding-bottom: var(--space-xl);
   margin-top: auto;
}

.site-footer__grid {
   display: grid;
   grid-template-columns: 2fr 1fr 1fr;
   gap: var(--space-xl);
   margin-bottom: var(--space-2xl);
}

.site-footer__brand {
   display: flex;
   flex-direction: column;
   gap: var(--space-s);
}

.site-footer__logo {
   height: 2.4rem;
   width: auto;
   max-width: 100%;
}

.site-footer__heading {
   font-family: var(--raca-6c9);
   font-size: var(--raca-9b1);
   font-weight: 800;
   text-transform: uppercase;
   letter-spacing: 0.05em;
   color: var(--ink);
   margin-bottom: var(--space-s);
}

.site-footer__nav {
   display: flex;
   flex-direction: column;
   gap: 0.5rem;
}

.site-footer__link {
   font-family: var(--raca-e7a);
   font-size: var(--step--1);
   color: var(--ink-soft);
   display: inline-flex;
   align-items: center;
   min-height: 44px;
   padding-block: 0.4rem;
   transition: color var(--dur-fast) var(--ease-out), padding-left var(--dur-fast) var(--ease-out);
}

.site-footer__link:hover {
   color: var(--ink);
   padding-left: 0.25rem;
}

.site-footer__link:active {
   color: var(--accent);
}

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

.site-footer__legal-bar {
   border-top: 1px solid var(--line);
   padding-top: var(--space-m);
   display: flex;
   flex-direction: column;
   gap: var(--space-s);
}

.site-footer__operator-facts {
   font-family: var(--raca-3c7);
   font-size: var(--step--1);
   color: var(--ink-soft);
   line-height: 1.6;
}

.site-footer__legal-links {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   gap: var(--space-s);
}

.site-footer__legal-link {
   font-family: var(--raca-3c7);
   font-size: var(--step--1);
   color: var(--ink-soft);
   text-decoration: underline;
   text-underline-offset: 3px;
   display: inline-flex;
   align-items: center;
   min-height: 44px;
   padding-block: 0.35rem;
   transition: color var(--dur-fast) var(--ease-out);
}

.site-footer__legal-link:hover {
   color: var(--accent);
}

.site-footer__legal-link:active {
   color: var(--ink);
}

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

@media (max-width: 768px) {
   .site-footer__grid {
      grid-template-columns: 1fr;
      gap: var(--space-xl);
   }
}

/* Cookie Consent Bar */
.cookie-banner {
   position: fixed;
   inset: auto 0 0 0;
   z-index: 300;
   background-color: var(--surface);
   border-top: 2px solid var(--ink);
   padding: 0.85rem var(--container-pad);
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: var(--space-m);
   max-height: 20vh;
   box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08);
   transform: translateY(0);
   transition: transform var(--dur-base) var(--ease-out);
}

@media (max-width: 979px) {
   .cookie-banner {
      bottom: 68px;
      z-index: 130;
   }
   .cookie-banner__actions {
      margin-right: 70px;
   }
}

.cookie-banner.is-hidden {
   transform: translateY(100%);
   pointer-events: none;
}

.cookie-banner__text {
   font-family: var(--raca-e7a);
   font-size: var(--step--1);
   color: var(--ink);
   line-height: 1.4;
   margin: 0;
   max-width: 65ch;
}

.cookie-banner__link {
   color: var(--ink);
   text-decoration: underline;
   text-underline-offset: 2px;
   font-weight: 600;
}

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

.cookie-banner__btn {
   padding: 0.45rem 1rem;
   min-height: 40px;
   font-family: var(--raca-6c9);
   font-size: var(--step--1);
   font-weight: 700;
   text-transform: uppercase;
   letter-spacing: 0.04em;
   border: 1px solid var(--line);
   background-color: var(--ground);
   color: var(--ink);
   cursor: pointer;
   transition: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}

.cookie-banner__btn:hover {
   background-color: var(--surface-2);
   border-color: var(--ink);
}

.cookie-banner__btn:active {
   background-color: var(--line);
}

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

.cookie-banner__btn-accept {
   background-color: var(--accent);
   color: var(--accent-ink);
   border-color: var(--accent);
}

.cookie-banner__btn-accept:hover {
   background-color: #24646D;
   border-color: #24646D;
}

@media (max-width: 640px) {
   .cookie-banner {
      flex-direction: column;
      align-items: flex-start;
      gap: var(--space-xs);
      padding: 0.75rem var(--container-pad);
      padding-right: 76px;
   }

   .cookie-banner__actions {
      width: 100%;
      justify-content: flex-start;
      margin-right: 0;
   }
}

/* Chat Launcher & Panel */
.chat-launcher {
   position: fixed;
   bottom: 230px;
   right: 1.25rem;
   z-index: 140;
   width: 52px;
   height: 52px;
   background-color: var(--ink);
   color: var(--ground);
   border: 1px solid var(--line);
   display: flex;
   align-items: center;
   justify-content: center;
   cursor: pointer;
   transition: background-color var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out);
}

@media (min-width: 980px) {
   .chat-launcher {
      bottom: 2rem;
      right: 2rem;
      width: 56px;
      height: 56px;
   }
}

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

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

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

.chat-launcher__badge {
   position: absolute;
   top: -4px;
   right: -4px;
   background-color: var(--accent);
   color: var(--accent-ink);
   font-family: var(--raca-3c7);
   font-size: 11px;
   font-weight: 700;
   width: 20px;
   height: 20px;
   display: flex;
   align-items: center;
   justify-content: center;
   border: 1px solid var(--ground);
}

.chat-panel {
   position: fixed;
   bottom: 88px;
   right: 1.25rem;
   width: min(380px, calc(100vw - 2.5rem));
   height: 520px;
   max-height: calc(100vh - 140px);
   max-height: calc(100svh - 140px);
   max-height: calc(100dvh - 140px);
   background-color: var(--ground);
   border: 2px solid var(--ink);
   z-index: 250;
   display: flex;
   flex-direction: column;
   box-shadow: 0 8px 30px rgba(0, 0, 0, 0.15);
   transform: translateY(20px);
   opacity: 0;
   pointer-events: none;
   visibility: hidden;
   transition: transform var(--dur-base) var(--ease-out), opacity var(--dur-base) var(--ease-out), visibility var(--dur-base) var(--ease-out);
}

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

.chat-panel.is-open {
   transform: translateY(0);
   opacity: 1;
   visibility: visible;
   pointer-events: auto;
}

.chat-panel__header {
   padding: var(--space-s) var(--space-m);
   background-color: var(--surface);
   border-bottom: 1px solid var(--line);
   display: flex;
   align-items: center;
   justify-content: space-between;
}

.chat-panel__title {
   font-family: var(--raca-6c9);
   font-size: var(--raca-9b1);
   font-weight: 800;
   color: var(--ink);
}

.chat-panel__close {
   background: transparent;
   border: none;
   color: var(--ink-soft);
   cursor: pointer;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   padding: 4px;
   min-height: 36px;
   min-width: 36px;
   transition: color var(--dur-fast) var(--ease-out);
}

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

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

.chat-panel__body {
   flex: 1;
   overflow-y: auto;
   padding: var(--space-m);
   display: flex;
   flex-direction: column;
   gap: var(--space-s);
}

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

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

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

.chat-panel__footer {
   padding: var(--space-s);
   border-top: 1px solid var(--line);
   background-color: var(--surface);
}

.chat-panel__form {
   display: flex;
   gap: 0.5rem;
}

.chat-panel__input {
   flex: 1;
   padding: 0.5rem 0.75rem;
   background-color: var(--ground);
   border: 1px solid var(--line);
   font-size: 16px;
   min-height: 42px;
}

.chat-panel__input:focus {
   outline: 2px solid var(--accent);
   border-color: var(--accent);
}

.chat-panel__send {
   background-color: var(--accent);
   color: var(--accent-ink);
   border: none;
   padding: 0 1rem;
   cursor: pointer;
   min-height: 42px;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   transition: background-color var(--dur-fast) var(--ease-out);
}

.chat-panel__send:hover {
   background-color: #24646D;
}

.chat-panel__send:active {
   background-color: #1D5057;
}

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