/*
 * Fonts local to the AttentionHome component.
 * Family names are prefixed with "Attention" to avoid collisions with
 * styles in the consuming Webflow/DevLink project.
 *
 * @font-face src must be absolute hosted URLs — never relative files.
 * Webflow CLI packs SSR assets as UTF-8, so relative font urls become
 * corrupted data URIs and staging falls back to system sans.
 */

@property --nav-offset {
  syntax: "<length>";
  inherits: true;
  initial-value: 80px;
}

:host {
  --nav-h: 80px;
  --nav-offset: 80px;
}

html {
  overflow-x: clip;
}

@media (max-width: 1023px) {
  :host {
    --nav-h: 72px;
    --nav-offset: 72px;
  }
}

@font-face {
  font-family: "AttentionRoobert";
  src:
    url("https://attention-home-preview.vercel.app/fonts/Roobert-Medium.woff2")
      format("woff2"),
    url("https://attention-home-preview.vercel.app/fonts/Roobert-Medium.woff") format("woff");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "AttentionOverusedGrotesk";
  src: url("https://attention-home-preview.vercel.app/fonts/OverusedGrotesk-Roman.woff2")
    format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "AttentionOverusedGrotesk";
  src: url("https://attention-home-preview.vercel.app/fonts/OverusedGrotesk-Medium.woff2")
    format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "AttentionDepartureMono";
  src: url("https://attention-home-preview.vercel.app/fonts/DepartureMono-Regular.woff2")
    format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

.ViLGPYor1UWnxXK0ECqH {
  background: #fafafa;
  margin-top: -1px;
  --ease-out-strong: cubic-bezier(0.23, 1, 0.32, 1);
  --duration-fast: 160ms;
  --duration-hover: 220ms;
}

.cc3dwlAlMWjoo7ScykKw {
  background: transparent;
  margin-top: -1px;
  --ease-out-strong: cubic-bezier(0.23, 1, 0.32, 1);
  --duration-fast: 160ms;
  --duration-hover: 220ms;
}

.ViLGPYor1UWnxXK0ECqH,
.cc3dwlAlMWjoo7ScykKw,
.ViLGPYor1UWnxXK0ECqH *,
.cc3dwlAlMWjoo7ScykKw * {
  box-sizing: border-box;
}

.mHzkmJrM7lWlmHhYNzlm {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 16px;
}

@media (max-width: 1023px) {
  .mHzkmJrM7lWlmHhYNzlm {
    padding: 0;
  }
}

.hQjoRGXhb_RR1T5EupiZ {
    position: relative;
    z-index: 50;
    min-height: 80px;
    /* background: linear-gradient(180deg, #fafafa 0%, rgba(250, 250, 250, 0) 100%); */
}

.bYcPOrS51lRFQtS0FieV {
    position: relative;
    z-index: 50;
    /* background: linear-gradient(180deg, #fafafa 0%, rgba(250, 250, 250, 0) 100%); */
}

.VVnCZ8hv1hLnJhTx4bVt {
    position: fixed;
    top: var(--announce-h, 0px);
    left: 0;
    right: 0;
}

.VVnCZ8hv1hLnJhTx4bVt.EZONfgBX576swausdDeA {
    transition: transform 220ms cubic-bezier(0.23, 1, 0.32, 1);
}

.QrksyotUII7XFA7YSuSQ {
    transform: translateY(calc(-100% - var(--announce-h, 0px) - 2px));
    pointer-events: none;
}

.sIpCefDyeTM47rldM1MG,
.sIpCefDyeTM47rldM1MG.VVnCZ8hv1hLnJhTx4bVt.EZONfgBX576swausdDeA {
    transition: none;
}

@media (prefers-reduced-motion: reduce) {
    .VVnCZ8hv1hLnJhTx4bVt.EZONfgBX576swausdDeA {
        transition: none;
    }
}

.FW74J9A5qI0dYsBFT4kB {
    position: relative;
    z-index: 40;
}

.qugrfABZcf_CGtqJOAfQ {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 80px;
    padding: 0 24px;
    background: #fafafa;
    border: 1px solid #ededed;
    border-radius: 0 0 8px 8px;
}

.UZrkkcvdo11jMaFQjCo2 {
    display: flex;
    flex: 1 1 0;
    align-items: center;
    gap: 10px;
    min-width: 0;
    text-decoration: none;
}

.wk8lPO43oTsZp4MbYpoa {
    display: block;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}

.mDJpE6wDoAKWC8YbJrxe {
    display: block;
    width: 71px;
    height: 13px;
    flex-shrink: 0;
}

.YLhDuIQhqen8voSgxIMm {
    display: flex;
    align-items: center;
    height: 100%;
}

.cuibB0eUzjgjaslknaxj {
    display: flex;
    align-items: center;
    gap: 4px;
    height: 100%;
    padding: 0 16px;
    border: none;
    background: transparent;
    cursor: pointer;
    font-family: "AttentionOverusedGrotesk", sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 1;
    color: #14131a;
    text-decoration: none;
    white-space: nowrap;
}

.iAXXWUc3sja2Y94lTDBx {
    color: #9e9ea0;
}

.cuibB0eUzjgjaslknaxj:focus-visible {
    outline: 2px solid #4545e5;
    outline-offset: -8px;
    border-radius: 8px;
}

.MvLDdtAF25cyRd8Lp5mb {
    display: block;
    width: 12px;
    height: 12px;
    transform: translateY(0);
    transition: transform 180ms cubic-bezier(0.23, 1, 0.32, 1);
}

.APRpMzrk8lnAVPt05uKr {
    transform: translateY(2px);
}

.AcgJB3nTLsEqHLckdO4r {
    display: flex;
    flex: 1 1 0;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
    min-width: 0;
}

.yfAjoTQ2O3ZejyampHFo {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 32px;
    padding: 0 12px;
    border-radius: 10px;
    font-family: "AttentionOverusedGrotesk", sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.4;
    color: #424147;
    text-decoration: none;
    white-space: nowrap;
}

.yfAjoTQ2O3ZejyampHFo:hover {
    color: #14131a;
}

.rfDyNhCLg_7mHfJK7UHi {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 32px;
    padding: 0 12px;
    background: rgba(20, 19, 26, 0.08);
    border-radius: 8px;
    font-family: "AttentionOverusedGrotesk", sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 1.4;
    color: #14131a;
    text-decoration: none;
    white-space: nowrap;
    transition: background-color 220ms cubic-bezier(0.23, 1, 0.32, 1);
}

.rfDyNhCLg_7mHfJK7UHi:hover {
    background: rgba(20, 19, 26, 0.12);
}

.S3y32Eh7oSXHtiYGFiMG {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 32px;
    padding: 0 12px;
    background: #4545e5;
    border-radius: 8px;
    font-family: "AttentionOverusedGrotesk", sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 1;
    color: #fafafa;
    text-decoration: none;
    white-space: nowrap;
    transition: background-color 220ms cubic-bezier(0.23, 1, 0.32, 1);
}

.S3y32Eh7oSXHtiYGFiMG:hover {
    background: #5252eb;
}

.az0YfsI4SIVtibl3_uSr {
    position: absolute;
    top: 79px;
    left: 0;
    right: 0;
    display: flex;
    justify-content: center;
    z-index: 41;
    pointer-events: none;
}

.R0FsmD3lbqR9JUbilAuq {
    position: relative;
    overflow: hidden;
    background: #fafafa;
    border: 1px solid #ededed;
    border-radius: 8px;
    pointer-events: auto;
}

.Iz4wOAw7pu65qGY3imM_ {
    position: absolute;
    inset: 0;
    width: 100%;
}

.tU0DcfZ2eTVKd3MHLUkA {
    display: flex;
    align-items: stretch;
    height: 100%;
}

.rkEIplLQv7FedHMdEOHh {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 24px;
    background: #ffffff;
    border-right: 1px solid #ededed;
}

.URFjmfy5xJihq7qs9g3H {
    width: 696px;
    flex-shrink: 0;
}

.UxUYWZfraUEaWnf5O6ve {
    width: 312px;
    flex-shrink: 0;
    background: #fafafa;
    border-right: none;
}

.UxUYWZfraUEaWnf5O6ve+.UxUYWZfraUEaWnf5O6ve {
    border-left: 1px solid #ededed;
}

.qx9Pm4Sxk_8UirY3rXtn {
    margin: 0;
    font-family: "AttentionDepartureMono", monospace;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    letter-spacing: 0.12px;
    text-transform: uppercase;
    color: #14131a;
}

.He38BTbUDnjhDIfeJ62V {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    width: 648px;
}

.M5oFLmbjAZU3s57qXbuW {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
}

.x1kBGYAIGlFIOi0N44bA,
.Iq6n2Z9fY6ybkSILDvBX {
    position: relative;
    isolation: isolate;
    text-decoration: none;
    color: inherit;
}

.x1kBGYAIGlFIOi0N44bA {
    display: flex;
    align-items: center;
    gap: 16px;
    width: 312px;
}

.Iq6n2Z9fY6ybkSILDvBX {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
}

.KCWz_Sk7ABSrGnQyR_ph {
    position: absolute;
    inset: -8px -10px;
    border-radius: 8px;
    background: rgba(69, 69, 229, 0.08);
    pointer-events: none;
    z-index: 0;
}

.Iq6n2Z9fY6ybkSILDvBX .KCWz_Sk7ABSrGnQyR_ph {
    inset: -6px -8px;
    background: rgba(69, 69, 229, 0.1);
}

.x1kBGYAIGlFIOi0N44bA>*:not(.KCWz_Sk7ABSrGnQyR_ph),
.Iq6n2Z9fY6ybkSILDvBX>*:not(.KCWz_Sk7ABSrGnQyR_ph) {
    position: relative;
    z-index: 1;
}

.vyzHi3aBsM9Xjk2ZuNIF,
.Af1nLubvttIVRiXkO_1U {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: #ffffff;
    border: 1px solid #ededed;
    border-radius: 8px;
    transition:
        background-color 180ms cubic-bezier(0.23, 1, 0.32, 1),
        border-color 180ms cubic-bezier(0.23, 1, 0.32, 1);
}

.vyzHi3aBsM9Xjk2ZuNIF {
    width: 48px;
    height: 48px;
}

.Af1nLubvttIVRiXkO_1U {
    width: 32px;
    height: 32px;
    background: #fafafa;
}

.wAVfHo32YSLs20_6lAf8 {
    display: block;
    width: 16px;
    height: 16px;
    object-fit: contain;
}

.nRKebVrYtAl6jIyFKOER {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
    flex: 1 1 0;
}

.h3CcwkrNrnFdCxCmD1By {
    margin: 0;
    font-family: "AttentionOverusedGrotesk", sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 1.4;
    color: #14131a;
    transition: color 180ms cubic-bezier(0.23, 1, 0.32, 1);
}

.Isf_QKBHdCpl7pgg4vfY {
    margin: 0;
    font-family: "AttentionOverusedGrotesk", sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.4;
    color: #9e9ea0;
    transition: color 180ms cubic-bezier(0.23, 1, 0.32, 1);
}

.AG4bcYShda4BTWmg2Ogj {
    margin: 0;
    flex: 1 1 0;
    font-family: "AttentionOverusedGrotesk", sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.4;
    color: #14131a;
    transition: color 180ms cubic-bezier(0.23, 1, 0.32, 1);
}

.U9mY9aBF5Msc3Q3Ya8FE {
    font-weight: 500;
}

.x1kBGYAIGlFIOi0N44bA:focus-visible,
.Iq6n2Z9fY6ybkSILDvBX:focus-visible {
    outline: 2px solid #4545e5;
    outline-offset: 4px;
    border-radius: 8px;
}

.x1kBGYAIGlFIOi0N44bA:focus-visible .h3CcwkrNrnFdCxCmD1By,
.x1kBGYAIGlFIOi0N44bA[data-active] .h3CcwkrNrnFdCxCmD1By,
.Iq6n2Z9fY6ybkSILDvBX:hover .AG4bcYShda4BTWmg2Ogj,
.Iq6n2Z9fY6ybkSILDvBX:focus-visible .AG4bcYShda4BTWmg2Ogj,
.Iq6n2Z9fY6ybkSILDvBX[data-active] .AG4bcYShda4BTWmg2Ogj {
    color: #4545e5;
}

.x1kBGYAIGlFIOi0N44bA:hover .Isf_QKBHdCpl7pgg4vfY,
.x1kBGYAIGlFIOi0N44bA:focus-visible .Isf_QKBHdCpl7pgg4vfY,
.x1kBGYAIGlFIOi0N44bA[data-active] .Isf_QKBHdCpl7pgg4vfY {
    color: #706f74;
}

.x1kBGYAIGlFIOi0N44bA:hover .vyzHi3aBsM9Xjk2ZuNIF,
.x1kBGYAIGlFIOi0N44bA:focus-visible .vyzHi3aBsM9Xjk2ZuNIF,
.x1kBGYAIGlFIOi0N44bA[data-active] .vyzHi3aBsM9Xjk2ZuNIF,
.Iq6n2Z9fY6ybkSILDvBX:hover .Af1nLubvttIVRiXkO_1U,
.Iq6n2Z9fY6ybkSILDvBX:focus-visible .Af1nLubvttIVRiXkO_1U,
.Iq6n2Z9fY6ybkSILDvBX[data-active] .Af1nLubvttIVRiXkO_1U {
    background: #ffffff;
    border-color: #d9d8f4;
}

@media (prefers-reduced-motion: reduce) {

    .MvLDdtAF25cyRd8Lp5mb,
    .rfDyNhCLg_7mHfJK7UHi,
    .S3y32Eh7oSXHtiYGFiMG,
    .h3CcwkrNrnFdCxCmD1By,
    .Isf_QKBHdCpl7pgg4vfY,
    .AG4bcYShda4BTWmg2Ogj,
    .vyzHi3aBsM9Xjk2ZuNIF,
    .Af1nLubvttIVRiXkO_1U {
        transition: none;
    }

    .APRpMzrk8lnAVPt05uKr {
        transform: translateY(2px);
    }
}

.ZeObz9nKYcs4MzWW5vaL {
    display: none;
}

.yepeOKbHl1gCNry624zv {
    position: relative;
    display: block;
    width: 20px;
    height: 20px;
    pointer-events: none;
}

.DBICbltjhJwlfjDIyd1E {
    position: absolute;
    left: 2px;
    width: 16px;
    height: 1.5px;
    background: #14131a;
    border-radius: 1px;
    transform-origin: center;
}

.DBICbltjhJwlfjDIyd1E:nth-child(1) {
    top: 4.25px;
}

.DBICbltjhJwlfjDIyd1E:nth-child(2) {
    top: 9.25px;
}

.DBICbltjhJwlfjDIyd1E:nth-child(3) {
    top: 14.25px;
}

.XKarjEsUP9jQ4EJNZTxh {
    display: none;
}

@media (max-width: 1023px) {
    .hQjoRGXhb_RR1T5EupiZ {
        min-height: 72px;
    }

    .qugrfABZcf_CGtqJOAfQ {
        position: relative;
        z-index: 2;
        height: 72px;
        padding: 0 24px;
        border-radius: 0;
        border: none;
    }

    .qugrfABZcf_CGtqJOAfQ::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        height: 1px;
        background: #ededed;
        pointer-events: none;
    }

    .JTSPAuucCo9_NkwEsOXI {
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }

    .UZrkkcvdo11jMaFQjCo2 {
        flex: 0 0 auto;
    }

    .YLhDuIQhqen8voSgxIMm,
    .AcgJB3nTLsEqHLckdO4r,
    .az0YfsI4SIVtibl3_uSr {
        display: none;
    }

    .ZeObz9nKYcs4MzWW5vaL {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        width: 32px;
        height: 32px;
        padding: 0;
        border: none;
        background: transparent;
        cursor: pointer;
        appearance: none;
    }

    .ZeObz9nKYcs4MzWW5vaL:focus-visible {
        outline: 2px solid #4545e5;
        outline-offset: 2px;
        border-radius: 8px;
    }

    .XKarjEsUP9jQ4EJNZTxh {
        display: flex;
        flex-direction: column;
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 1;
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior: contain;
        background: #fafafa;
        -webkit-overflow-scrolling: touch;
    }

    .Ytwn3iEAKQhdevuDQGJW {
        display: flex;
        flex-direction: column;
        flex: 1 0 auto;
        min-height: 100%;
        width: 100%;
    }

    .i37XdxXXGjrWnx1Wpnzj {
        display: flex;
        flex: 1 1 auto;
        flex-direction: column;
        min-height: 0;
    }

    .JnRBIlGLsEAle_wzEQsl {
        display: flex;
        flex: none;
        align-items: center;
        justify-content: space-between;
        gap: 4px;
        width: 100%;
        height: 72px;
        min-height: 72px;
        padding: 0 24px;
        border: none;
        box-shadow: inset 0 -1px 0 #ededed;
        background: transparent;
        cursor: pointer;
        font-family: "AttentionOverusedGrotesk", sans-serif;
        font-weight: 400;
        font-size: 16px;
        line-height: 1.4;
        color: #14131a;
        text-align: left;
        text-decoration: none;
        appearance: none;
    }

    .EPMDQvdRFL5FrAcFwyUc {
        display: block;
        width: 16px;
        height: 16px;
        transform: rotate(-90deg);
        flex-shrink: 0;
    }

    .mtI8CUNTXpKZ22e6zGm7 {
        display: flex;
        flex-direction: column;
        gap: 8px;
        flex-shrink: 0;
        margin-top: auto;
        height: 176px;
        padding: 20px;
        box-sizing: border-box;
    }

    .ZnrcJFVKEjwAhm2JV2Rw,
    .PUSV5cy_7dTXctHQ1NUI,
    .JHtjE6t3Sy2HRYfhApPD {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 40px;
        padding: 0 12px;
        text-decoration: none;
        white-space: nowrap;
        font-family: "AttentionOverusedGrotesk", sans-serif;
        font-size: 14px;
        box-sizing: border-box;
    }

    .ZnrcJFVKEjwAhm2JV2Rw {
        border-radius: 10px;
        font-weight: 400;
        line-height: 1.4;
        color: #424147;
    }

    .PUSV5cy_7dTXctHQ1NUI {
        background: rgba(20, 19, 26, 0.08);
        border-radius: 8px;
        font-weight: 500;
        line-height: 1.4;
        color: #14131a;
    }

    .JHtjE6t3Sy2HRYfhApPD {
        background: #4545e5;
        border-radius: 8px;
        font-weight: 500;
        line-height: 1;
        color: #fafafa;
    }

    .v5BiRkC_0ysjDaRwbjp8 {
        display: flex;
        align-items: center;
        gap: 10px;
        flex-shrink: 0;
        width: 100%;
        height: 72px;
        padding: 0 24px;
        border: none;
        box-shadow: inset 0 -1px 0 #ededed;
        background: #f5f5f5;
        cursor: pointer;
        font-family: "AttentionOverusedGrotesk", sans-serif;
        font-weight: 400;
        font-size: 16px;
        line-height: 1.4;
        color: #14131a;
        text-align: left;
        appearance: none;
    }

    .D2e6YeU9ESUVoKkUF1p3 {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        width: 32px;
        height: 32px;
    }

    .M4H9GLzrj6hwdAml8xO4 {
        display: block;
        width: 20px;
        height: 20px;
        transform: rotate(90deg);
    }

    .GhuSmb2yCpRdE37EKe2s {
        display: flex;
        flex-direction: column;
        flex-shrink: 0;
        gap: 20px;
        padding: 20px;
        background: #ffffff;
        box-shadow: inset 0 -1px 0 #ededed;
    }

    .I1RmSdC7q4xesL1UscQ8 {
        display: flex;
        flex-direction: column;
        flex-shrink: 0;
        gap: 20px;
        padding: 20px;
    }

    .v3unRywtkyJikdpbc5Lw {
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        gap: 10px;
        width: 100%;
    }

    .ydV3UIJ0laObq9aUFCIP {
        display: flex;
        align-items: center;
        gap: 16px;
        width: 312px;
        max-width: 100%;
        min-height: 48px;
        text-decoration: none;
        color: inherit;
    }

    .kEQeMThMXkSV1jeATQH8 {
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        gap: 10px;
        width: 100%;
    }

    .efK1A46h9ZEVkyHvQskB {
        display: flex;
        align-items: center;
        gap: 12px;
        width: 100%;
        min-height: 32px;
        text-decoration: none;
        color: inherit;
    }

    .ydV3UIJ0laObq9aUFCIP:focus-visible,
    .efK1A46h9ZEVkyHvQskB:focus-visible,
    .JnRBIlGLsEAle_wzEQsl:focus-visible,
    .v5BiRkC_0ysjDaRwbjp8:focus-visible,
    .ZnrcJFVKEjwAhm2JV2Rw:focus-visible,
    .PUSV5cy_7dTXctHQ1NUI:focus-visible,
    .JHtjE6t3Sy2HRYfhApPD:focus-visible {
        outline: 2px solid #4545e5;
        outline-offset: 2px;
        border-radius: 8px;
    }
}