/* Learhatven Component Styles */


.btn {
   display:inline-flex;
   align-items:center;
   justify-content:center;
   gap:var(--space-xs);
   min-height:48px;
   padding:0.75rem 1.625rem;
   font-family:var(--kume-25e);
   font-size:var(--font-size-sm);
   font-weight:600;
   line-height:1.2;

   text-decoration:none;
   text-align:center;
   white-space:nowrap;
   border-radius:var(--radius-xs);
   border:1px solid transparent;
   cursor:pointer;
   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),
                     transform var(--dur-instant) var(--ease-standard);
   user-select:none;
   -webkit-tap-highlight-color:transparent;
}

.btn .icon {
   width:1.125rem;
   height:1.125rem;
   transition:transform var(--dur-fast) var(--ease-standard);
}

.btn-primary {
   background-color:var(--accent);
   color:var(--accent-ink);
   border-color:var(--accent);
   box-shadow:0 1px 2px rgba(43, 40, 39, 0.08);
}

.btn-primary:hover {
   background-color:var(--accent-hover);
   border-color:var(--accent-hover);
   color:var(--accent-ink);
   text-decoration:none;
   box-shadow:0 3px 8px rgba(169, 96, 95, 0.24);
   transform:translateY(-1px);
}

.btn-primary:active {
   background-color:var(--accent-active);
   border-color:var(--accent-active);
   color:var(--accent-ink);
   box-shadow:0 1px 2px rgba(43, 40, 39, 0.16);
   transform:translateY(1px);
}

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

.btn-primary:hover .icon { transform:translateX(2px); }

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

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

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

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

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

.btn-outline:hover {
   background-color:var(--ink);
   color:var(--ground);
   border-color:var(--ink);
   text-decoration:none;
   transform:translateY(-1px);
}

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

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

.btn-sm {
   min-height:40px;
   padding:0.5rem 1.125rem;
   font-size:var(--font-size-xs);
}

.btn-block {
   display:flex;
   width:100%;
}

.action-link {
   display:inline-flex;
   align-items:center;
   gap:var(--space-xs);
   font-weight:600;
   font-size:var(--font-size-sm);
   color:var(--ink);
   text-decoration:underline;
   text-underline-offset:4px;
   min-height:44px;
   padding:0.25rem 0;
   transition:color var(--dur-fast) var(--ease-standard),
                     text-decoration-color var(--dur-fast) var(--ease-standard),
                     transform var(--dur-instant) var(--ease-standard);
}

.action-link .icon {
   width:1rem;
   height:1rem;
   transition:transform var(--dur-fast) var(--ease-standard);
}

.action-link:hover {
   color:var(--accent);
   text-decoration-color:var(--accent);
}

.action-link:hover .icon { transform:translateX(3px); }

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

   text-decoration-color:var(--accent-active);
   transform:translateY(1px);
}

.action-link:focus-visible {
   outline:2px solid var(--focus-ring);
   outline-offset:3px;
   border-radius:var(--radius-xs);

}


.site-sidebar {
   display:none;
   background-color:var(--surface);
   border-right:1px solid var(--line);
   padding:var(--space-xl) var(--space-lg);
   flex-direction:column;
   justify-content:space-between;
}

@media (min-width: 1024px) {
   .site-sidebar { display:flex; }
}

.sidebar-brand-wrap { margin-bottom:var(--space-2xl); }

.sidebar-brand-wrap .brand {
   display:inline-block;
   text-decoration:none;
   min-height:44px;
   display:flex;
   align-items:center;
}

.sidebar-brand-wrap .brand img {
   height:2.1rem;
   width:auto;
   max-width:100%;
   display:block;
}

.sidebar-nav { margin-bottom:auto; }

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

.sidebar-nav-item { margin:0; }

