/* Site footer shared by all Iron Canyon pages: brand and contact, three link groups, quiet legal row.
   Loaded after each page's stylesheet. Colours match the existing dark footer. */
.site-footer {
    display: grid;
    grid-template-columns: minmax(0, 1100px);
    justify-content: center;
    background: #1F1F1F;
    color: #fff;
    padding: 3.5rem 1.5rem 1.25rem;
    text-align: left;
}
.site-footer a { color: rgba(255, 255, 255, 0.72); text-decoration: none; }
.site-footer a:hover { color: #fff; }
.site-footer a:focus-visible,
.site-footer button:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }

.sf-inner { grid-row: 1; display: grid; grid-template-columns: minmax(200px, 0.9fr) minmax(0, 2.8fr); gap: 2.5rem; }
.sf-brand { font-size: 1.35rem; font-weight: 900; letter-spacing: 0; color: #fff; margin: 0 0 0.5rem; }
.site-footer .sf-brand a { color: #fff; }
.sf-tagline { color: rgba(255, 255, 255, 0.6); font-size: 0.9rem; line-height: 1.5; margin: 0 0 0.35rem; max-width: 30ch; }
.sf-contact { list-style: none; margin: 1rem 0 0; padding: 0; }
.sf-contact a { display: inline-flex; align-items: center; gap: 0.5rem; min-height: 44px; font-size: 0.95rem; color: rgba(255, 255, 255, 0.85); }
.site-footer .sf-contact a[href^="tel:"] { font-size: 1.05rem; font-weight: 600; color: #fff; }
.sf-contact svg { width: 18px; height: 18px; fill: currentColor; flex: none; }

.sf-nav { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; padding-top: 0.4rem; }
.sf-nav h3 { font-size: 0.8rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.08em; color: #fff; margin: 0 0 0.6rem; }
.sf-nav ul { list-style: none; margin: 0; padding: 0; }
.sf-nav a { display: inline-block; padding: 0.3rem 0; font-size: 0.9rem; line-height: 1.4; }

.sf-legal {
    grid-row: 2; grid-column: 1;
    display: flex; flex-wrap: wrap; align-items: center; gap: 0 1.5rem;
    margin-top: 2.5rem; padding: 1rem 12rem 0 0;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}
.sf-legal a { display: inline-flex; align-items: center; min-height: 44px; font-size: 0.85rem; color: rgba(255, 255, 255, 0.6); }

/* Homepage closing section: sits on the footer's dark background so the closing call to action
   and the footer read as one composition, separated by a thin divider. */
.contact-closing { background: #1F1F1F; color: #fff; padding: 4.5rem 1.5rem 3.5rem; text-align: center; }
.contact-closing h2 { color: #fff; margin-bottom: 0.75rem; }
.contact-closing p { color: rgba(255, 255, 255, 0.72); max-width: 560px; margin: 0 auto 1.75rem; }
.contact-closing p a { color: #fff; text-decoration: underline; text-underline-offset: 0.2em; }
.contact-actions { display: flex; flex-wrap: wrap; justify-content: center; align-items: stretch; gap: 12px; }
.contact-closing .btn-primary { width: auto; min-width: 260px; max-width: none; display: inline-flex; align-items: center; justify-content: center; min-height: 56px; padding-top: 0; padding-bottom: 0; }
/* Secondary action: the homepage hero's outlined secondary-button style on the dark background. */
.contact-call { display: inline-flex; align-items: center; justify-content: center; min-height: 56px; padding: 0 1.5rem; border: 1px solid #777b69; border-radius: 8px; color: #f5f1e7; font-weight: 700; font-size: 1rem; text-decoration: none; white-space: nowrap; }
.contact-call:hover { border-color: #f5f1e7; color: #fff; }
.contact-closing .btn-primary:focus-visible,
.contact-call:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
main:has(.contact-closing) + .site-footer { padding-top: 0; }
main:has(.contact-closing) + .site-footer .sf-inner { border-top: 1px solid rgba(255, 255, 255, 0.12); padding-top: 3rem; }

/* analytics.js appends its "Analytics preferences" button as the footer's last child.
   Place it at the end of the legal row and show it as a quiet text button. */
.site-footer > .analytics-settings {
    grid-row: 2; grid-column: 1; justify-self: end; align-self: end;
    min-height: 44px; margin: 0; padding: 0;
    background: none; border: 0; border-radius: 0;
    color: rgba(255, 255, 255, 0.6); font: inherit; font-size: 0.85rem;
    text-decoration: underline; text-underline-offset: 0.2em; cursor: pointer;
}
.site-footer > .analytics-settings:hover { color: #fff; }

@media (min-width: 768px) {
    .site-footer { padding: 4rem 3rem 1.25rem; }
}
@media (max-width: 960px) {
    .sf-inner { grid-template-columns: minmax(0, 1fr); gap: 2.25rem; }
}
@media (max-width: 640px) {
    .site-footer { padding: 3rem 1.5rem 1rem; }
    .contact-closing { padding: 3.5rem 1.5rem 2.75rem; }
    .contact-actions { flex-direction: column; }
    .contact-closing .btn-primary, .contact-call { width: 100%; min-width: 0; white-space: normal; text-align: center; }
    main:has(.contact-closing) + .site-footer .sf-inner { padding-top: 2.5rem; }
    .sf-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.75rem 1rem; padding-top: 0; }
    .sf-nav a { padding: 0.5rem 0; }
    .sf-legal { padding-right: 0; margin-top: 2rem; }
    .site-footer > .analytics-settings { grid-row: 3; justify-self: start; align-self: start; }
}