.topbar .brand{
      align-items:center;
      gap:14px;
    }

    .topbar .brand-copy{
      display:grid;
      gap:4px;
      min-width:0;
    }

    .topbar .brand .title{
      margin:0;
      font-size:clamp(24px, 2.15vw, 34px);
      line-height:1.02;
      font-weight:650;
      letter-spacing:.03em;
      color:#f1e8d9;
      text-shadow:0 1px 0 rgba(255,255,255,.04), 0 8px 24px rgba(0,0,0,.28);
    }

    .topbar .brand .subtitle{
      max-width:42rem;
      font-size:12px;
      line-height:1.45;
      letter-spacing:.12em;
      text-transform:uppercase;
      color:rgba(214,196,167,.88);
      text-shadow:0 1px 0 rgba(0,0,0,.18);
    }

    .topbar .brand .subtitle::before{
      content:'';
      display:block;
      width:76px;
      height:1px;
      margin:0 0 7px;
      background:linear-gradient(90deg, rgba(199,157,99,.9), rgba(199,157,99,.15));
    }

    html[data-theme="light"] .topbar .brand .title{
      color:#162031;
      text-shadow:none;
    }

    html[data-theme="light"] .topbar .brand .subtitle{
      color:rgba(22,32,49,.72);
      text-shadow:none;
    }

    html[data-theme="light"] .topbar .brand .subtitle::before{
      background:linear-gradient(90deg, rgba(47,80,122,.72), rgba(47,80,122,.12));
    }

    @media (max-width: 900px){
      .topbar .brand .title{
        font-size:clamp(21px, 5.8vw, 28px);
      }

      .topbar .brand .subtitle{
        max-width:26rem;
        font-size:10px;
        letter-spacing:.1em;
      }
    }