.sidebar-nav-link {
   display:flex;
   align-items:center;
   justify-content:space-between;
   padding:0.625rem 0.875rem;
   font-family:var(--kume-25e);
   font-size:var(--font-size-sm);
   font-weight:500;
   color:var(--ink);
   text-decoration:none;
   border-radius:var(--radius-xs);
   min-height:44px;
   border-left:2px solid transparent;
   transition:background-color var(--dur-fast) var(--ease-standard),
                     color var(--dur-fast) var(--ease-standard),
                     border-color var(--dur-fast) var(--ease-standard),
                     transform var(--dur-instant) var(--ease-standard);
}

.sidebar-nav-link .nav-glyph {
   width:1rem;
   height:1rem;
   opacity:0.7;
   transition:opacity var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard);
}

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

.sidebar-nav-link:hover .nav-glyph {
   opacity:1;
   transform:translateX(2px);
}

.sidebar-nav-link:active {
   background-color:var(--surface-active);
   color:var(--ink);
   transform:translateX(1px);
}

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

.sidebar-nav-link[aria-current='page'] {
   background-color:var(--surface-2);
   color:var(--ink);
   font-weight:600;
   border-left-color:var(--accent);
}

.sidebar-nav-link[aria-current='page'] .nav-glyph {
   opacity:1;
   color:var(--accent);
}

.sidebar-contact {
   margin-top:var(--space-xl);
   padding-top:var(--space-lg);
   border-top:1px solid var(--line);
   font-size:var(--font-size-xs);
}

.sidebar-contact .studio-status {
   display:flex;
   align-items:center;
   gap:0.375rem;
   font-family:var(--kume-1f2);
   font-size:0.75rem;
   text-transform:uppercase;
   letter-spacing:var(--tracking-wider);
   color:var(--ink-soft);
   margin-bottom:var(--space-xs);
}

.sidebar-contact .status-dot {
   width:6px;
   height:6px;
   border-radius:50%;
   background-color:#3b7a57;
}

.sidebar-contact address {
   font-style:normal;
   color:var(--ink-soft);
   line-height:var(--leading-snug);
   margin-bottom:var(--space-xs);
}

.sidebar-phone,
.sidebar-email {
   display:block;
   font-family:var(--kume-1f2);
   font-size:var(--font-size-xs);
   color:var(--ink);
   text-decoration:none;
   min-height:44px;
   display:flex;
   align-items:center;
   transition:color var(--dur-fast) var(--ease-standard);
}

.sidebar-phone:hover,
.sidebar-email:hover { color:var(--accent); }

.sidebar-phone:focus-visible,
.sidebar-email:focus-visible {
   outline:2px solid var(--focus-ring);
   outline-offset:2px;
}


.site-header {
   position:relative;
   width:100%;
   height:var(--header-mobile-h);
   background-color:var(--ground);
   border-bottom:1px solid var(--line);
   display:flex;
   align-items:center;
   justify-content:flex-start;
   padding:0 var(--space-md);
   z-index:90;
}

@media (min-width: 1024px) {
   .site-header,
   header.site-header { display:none !important; }
}

.site-header .brand {
   display:flex;
   align-items:center;
   text-decoration:none;
   min-height:44px;
   max-width:38vw;
}

.site-header .brand img {
   height:1.85rem;
   width:auto;
   max-width:100%;
   display:block;
}

.mobile-dock {
   position:fixed;
   inset:auto 0 0 0;
   width:100%;
   height:calc(var(--dock-h) + env(safe-area-inset-bottom, 0px));
   padding-bottom:env(safe-area-inset-bottom, 0px);
   background-color:var(--surface);
   border-top:1px solid var(--line);
   box-shadow:0 -2px 10px rgba(43, 40, 39, 0.06);
   z-index:1000;
   display:flex;
   contain:layout style paint;
}

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

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

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

.dock-link,
.dock-button {
   appearance:none;
   background:none;
   border:0;
   font:inherit;
   color:var(--ink-soft);
   text-decoration:none;
   width:100%;
   height:100%;
   min-height:44px;
   display:flex;
   flex-direction:column;
   align-items:center;
   justify-content:center;
   gap:3px;
   padding:6px 2px;
   cursor:pointer;
   transition:color var(--dur-fast) var(--ease-standard),
                     background-color var(--dur-fast) var(--ease-standard);
   -webkit-tap-highlight-color:transparent;
}

