/* Taversham's 2026 - Shared CSS Variables + Nav/Footer Styles */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;1,400;1,500&family=EB+Garamond:ital,wght@0,400;0,500;1,400&family=Jost:wght@300;400;500&display=swap');

:root {
  --tv-black: #111111;
  --tv-navy: #0d1f3c;
  --tv-blue: #1e4a8a;
  --tv-gold: #b8943a;
  --tv-gold-lt: #d4ac52;
  --tv-rule: #d8d4ce;
  --tv-offwhite: #f7f5f2;
  --tv-mid: #6b6460;
}

/* ── TOP BAR ── */
.tav-top-bar { background: var(--tv-navy); padding: 0.65rem 3rem; display: flex; align-items: center; justify-content: space-between; }
.tav-top-bar .top-bar-left { font-size: 0.72rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--tv-gold-lt); }
.tav-top-bar .top-bar-right { display: flex; gap: 2rem; align-items: center; }
.tav-top-bar .top-bar-right a { font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(255,255,255,0.55); text-decoration: none; transition: color 0.2s; }
.tav-top-bar .top-bar-right a:hover { color: var(--tv-gold-lt); }
.tav-top-bar .top-bar-phone { font-size: 0.72rem; letter-spacing: 0.08em; color: var(--tv-gold-lt); }

/* ── NAV — scoped to .tav-nav only ── */
.tav-nav { position: sticky; top: 0; z-index: 200; background: var(--tv-navy); border-bottom: 1px solid rgba(255,255,255,0.1); box-shadow: 0 2px 12px rgba(0,0,0,0.25); }
.tav-nav .nav-inner { display: flex; align-items: center; justify-content: space-between; padding: 0 2rem; height: 76px; }
.tav-nav .nav-logo { font-family: 'Playfair Display', serif; font-size: 1.6rem; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: white; text-decoration: none; transition: color 0.2s; }
.tav-nav .nav-logo:hover { color: var(--tv-gold-lt); }
.tav-nav .nav-logo span { color: var(--tv-gold); }
.tav-nav .nav-links { display: flex; list-style: none; height: 100%; margin: 0; padding: 0; }
.tav-nav .nav-links li { height: 100%; display: flex; align-items: center; position: relative; }
.tav-nav .nav-links > li > a { font-size: 0.75rem; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(255,255,255,0.85); text-decoration: none; padding: 0 1rem; height: 100%; display: flex; align-items: center; border-bottom: 2px solid transparent; transition: all 0.2s; white-space: nowrap; }
.tav-nav .nav-links > li > a:hover { color: var(--tv-gold-lt); border-bottom-color: var(--tv-gold-lt); }
.tav-nav .nav-links li:hover > .tav-dropdown { display: block; }
.tav-dropdown { display: none; position: absolute; top: 100%; left: 0; background: var(--tv-navy); border: 1px solid rgba(255,255,255,0.1); border-top: 2px solid var(--tv-gold); min-width: 240px; z-index: 300; box-shadow: 0 8px 24px rgba(0,0,0,0.3); }
.tav-dropdown a { display: block; padding: 0.75rem 1.4rem; font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(255,255,255,0.75); text-decoration: none; border-bottom: 1px solid rgba(255,255,255,0.08); transition: color 0.15s, background 0.15s; white-space: nowrap; }
.tav-dropdown a:last-child { border-bottom: none; }
.tav-dropdown a:hover { color: var(--tv-gold-lt); background: rgba(255,255,255,0.05); }
.tav-nav .nav-actions { display: flex; align-items: center; gap: 0.8rem; flex-shrink: 0; }
.btn-nav { font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase; padding: 0.65rem 1.3rem; text-decoration: none; transition: all 0.2s; white-space: nowrap; }
.btn-outline-nav { border: 1px solid rgba(255,255,255,0.4); color: white; }
.btn-outline-nav:hover { border-color: var(--tv-gold-lt); color: var(--tv-gold-lt); }
.btn-filled-nav { background: var(--tv-gold); color: var(--tv-navy); border: 1px solid var(--tv-gold); font-weight: 500; }
.btn-filled-nav:hover { background: var(--tv-gold-lt); border-color: var(--tv-gold-lt); }

/* ── FOOTER — scoped to .tav-footer only ── */
.tav-footer { background: var(--tv-navy); border-top: 3px solid var(--tv-gold); padding: 4rem 3rem 2rem; }
.tav-footer .footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1.5fr; gap: 2.5rem; margin-bottom: 2.5rem; padding-bottom: 2.5rem; border-bottom: 1px solid rgba(255,255,255,0.1); }
.tav-footer .footer-logo { font-family: 'Playfair Display', serif; font-size: 1.2rem; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: white; margin-bottom: 0.8rem; display: block; text-decoration: none; }
.tav-footer .footer-tag { font-family: 'EB Garamond', serif; font-size: 0.93rem; line-height: 1.7; color: rgba(255,255,255,0.7); max-width: 240px; }
.tav-footer .footer-col h4 { font-size: 0.5rem; letter-spacing: 0.28em; text-transform: uppercase; color: var(--tv-gold-lt); margin-bottom: 1rem; }
.tav-footer .footer-col ul { list-style: none; }
.tav-footer .footer-col li { margin-bottom: 0.5rem; }
.tav-footer .footer-col a { font-family: 'EB Garamond', serif; font-size: 0.93rem; color: rgba(255,255,255,0.8); text-decoration: none; transition: color 0.2s; }
.tav-footer .footer-col a:hover { color: white; }
.tav-footer .footer-contact p { font-family: 'EB Garamond', serif; font-size: 0.93rem; line-height: 1.8; color: rgba(255,255,255,0.4); }
.tav-footer .footer-contact strong { display: block; font-size: 0.48rem; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,255,255,0.45); font-weight: 400; margin-top: 0.8rem; margin-bottom: 0.2rem; }
.tav-footer .footer-app-badges { display: flex; gap: 0.8rem; align-items: center; margin-top: 1.2rem; flex-wrap: wrap; }
.tav-footer .app-badge-link { display: block; border: 2px solid white; border-radius: 8px; overflow: hidden; transition: border-color 0.2s, transform 0.2s; }
.tav-footer .app-badge-link:hover { border-color: var(--tv-gold-lt); transform: translateY(-1px); }
.tav-footer .app-badge { height: 40px; width: auto; display: block; }
.tav-footer .footer-bottom { display: flex; justify-content: space-between; align-items: center; }
.tav-footer .footer-copy { font-size: 0.48rem; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(255,255,255,0.2); }
.tav-footer .footer-social { display: flex; gap: 1.5rem; }
.tav-footer .footer-social a { font-size: 0.48rem; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(255,255,255,0.75); text-decoration: none; transition: color 0.2s; }
.tav-footer .footer-social a:hover { color: var(--tv-gold-lt); }