/* ============================================================
 * footer site chrome
 * Rendered from resources/views/components/site/footer.blade.php
 * ============================================================ */

.ft {
        background: #171311;
        color: #F7F1E8;
        border-top: 1px solid #2A2621;
      }
      .ft__inner {
        max-width: 78rem;
        margin-inline: auto;
        padding-inline: clamp(1rem, 4vw, 2rem);
        padding-block: clamp(1.75rem, 4vw, 3.5rem);
      }

      /* Columns. On phones we grid the two link columns side-by-side to halve
         the vertical footprint. Brand + Newsletter stack full-width. */
      .ft__cols {
        display: grid;
        grid-template-columns: 1fr 1fr;
        column-gap: 1.5rem;
        row-gap: 1.75rem;
        padding-bottom: 1.5rem;
        border-bottom: 1px solid rgba(247, 241, 232, 0.12);
      }
      .ft__brand, .ft__news { grid-column: span 2; }
      @media (min-width: 48rem) {
        .ft__cols {
          grid-template-columns: repeat(2, minmax(0, 1fr));
          gap: 2.5rem 3rem;
        }
        .ft__brand, .ft__news { grid-column: auto; }
      }
      @media (min-width: 68rem) {
        .ft__cols {
          grid-template-columns: minmax(0, 1.5fr) minmax(0, 0.9fr) minmax(0, 0.9fr) minmax(0, 1.3fr);
          gap: 3.5rem;
          align-items: start;
        }
      }

      /* Brand */
      .ft__brand { max-width: 30rem; }
      .ft__mark {
        font-size: 1.25rem;
        font-weight: 600;
        line-height: 1.1;
        margin: 0 0 0.7rem;
        color: #F7F1E8;
        letter-spacing: -0.005em;
      }
      @media (min-width: 48rem) { .ft__mark { font-size: 1.4rem; margin-bottom: 0.9rem; } }
      .ft__blurb {
        font-size: 0.9rem;
        line-height: 1.55;
        color: #E4DAC5;
        margin: 0 0 0.9rem;
        max-width: 26rem;
      }
      @media (min-width: 48rem) { .ft__blurb { font-size: 0.95rem; line-height: 1.6; margin-bottom: 1.15rem; } }
      .ft__contact {
        display: flex;
        flex-direction: column;
        gap: 0.35rem;
        font-size: 0.9rem;
        margin-bottom: 0.9rem;
      }
      @media (min-width: 48rem) { .ft__contact { gap: 0.45rem; font-size: 0.95rem; margin-bottom: 1.15rem; } }
      .ft__address { color: #C6BBA6; font-size: 0.85rem; }

      /* Socials */
      .ft__socials {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        gap: 0.55rem;
      }
      .ft__social {
        display: inline-grid;
        place-items: center;
        width: 2.35rem;
        height: 2.35rem;
        border-radius: 999px;
        background: rgba(247, 241, 232, 0.08);
        border: 1px solid rgba(247, 241, 232, 0.18);
        color: #F7F1E8;
        transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease;
      }
      .ft__social svg { width: 1.05rem; height: 1.05rem; display: block; }
      .ft__social:hover, .ft__social:focus-visible {
        background: #E8B96A;
        border-color: #E8B96A;
        color: #171311;
        outline: none;
      }

      /* Column headers */
      .ft__col-h {
        font-size: 0.92rem;
        font-weight: 600;
        color: #F7F1E8;
        margin: 0 0 0.7rem;
        letter-spacing: 0;
        text-transform: none;
      }
      @media (min-width: 48rem) {
        .ft__col-h { font-size: 1rem; margin-bottom: 1rem; }
      }

      /* Column list */
      .ft__col { min-width: 0; }
      .ft__list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: grid;
        gap: 0.45rem;
        font-size: 0.9rem;
      }
      @media (min-width: 48rem) {
        .ft__list { gap: 0.65rem; font-size: 0.95rem; }
      }

      /* Links — high-contrast, plain */
      .ft__link {
        color: #F7F1E8;
        text-decoration: none;
        transition: color 160ms ease;
      }
      .ft__link:hover,
      .ft__link:focus-visible {
        color: #E8B96A;
        text-decoration: underline;
        text-underline-offset: 3px;
        outline: none;
      }

      /* Newsletter */
      .ft__news { max-width: 28rem; }
      .ft__news-note {
        font-size: 0.95rem;
        line-height: 1.55;
        color: #E4DAC5;
        margin: 0 0 1rem;
      }
      .ft__form { display: grid; gap: 0.9rem; }
      .ft__form-row { display: flex; gap: 0.55rem; flex-wrap: wrap; }
      .ft__input {
        flex: 1 1 12rem;
        min-width: 0;
        background: rgba(247, 241, 232, 0.08);
        border: 1px solid rgba(247, 241, 232, 0.28);
        border-radius: 8px;
        padding: 0.78rem 1rem;
        color: #F7F1E8;
        font-size: 0.95rem;
        transition: border-color 160ms ease, background-color 160ms ease;
      }
      .ft__input::placeholder { color: rgba(247, 241, 232, 0.5); }
      .ft__input:focus {
        outline: none;
        border-color: #E8B96A;
        background: rgba(247, 241, 232, 0.12);
      }
      .ft__submit {
        appearance: none;
        border: 0;
        background: #E8B96A;
        color: #171311;
        font-size: 0.9rem;
        font-weight: 600;
        letter-spacing: 0.02em;
        padding: 0.78rem 1.35rem;
        border-radius: 8px;
        cursor: pointer;
        transition: background-color 160ms ease;
      }
      .ft__submit:hover, .ft__submit:focus-visible {
        background: #D4A85B;
        outline: none;
      }
      .ft__submit:focus-visible { box-shadow: 0 0 0 3px rgba(232, 185, 106, 0.35); }
      .ft__consent {
        display: flex;
        align-items: flex-start;
        gap: 0.55rem;
        font-size: 0.85rem;
        line-height: 1.5;
        color: #C6BBA6;
      }
      .ft__consent-box {
        appearance: none;
        width: 1rem;
        height: 1rem;
        border: 1px solid rgba(247, 241, 232, 0.4);
        border-radius: 3px;
        background: transparent;
        flex-shrink: 0;
        margin-top: 0.2rem;
        cursor: pointer;
        display: inline-grid;
        place-content: center;
      }
      .ft__consent-box:checked { background: #E8B96A; border-color: #E8B96A; }
      .ft__consent-box:checked::before {
        content: '';
        width: 0.35rem;
        height: 0.6rem;
        border-right: 2px solid #171311;
        border-bottom: 2px solid #171311;
        transform: rotate(45deg) translate(-1px, -1px);
      }
      .ft__consent-box:focus-visible { outline: 2px solid #E8B96A; outline-offset: 2px; }
      .ft__success { font-size: 0.9rem; color: #E8B96A; margin: 0; }

      /* Bottom bar */
      .ft__bottom {
        margin-top: 1.5rem;
        display: grid;
        grid-template-columns: 1fr;
        gap: 0.75rem;
        font-size: 0.88rem;
        color: #C6BBA6;
      }
      @media (min-width: 48rem) {
        .ft__bottom {
          grid-template-columns: 1fr auto;
          align-items: center;
          gap: 1.5rem;
        }
      }
      .ft__copy { margin: 0; }
      .ft__legal {
        display: flex;
        flex-wrap: wrap;
        gap: 1.5rem;
        margin: 0;
        padding: 0;
        list-style: none;
      }
      @media (min-width: 48rem) { .ft__legal { justify-self: end; } }

      @media (prefers-reduced-motion: reduce) {
        .ft__link, .ft__submit, .ft__input, .ft__social { transition: none !important; }
      }