.dock-link .icon,
.dock-button .icon {
   width:22px;
   height:22px;
   fill:currentColor;
}

.dock-label {
   font-family:var(--kume-25e);
   font-size:11px;
   font-weight:500;
   line-height:1;
   white-space:nowrap;
   letter-spacing:-0.01em;
}

.dock-link:hover,
.dock-button:hover {
   color:var(--ink);
   background-color:var(--surface-hover);
}

.dock-link:active,
.dock-button:active {
   color:var(--ink);
   background-color:var(--surface-active);
}

.dock-link:focus-visible,
.dock-button:focus-visible {
   outline:2px solid var(--focus-ring);
   outline-offset:-2px;
}

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

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

.dock-link[aria-current='page'] .dock-label {
   color:var(--ink);
   font-weight:600;
}


.drawer-backdrop {
   position:fixed;
   inset:0;
   background-color:rgba(43, 40, 39, 0.45);
   backdrop-filter:blur(4px);
   -webkit-backdrop-filter:blur(4px);
   z-index:1050;
   opacity:0;
   visibility:hidden;
   transition:opacity var(--dur-base) var(--ease-standard),
                     visibility var(--dur-base) var(--ease-standard);
}

.drawer-backdrop.is-open {
   opacity:1;
   visibility:visible;
}

.drawer-panel {
   position:fixed;
   inset:0 0 0 auto;
   width:min(340px, 86vw);
   height:100%;
   background-color:var(--ground);
   border-left:1px solid var(--line);
   box-shadow:var(--shadow-elevated);
   z-index:1100;
   transform:translateX(100%);
   transition:transform var(--dur-base) var(--ease-standard);
   display:flex;
   flex-direction:column;
   overflow-y:auto;
   padding:var(--space-lg);
}

.drawer-panel.is-open { transform:translateX(0); }

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

.drawer-header .brand {
   display:flex;
   align-items:center;
   text-decoration:none;
   min-height:44px;
}

.drawer-header .brand img {
   height:1.75rem;
   width:auto;
}

.drawer-close {
   display:inline-flex;
   align-items:center;
   justify-content:center;
   width:44px;
   height:44px;
   border-radius:var(--radius-xs);
   color:var(--ink);
   background-color:var(--surface);
   border:1px solid var(--line);
   transition:background-color var(--dur-fast) var(--ease-standard),
                     border-color var(--dur-fast) var(--ease-standard),
                     transform var(--dur-instant) var(--ease-standard);
}

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

.drawer-close:active {
   background-color:var(--surface-active);
   transform:scale(0.96);
}

.drawer-close:focus-visible {
   outline:2px solid var(--focus-ring);
   outline-offset:2px;
}

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

.drawer-nav-link {
   display:flex;
   align-items:center;
   justify-content:space-between;
   padding:0.75rem var(--space-sm);
   font-family:var(--kume-25e);
   font-size:var(--font-size-base);
   font-weight:500;
   color:var(--ink);
   text-decoration:none;
   border-radius:var(--radius-xs);
   min-height:44px;
   transition:background-color var(--dur-fast) var(--ease-standard),
                     color var(--dur-fast) var(--ease-standard);
}

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

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

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

.drawer-nav-link[aria-current='page'] {
   background-color:var(--surface);
   font-weight:600;
   border-left:3px solid var(--accent);
}

.drawer-footer {
   margin-top:auto;
   padding-top:var(--space-lg);
   border-top:1px solid var(--line);
   font-size:var(--font-size-xs);
   color:var(--ink-soft);
}

.drawer-footer address {
   font-style:normal;
   line-height:var(--leading-snug);
   margin-bottom:var(--space-xs);
}

.drawer-footer a {
   display:block;
   min-height:44px;
   display:flex;
   align-items:center;
   color:var(--ink);
   text-decoration:none;
   font-family:var(--kume-1f2);
}

