/* ============================================================
   SSP TOURS · template-footer.css v12.0 (Emerald Daylight, Concept A)
   Prefix: tt- | Markup: templates/template-footer.html
   Logic:  js/template-footer.js

   One compact emerald row: Brand & contact · Tour Categories ·
   Company · Visit Us, then Legal · Copyright · Site by PERLYN-IT.

   RULE: every value comes from a main.css variable.
   ============================================================ */

/* Scoped resets. Bootstrap's ul padding and main.css a/p/h4 defaults
   would otherwise leak into the footer. */
:where(.tt-footer) ul { list-style: none; margin: 0; padding: 0; }
:where(.tt-footer) h4 { margin: 0; text-wrap: initial; }
:where(.tt-footer) p { margin: 0; color: inherit; font-size: inherit; }
:where(.tt-footer) button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; border-radius: 0; }
:where(.tt-footer) :focus-visible { outline: 2px solid var(--color-gold); outline-offset: 2px; }
:where(.tt-footer) svg, :where(.tt-footer) img { display: inline-block; }
/* Footer shared */
.tt-footer-links a { display: inline-flex; align-items: center; gap: var(--spacing-2); }
.tt-footer-viewall { display: inline-flex; align-items: center; gap: var(--spacing-2); }
.tt-footer-contacts, .tt-footer-socials { display: flex; flex-wrap: wrap; gap: var(--spacing-2); }
.tt-footer-cchip { display: inline-flex; align-items: center; gap: var(--spacing-2); }
.tt-footer-social { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; }
.tt-footer-brand { display: flex; align-items: center; gap: var(--spacing-3); }
.tt-footer-brand > span:last-child { display: flex; flex-direction: column; }
.tt-footer-bottom-inner { display: flex; align-items: center; justify-content: space-between; gap: var(--spacing-4); flex-wrap: wrap; }
.tt-footer-legal { display: flex; gap: var(--spacing-2); align-items: center; }
.tt-footer-copyright { margin: 0; }
.tt-footer-credit { display: inline-flex; align-items: center; gap: var(--spacing-2); }
.tt-footer-credit-brand { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; }
/* Footer: compact emerald band, four columns */
.tt-footer { position: relative; background: var(--color-navy-abyss); color: var(--color-white-70); font-size: .86rem; }
.tt-footer::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(90deg, transparent 0%, var(--color-gold) 18%, var(--color-gold-light) 50%, var(--color-gold) 82%, transparent 100%); }
.tt-footer-main { max-width: var(--tt-max); margin: 0 auto; padding: var(--spacing-10) var(--spacing-6) var(--spacing-8); display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1.2fr); column-gap: var(--spacing-10); row-gap: var(--spacing-8); }
.tt-footer-col { display: flex; flex-direction: column; gap: var(--spacing-3); min-width: 0; }
.tt-footer-col-title { font-family: var(--font-primary); font-size: .66rem; letter-spacing: .24em; text-transform: uppercase; font-weight: 600; color: var(--color-gold-light); margin-bottom: 2px; }
.tt-footer-brand { gap: var(--spacing-3); }
.tt-footer-logo-wrap { width: 48px; height: 48px; border-radius: 50%; flex-shrink: 0; }
.tt-footer-logo { width: 100%; height: 100%; object-fit: contain; }
.tt-footer-brand-name { font-family: var(--font-display); font-size: 1.4rem; color: var(--text-white); line-height: 1; letter-spacing: .01em; }
.tt-footer-brand-tag { margin-top: 5px; font-family: var(--font-display); font-style: italic; font-size: .82rem; color: var(--color-gold-light); white-space: nowrap; }
.tt-footer-contacts { gap: 6px; margin-top: 2px; }
.tt-footer-cchip { padding: 5px 12px; border-radius: var(--radius-full); border: 1px solid var(--color-white-20); font-size: .76rem; color: var(--text-white); }
.tt-footer-cchip:hover { border-color: var(--color-gold); }
.tt-footer-cchip svg, .tt-footer-cchip i { color: var(--color-gold-light); }
.tt-footer-socials:not(:has(.tt-footer-social:not([hidden]))) { display: none; }
.tt-footer-social { width: 32px; height: 32px; background: var(--color-white-08); color: var(--text-white); }
.tt-footer-social:hover { background: var(--sheen-gold); color: var(--color-green-dark); }
.tt-footer-links { display: flex; flex-direction: column; gap: 6px; }
.tt-footer-links--cols { display: block; columns: 2; column-gap: var(--spacing-5); }
.tt-footer-links--cols li { break-inside: avoid; padding-bottom: 6px; }
.tt-footer-links a { color: var(--color-white-75); line-height: 1.35; }
.tt-footer-links a:hover { color: var(--color-gold-light); }
.tt-footer-map, .tt-footer-hours, .tt-footer-reg { display: flex; align-items: flex-start; gap: var(--spacing-2); line-height: 1.45; color: var(--color-white-75); }
.tt-footer-map:hover { color: var(--text-white); }
.tt-footer-map svg, .tt-footer-map i, .tt-footer-hours svg, .tt-footer-hours i, .tt-footer-reg svg, .tt-footer-reg i { color: var(--color-gold-light); margin-top: 3px; flex-shrink: 0; width: 13px; }
.tt-footer-hours b { color: var(--text-white); font-weight: 600; }
.tt-footer-bottom { border-top: 1px solid var(--color-white-10); font-size: .76rem; color: var(--color-white-60); }
.tt-footer-bottom-inner { max-width: var(--tt-max); margin: 0 auto; padding: var(--spacing-4) var(--spacing-6); padding-bottom: calc(var(--spacing-4) + env(safe-area-inset-bottom, 0px)); }
.tt-footer-legal a:hover { color: var(--text-white); }
.tt-footer-dot { color: var(--color-gold); }
/* PERLYN-IT credit: slow champagne light sweep, letters open on hover */
.tt-footer-credit { gap: 8px; }
.tt-footer-credit-label { color: var(--color-white-50); letter-spacing: .04em; }
.tt-footer-credit-brand { position: relative; font-weight: 700; letter-spacing: .16em; background: linear-gradient(100deg, var(--color-gold) 0%, var(--color-gold-light) 35%, var(--color-white) 48%, var(--color-gold-light) 60%, var(--color-gold) 100%); background-size: 300% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: tt-credit-shine 5s ease-in-out infinite; transition: letter-spacing .4s ease; }
.tt-footer-credit-brand::after { content: ''; position: absolute; left: 0; right: .16em; bottom: -4px; height: 1px; background: var(--sheen-gold); transform: scaleX(0); transform-origin: left; transition: transform .45s ease; }
.tt-footer-credit:hover .tt-footer-credit-brand { letter-spacing: .26em; }
.tt-footer-credit:hover .tt-footer-credit-brand::after { transform: scaleX(1); }
@media (max-width: 1100px) {
  .tt-footer-main { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
  .tt-footer-main { padding: var(--spacing-8) var(--spacing-4) var(--spacing-6); grid-template-columns: 1fr; row-gap: var(--spacing-6); }
  .tt-footer-bottom-inner { flex-direction: column; text-align: center; padding-inline: var(--spacing-4); padding-bottom: calc(88px + env(safe-area-inset-bottom, 0px)); }
}
/* Link colour guards: main.css styles every <a> emerald. */
.tt-footer-brand, .tt-footer-brand:hover { color: inherit; }
.tt-footer-cchip:hover { color: var(--text-white); }
.tt-footer-social:hover { color: var(--color-green-dark); }
.tt-footer-legal a { color: inherit; }
.tt-footer-credit, .tt-footer-credit:hover { color: inherit; }
.tt-footer-copyright { color: inherit; font-size: inherit; line-height: 1.5; }
.tt-footer-viewall:hover { color: var(--text-white); }
@media (prefers-reduced-motion: reduce) {
  .tt-footer-credit-brand { animation: none; }
}