.drawer-footer a:hover { color:var(--accent); }


.verb-section {
   padding-top:var(--space-3xl);
   padding-bottom:var(--space-3xl);
   border-bottom:1px solid var(--line);
   position:relative;
}

.verb-section:last-of-type { border-bottom:none; }

.verb-headline {
   font-family:var(--kume-fe9);
   font-size:var(--font-size-display);
   font-weight:400;
   line-height:1.05;
   letter-spacing:var(--tracking-tight);
   color:var(--ink);
   margin-bottom:var(--space-lg);
   display:block;
}

.verb-prose {
   max-width:var(--measure-prose);
   font-size:var(--font-size-base);
   line-height:var(--leading-base);
   color:var(--ink);
}

.verb-prose p { margin-bottom:var(--space-md); }

.band-image {
   width:100%;
   margin:var(--space-2xl) 0;
   position:relative;
   overflow:hidden;
   background-color:var(--surface-2);
   border-top:1px solid var(--line);
   border-bottom:1px solid var(--line);
}

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

.band-caption {
   padding:var(--space-xs) var(--space-md);
   font-family:var(--kume-1f2);
   font-size:var(--font-size-xs);
   color:var(--ink-soft);
   background-color:var(--surface);
   border-top:1px solid var(--line);
   display:flex;
   align-items:center;
   justify-content:space-between;
   gap:var(--space-sm);
}


.collage-showcase {
   position:relative;
   padding:var(--space-2xl) 0;
   margin:var(--space-2xl) 0;
   min-height:480px;
}

.collage-cluster {
   position:relative;
   width:100%;
   max-width:960px;
   margin:0 auto;
   height:520px;
}

.collage-item {
   position:absolute;
   box-shadow:var(--shadow-elevated);
   border:1px solid var(--line);
   background-color:var(--surface);
   overflow:hidden;
   transition:transform var(--dur-base) var(--ease-standard);
}

.collage-item img {
   display:block;
   width:100%;
   height:100%;
   object-fit:cover;
}

.collage-item-1 {
   width:58%;
   height:380px;
   top:0;
   left:0;
   z-index:1;
   transform:rotate(-2deg);
}

.collage-item-2 {
   width:50%;
   height:340px;
   top:90px;
   right:0;
   z-index:2;
   transform:rotate(1.5deg);
}

.collage-item-3 {
   width:42%;
   height:260px;
   bottom:0;
   left:20%;
   z-index:3;
   transform:rotate(-0.5deg);
}

.collage-item:hover {
   z-index:10;
   transform:scale(1.02) rotate(0deg);
}

@media (max-width: 640px) {
   .collage-cluster { height:420px; }
   .collage-item-1 {
      width:70%;
      height:260px;
   }
   .collage-item-2 {
      width:65%;
      height:240px;
      top:120px;
   }
   .collage-item-3 {
      width:60%;
      height:190px;
      bottom:0;
      left:10%;
   }
}


.card-grid {
   display:grid;
   grid-template-columns:repeat(auto-fill, minmax(min(100%, 320px), 1fr));
   gap:var(--space-lg);
   margin:var(--space-xl) 0;
}

.card-grid-2 {
   display:grid;
   grid-template-columns:repeat(auto-fit, minmax(min(100%, 420px), 1fr));
   gap:var(--space-lg);
   margin:var(--space-xl) 0;
}

.card {
   background-color:var(--surface);
   border:1px solid var(--line);
   border-radius:var(--radius-xs);
   padding:var(--space-lg);
   display:flex;
   flex-direction:column;
   position:relative;
   transition:border-color var(--dur-fast) var(--ease-standard),
                     box-shadow var(--dur-fast) var(--ease-standard),
                     transform var(--dur-instant) var(--ease-standard);
}

.card:hover {
   border-color:var(--ink-soft);
   box-shadow:var(--shadow-subtle);
}

.card-header { margin-bottom:var(--space-sm); }

.card-title {
   font-family:var(--kume-fe9);
   font-size:var(--font-size-xl);
   font-weight:500;
   margin-bottom:var(--space-2xs);
}

.card-price {
   font-family:var(--kume-1f2);
   font-size:var(--font-size-md);
   font-weight:500;
   color:var(--ink);
   margin-bottom:var(--space-xs);
}

.card-body {
   flex:1 1 auto;
   font-size:var(--font-size-sm);
   color:var(--ink);
   margin-bottom:var(--space-md);
}

.card-footer {
   margin-top:auto;
   padding-top:var(--space-sm);
   border-top:1px solid var(--line);
}

.spec-table-wrap {
   width:100%;
   overflow-x:auto;
   margin:var(--space-xl) 0;
   border:1px solid var(--line);
   background-color:var(--surface);
   border-radius:var(--radius-xs);
}

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

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

.spec-table th {
   font-family:var(--kume-1f2);
   font-size:var(--font-size-xs);
   font-weight:500;
   text-transform:uppercase;
   letter-spacing:var(--tracking-wider);
   color:var(--ink-soft);
   background-color:var(--surface-2);
}

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

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

.spec-table .numeral { font-weight:500; }


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

.form-label {
   font-family:var(--kume-25e);
   font-size:var(--font-size-sm);
   font-weight:600;
   color:var(--ink);
   display:flex;
   justify-content:space-between;
   align-items:baseline;
}

.form-label .form-hint {
   font-size:var(--font-size-xs);
   font-weight:400;
   color:var(--ink-soft);
}

.form-control {
   width:100%;
   min-height:48px;
   padding:0.75rem 1rem;
   font-family:var(--kume-25e);
   font-size:16px;
   color:var(--ink);
   background-color:var(--surface-2);
   border:1px solid var(--line);
   border-radius:var(--radius-xs);
   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);
}

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

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

.form-control:focus {
   outline:none;
   border-color:var(--ink);
   background-color:var(--ground);
   box-shadow:0 0 0 2px var(--focus-ring);
}

.form-control[aria-invalid="true"] {
   border-color:#b93838;
   background-color:#f8ebeb;
}

.form-control[aria-invalid="true"]:focus { box-shadow:0 0 0 2px #b93838; }

textarea.form-control {
   min-height:120px;
   resize:vertical;
   line-height:var(--leading-base);
}

.form-checkbox-label {
   display:flex;
   align-items:flex-start;
   gap:var(--space-xs);
   font-size:var(--font-size-sm);
   color:var(--ink);
   cursor:pointer;
   user-select:none;
   min-height:44px;
   padding:0.25rem 0;
}

.form-checkbox {
   appearance:none;
   -webkit-appearance:none;
   width:20px;
   height:20px;
   margin-top:2px;
   border:1px solid var(--line);
   border-radius:var(--radius-xs);
   background-color:var(--surface-2);
   cursor:pointer;
   flex-shrink:0;
   display:grid;
   place-content:center;
   transition:background-color var(--dur-fast) var(--ease-standard),
                     border-color var(--dur-fast) var(--ease-standard);
}

.form-checkbox:hover { border-color:var(--ink-soft); }

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

.form-checkbox:checked::before {
   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);
}

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

.field-error {
   display:none;
   font-size:var(--font-size-xs);
   color:#b93838;
   font-weight:500;
   margin-top:2px;
}

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

.form-status {
   padding:var(--space-md);
   border-radius:var(--radius-xs);
   margin-bottom:var(--space-md);
   display:none;
   font-size:var(--font-size-sm);
}

.form-status.is-success {
   display:block;
   background-color:#e2ece5;
   border:1px solid #3b7a57;
   color:#1f4530;
}

.form-status.is-error {
   display:block;
   background-color:#f8ebeb;
   border:1px solid #b93838;
   color:#6c1e1e;
}


.badge {
   display:inline-flex;
   align-items:center;
   gap:0.375rem;
   padding:0.25rem 0.625rem;
   font-family:var(--kume-1f2);
   font-size:var(--font-size-xs);
   font-weight:500;
   text-transform:uppercase;
   letter-spacing:var(--tracking-wide);
   background-color:var(--surface-2);
   color:var(--ink);
   border:1px solid var(--line);
   border-radius:var(--radius-xs);
   min-height:28px;
}

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


.site-footer {
   background-color:var(--surface);
   border-top:1px solid var(--line);
   padding:clamp(1.75rem, 1.25rem + 1.25vw, 2.5rem) 0 clamp(1.25rem, 1rem + 1vw, 2rem) 0;
   margin-top:auto;
   position:relative;
   z-index:10;
}

@media (max-width: 767px) {
   .site-footer { padding-bottom:calc(var(--dock-h) + 1.5rem + env(safe-area-inset-bottom, 0px)); }
}

.footer-top {
   display:grid;
   grid-template-columns:2fr 1fr 1fr;
   gap:var(--space-lg);
   margin-bottom:var(--space-md);
}

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

.footer-brand .brand {
   display:inline-block;
   margin-bottom:var(--space-xs);
   text-decoration:none;
   min-height:40px;
}

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

.footer-bio {
   font-size:var(--font-size-sm);
   color:var(--ink-soft);
   max-width:44ch;
   line-height:var(--leading-snug);
   margin-bottom:0;
}

.footer-col h6,
.footer-col .h6 {
   font-family:var(--kume-1f2);
   font-size:var(--font-size-xs);
   text-transform:uppercase;
   letter-spacing:var(--tracking-wider);
   color:var(--ink-soft);
   margin-bottom:var(--space-2xs);
}

.footer-nav-list {
   list-style:none;
   padding:0;
   margin:0;
   display:flex;
   flex-direction:column;
   gap:2px;
}

.footer-nav-link {
   font-size:var(--font-size-sm);
   color:var(--ink);
   text-decoration:none;
   min-height:32px;
   display:flex;
   align-items:center;
   transition:color var(--dur-fast) var(--ease-standard);
}

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

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

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

.footer-facts-block {
   padding:var(--space-sm) 0;
   border-top:1px solid var(--line);
   border-bottom:1px solid var(--line);
   margin-bottom:var(--space-md);
   font-size:var(--font-size-xs);
   color:var(--ink-soft);
   display:grid;
   grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));
   gap:var(--space-sm);
}

.footer-fact-item {
   display:flex;
   flex-direction:column;
   gap:2px;
}

.footer-fact-label {
   font-family:var(--kume-1f2);
   text-transform:uppercase;
   letter-spacing:var(--tracking-wide);
   font-size:0.7rem;
   color:var(--ink-soft);
}

.footer-fact-val {
   color:var(--ink);
   font-weight:500;
}

.footer-legal-row {
   display:flex;
   flex-wrap:wrap;
   align-items:center;
   justify-content:space-between;
   gap:var(--space-sm);
   font-size:var(--font-size-xs);
   color:var(--ink-soft);
}

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

.footer-legal-links a,
.footer-consent-trigger {
   color:var(--ink-soft);
   text-decoration:underline;
   text-underline-offset:3px;
   min-height:44px;
   display:inline-flex;
   align-items:center;
   transition:color var(--dur-fast) var(--ease-standard);
}

.footer-consent-trigger {
   appearance:none;
   background:none;
   border:0;
   font:inherit;
   cursor:pointer;
   padding:0;
}

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

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

.footer-legal-links a:focus-visible,
.footer-consent-trigger:focus-visible {
   outline:2px solid var(--focus-ring);
   outline-offset:2px;
}


.consent-banner {
   position:fixed;
   bottom:0;
   left:0;
   right:0;
   top:auto;
   width:100%;
   max-width:100%;
   margin:0;
   background-color:var(--ground);
   border-top:1px solid var(--ink);
   border-left:0;
   border-right:0;
   border-bottom:0;
   border-radius:0;
   padding:0.75rem var(--space-md);
   box-shadow:0 -4px 16px rgba(43, 40, 39, 0.12);
   z-index:1200;
   display:flex;
   flex-direction:row;
   align-items:center;
   justify-content:space-between;
   gap:var(--space-md);
   transition:transform var(--dur-base) var(--ease-standard),
                     opacity var(--dur-base) var(--ease-standard),
                     visibility var(--dur-base) var(--ease-standard);
}

.consent-banner.is-hidden {
   opacity:0;
   visibility:hidden;
   transform:translateY(16px);
   pointer-events:none;
}

@media (min-width: 768px) {
   div.consent-banner {
      left:auto;
      right:var(--space-md);
      bottom:var(--space-md);
      top:auto;
      width:min(340px, calc(100vw - 2rem));
      border:1px solid var(--line);
      border-radius:var(--radius-xs);
      box-shadow:var(--shadow-elevated);
      padding:1rem;
      flex-direction:column;
      align-items:stretch;
      gap:0.75rem;
   }
   div.consent-banner .consent-actions {
      justify-content:stretch;
      display:flex;
      flex-direction:column;
      gap:0.5rem;
   }
   div.consent-banner .btn-consent { width:100%; }
}

@media (max-width: 767px) {
   .consent-banner {
      inset:auto 0 calc(var(--dock-h) + env(safe-area-inset-bottom, 0px)) 0;
      max-width:100%;
      border-radius:0;
      border-left:0;
      border-right:0;
      border-bottom:0;
      padding:0.75rem 1rem;
      flex-direction:column;
      align-items:stretch;
      gap:0.5rem;
   }
   .consent-banner .consent-actions {
      display:flex;
      flex-direction:row;
      width:100%;
      gap:0.5rem;
   }
   .consent-banner .btn-consent {
      flex:1 1 50%;
      white-space:nowrap;
      text-align:center;
      padding:0.5rem 0.25rem;
      font-size:11px;
   }
}

.consent-text {
   font-size:var(--font-size-xs);
   line-height:var(--leading-snug);
   color:var(--ink);
   margin:0;
}

.consent-text a {
   color:var(--ink);
   font-weight:600;
}

.consent-actions {
   display:flex;
   align-items:center;
   justify-content:flex-end;
   gap:var(--space-xs);
}

.btn-consent {
   min-height:40px;
   padding:0.375rem 0.875rem;
   font-size:var(--font-size-xs);
   font-weight:600;
   border-radius:var(--radius-xs);
   cursor:pointer;
   transition:background-color var(--dur-fast) var(--ease-standard),
                     color var(--dur-fast) var(--ease-standard),
                     border-color var(--dur-fast) var(--ease-standard);
}

.btn-consent-accept {
   background-color:var(--ink);
   color:var(--ground);
   border:1px solid var(--ink);
}

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

.btn-consent-accept:active { background-color:#000; }

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

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

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

.btn-consent-decline:active { background-color:var(--surface-active); }

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


.chat-launcher {
   position:fixed;
   bottom:calc(var(--space-lg) + 54px);
   right:var(--space-lg);
   width:54px;
   height:54px;
   border-radius:50%;
   background-color:var(--ink);
   color:var(--ground);
   border:1px solid var(--line);
   box-shadow:var(--shadow-elevated);
   display:flex;
   align-items:center;
   justify-content:center;
   cursor:pointer;
   z-index:1040;
   transition:transform var(--dur-fast) var(--ease-standard),
                     background-color var(--dur-fast) var(--ease-standard),
                     box-shadow var(--dur-fast) var(--ease-standard);
}

.chat-launcher .icon {
   width:24px;
   height:24px;
   fill:currentColor;
}

.chat-launcher:hover {
   background-color:var(--accent);
   color:var(--accent-ink);
   box-shadow:0 4px 14px rgba(169, 96, 95, 0.35);
   transform:translateY(-2px);
}

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

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

@media (max-width: 1023px) {
   .chat-launcher {
      bottom:calc(var(--dock-h) + 175px + env(safe-area-inset-bottom, 0px));
      right:var(--space-md);
      width:48px;
      height:48px;
   }
}

.chat-unread-badge {
   position:absolute;
   top:-2px;
   right:-2px;
   background-color:var(--accent);
   color:var(--accent-ink);
   font-family:var(--kume-1f2);
   font-size:10px;
   font-weight:600;
   width:18px;
   height:18px;
   border-radius:50%;
   display:flex;
   align-items:center;
   justify-content:center;
   border:2px solid var(--ground);
}

.chat-panel {
   position:fixed;
   bottom:calc(var(--space-lg) + 64px);
   right:var(--space-lg);
   width:min(380px, calc(100vw - 2rem));
   height:520px;
   max-height:80vh;
   background-color:var(--ground);
   border:1px solid var(--line);
   border-radius:var(--radius-sm);
   box-shadow:var(--shadow-elevated);
   z-index:1045;
   display:flex;
   flex-direction:column;
   overflow:hidden;
   opacity:0;
   visibility:hidden;
   transform:translateY(12px) scale(0.98);
   transition:transform var(--dur-base) var(--ease-standard),
                     opacity var(--dur-base) var(--ease-standard),
                     visibility var(--dur-base) var(--ease-standard);
}

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

@media (max-width: 1023px) {
   .chat-panel {
      bottom:calc(var(--dock-h) + var(--space-md) + env(safe-area-inset-bottom, 0px));
      right:var(--space-sm);
      left:var(--space-sm);
      width:auto;
      height:calc(100vh - var(--dock-h) - 4rem);
   }
}

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

.chat-title {
   font-family:var(--kume-fe9);
   font-size:var(--font-size-md);
   font-weight:500;
   color:var(--ink);
   display:flex;
   align-items:center;
   gap:var(--space-xs);
}

.chat-title .online-indicator {
   width:8px;
   height:8px;
   border-radius:50%;
   background-color:#3b7a57;
}

.chat-close-btn {
   display:inline-flex;
   align-items:center;
   justify-content:center;
   width:36px;
   height:36px;
   min-height:36px;
   border-radius:var(--radius-xs);
   color:var(--ink-soft);
   background:transparent;
   border:0;
   cursor:pointer;
   transition:color var(--dur-fast) var(--ease-standard),
                     background-color var(--dur-fast) var(--ease-standard);
}

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

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

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

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

.chat-message {
   max-width:82%;
   padding:0.625rem 0.875rem;
   border-radius:var(--radius-xs);
   font-size:var(--font-size-sm);
   line-height:var(--leading-snug);
   word-break:break-word;
}

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

.chat-message-out {
   align-self:flex-end;
   background-color:var(--ink);
   color:var(--ground);
}

.chat-message-meta {
   font-family:var(--kume-1f2);
   font-size:0.7rem;
   margin-top:4px;
   opacity:0.75;
}

.chat-form-initial {
   padding:var(--space-sm);
   background-color:var(--surface);
   border:1px solid var(--line);
   border-radius:var(--radius-xs);
   margin-bottom:var(--space-xs);
}

.chat-input-bar {
   padding:0.75rem;
   background-color:var(--surface);
   border-top:1px solid var(--line);
   display:flex;
   gap:var(--space-xs);
}

.chat-input {
   flex:1 1 auto;
   min-height:40px;
   padding:0.5rem 0.75rem;
   font-size:var(--font-size-sm);
   border:1px solid var(--line);
   background-color:var(--surface-2);
   border-radius:var(--radius-xs);
   color:var(--ink);
}

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

.chat-send-btn {
   width:40px;
   height:40px;
   min-height:40px;
   display:inline-flex;
   align-items:center;
   justify-content:center;
   background-color:var(--accent);
   color:var(--accent-ink);
   border:1px solid var(--accent);
   border-radius:var(--radius-xs);
   cursor:pointer;
   transition:background-color var(--dur-fast) var(--ease-standard);
}

.chat-send-btn:hover { background-color:var(--accent-hover); }

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

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