/* =========================================================
   TORONTO BIKING — toronto-local.css
   Shared look for the Toronto Local pages (Cycling Events, Bike Shops,
   Bike Rentals, Partner With Us) and the new site header and footer.
   Values come straight from the Claude Design handoff (Oct 2026).
   Page-only styles stay inline in each page.
   ========================================================= */

html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;min-height:100vh;font-family:Archivo,sans-serif;color:#141414;background:url(/images/textures/brush-wall.jpg) center top/cover no-repeat fixed,#dcdbd6}
a{color:inherit;text-decoration:none}
a:hover{color:inherit}
[hidden]{display:none!important}
select option{text-transform:none;font:500 16px Roboto,sans-serif;color:#141414}
.tl-page{max-width:1280px;margin:0 auto}
.tl-paper{background:url(/images/textures/paper.svg),#fbfaf7;background-blend-mode:multiply}
.tl-grain{background:url(/images/textures/grain.svg),#222}
.tl-oswald{font:500 13px/1.25 Oswald,sans-serif;text-transform:uppercase;letter-spacing:.03em}
.tl-ul{box-shadow:inset 0 -2px 0 #f5a400}
.tl-ul:hover{color:#8a5b00}

/* header */
.tl-header{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3fr);background:url(/images/textures/grain.svg),#222;color:#f5f4f1;border-bottom:4px solid #f5a400;position:relative;z-index:1001;font-family:Archivo,sans-serif}
.tl-logo{display:flex;align-items:center;justify-content:center;padding:12px 16px;border-right:1px solid rgba(255,255,255,.14)}
.tl-logo img{height:46px;max-width:100%;object-fit:contain;display:block}
.tl-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));font:500 clamp(13px,1.8vw,23px)/1 Roboto,sans-serif;text-transform:uppercase;letter-spacing:.08em}
.tl-nav>a{display:flex;justify-content:center;align-items:center;padding:0 12px;border-right:1px solid rgba(255,255,255,.14)}
.tl-nav>a:hover{color:#f5a400}
.tl-dd{position:relative;display:flex}
.tl-dd-top{display:flex;flex:1;justify-content:center;background:#f5a400;color:#222}
.tl-dd-top>a{display:flex;flex:0 1 auto;align-items:center;padding:0 0 0 12px;white-space:nowrap}
.tl-dd-top>a:hover{color:#222;text-decoration:underline;text-underline-offset:4px}
.tl-caret{flex:none;min-width:44px;display:flex;align-items:center;justify-content:center;padding:0 12px 0 8px;background:none;border:0;color:inherit;font-size:20px;line-height:1;cursor:pointer}
.tl-menu{display:none;position:absolute;top:100%;right:0;width:max(100%,260px);background:#222;border-top:4px solid #f5a400;flex-direction:column;font-size:clamp(13px,1.3vw,16px);box-shadow:0 12px 28px rgba(0,0,0,.25)}
.tl-dd.is-open .tl-menu{display:flex}
.tl-menu>a{padding:17px 20px;border-bottom:1px solid rgba(255,255,255,.12)}
.tl-menu>a:last-child{border-bottom:0}
.tl-menu a:hover{background:#f5a400;color:#222}
.tl-soon{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 20px;border-bottom:1px solid rgba(255,255,255,.12);color:#9c9a95;cursor:default}
.tl-soon>span{font-size:.75em;letter-spacing:.1em;border:1px solid rgba(245,244,241,.3);padding:4px 6px;color:#c9c7c2}
.tl-sub{position:relative;display:flex;flex-direction:column;border-bottom:1px solid rgba(255,255,255,.12)}
.tl-sub-row{display:flex}
.tl-sub-row>a{flex:1;display:flex;align-items:center;padding:17px 0 17px 20px}
.tl-sub-row>button{flex:none;min-width:48px;padding:0 18px;background:transparent;color:inherit;border:0;font:inherit;font-size:1.25em;line-height:1;cursor:pointer}
.tl-sub.is-open .tl-sub-row>a,.tl-sub.is-open .tl-sub-row>button{background:#f5a400;color:#222}
.tl-fly{display:none;flex-direction:column}
.tl-sub.is-open .tl-fly{display:flex}
.tl-fly a[aria-current]{color:#f5a400}
.tl-fly a[aria-current]:hover{color:#222}
@media (min-width:900px){
  .tl-fly{position:absolute;top:-4px;right:100%;width:max(100%,260px);background:#222;border-top:4px solid #f5a400;box-shadow:-8px 8px 24px rgba(0,0,0,.25)}
  .tl-fly>*{padding:15px 20px;border-bottom:1px solid rgba(255,255,255,.12)}
}
@media (max-width:899.98px){
  .tl-fly{background:#1a1a1a;border-top:1px solid rgba(255,255,255,.12)}
  .tl-fly>*{padding:14px 20px 14px 32px;border-bottom:1px solid rgba(255,255,255,.08)}
}
/* phones: the design stops at ~900px, so give Ride Guide room for its label and menu button */
@media (max-width:560px){
  .tl-logo{padding:10px 10px}
  .tl-nav{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.6fr);letter-spacing:.04em}
  .tl-nav>a{padding:0 4px}
  .tl-dd-top{min-width:0}
  .tl-dd-top>a{min-width:0;padding-left:8px}
  .tl-caret{min-width:30px;padding:0 8px 0 4px}
  .tl-menu{width:min(260px,100vw)}
}
@media (max-width:380px){
  .tl-dd-top>a{white-space:normal;line-height:1.1}
}

/* hero */
.tl-hero{display:flex;flex-wrap:wrap;gap:16px;padding:32px 32px 24px}
.tl-hero-panel{flex:7 1 520px;min-width:0;padding:clamp(32px,5vw,64px) clamp(24px,6vw,96px) 40px clamp(24px,4vw,48px);display:flex;flex-direction:column;gap:32px}
.tl-crumbs{display:flex;flex-wrap:wrap;gap:8px;font:500 12px/1 Roboto,sans-serif;text-transform:uppercase;letter-spacing:.1em;color:#4a4a47}
.tl-crumbs a:hover{color:#a86f00}
.tl-crumbs [aria-current]{color:#141414}
.tl-hero h1{margin:0;font-weight:800;font-size:clamp(52px,7.4vw,96px);line-height:.88;font-stretch:66%;text-transform:uppercase;letter-spacing:-.01em;text-wrap:balance}
.tl-hl{box-shadow:inset 0 -.14em 0 #f5a400}
.tl-dot{color:#f5a400}
.tl-lede{margin:0;max-width:540px;font-size:18px;line-height:1.5;color:#3a3a38;text-wrap:pretty}
.tl-lede a{box-shadow:inset 0 -2px 0 #f5a400}
.tl-lede a:hover{color:#8a5b00}
.tl-gap{display:block;height:10px}
.tl-stats{display:flex;flex-wrap:wrap;gap:16px 56px;border-top:2px solid #141414;padding-top:16px}
.tl-stat{display:flex;flex-direction:column;gap:8px}
.tl-stat>span:first-child{color:#8a5b00}
.tl-stat>span:last-child{font:800 48px/.85 'Big Shoulders Display',sans-serif;text-transform:uppercase;white-space:nowrap;text-shadow:0 1px 0 rgba(255,255,255,.95),0 -1px 0 rgba(0,0,0,.28)}
.tl-hero-img{flex:5 1 360px;min-height:420px;margin-top:48px;position:relative;overflow:hidden;background:#dcdbd6}
.tl-hero-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.tl-ph{flex:5 1 360px;min-height:420px;margin-top:48px;display:flex;align-items:center;justify-content:center;background:repeating-linear-gradient(45deg,#e4e3df 0 10px,#dcdbd6 10px 20px);font:500 11px/1 Roboto,sans-serif;text-transform:uppercase;letter-spacing:.12em;color:#5f5e5a}

/* page body */
.tl-main{display:flex;flex-direction:column;gap:96px;padding:72px 32px 88px}
.tl-sec{display:flex;flex-direction:column;gap:20px;scroll-margin-top:24px}
.tl-sec-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 20px;border-bottom:2px solid #141414;padding-bottom:14px}
.tl-sec-t{display:flex;flex-direction:column;gap:12px;padding-bottom:4px}
.tl-sec-t::before{content:"";width:48px;height:5px;background:#f5a400}
.tl-sec-t h2{margin:0;font:800 clamp(36px,4.6vw,58px)/.9 Archivo,sans-serif;font-stretch:66%;text-transform:uppercase}
.tl-btn{flex:none;background:#141414;color:#f5f4f1;padding:14px 20px;font:500 11.5px/1 Roboto,sans-serif;text-transform:uppercase;letter-spacing:.08em}
.tl-btn:hover{background:#f5a400;color:#222}
.tl-btn--dark{background:#222}

/* browse by area */
.tl-browse{display:flex;flex-direction:column;gap:12px;scroll-margin-top:24px;margin-bottom:-48px}
.tl-browse-head{display:flex;flex-direction:column;gap:8px;border-bottom:2px solid #141414;padding-bottom:10px}
.tl-browse-head::before{content:"";width:28px;height:4px;background:#f5a400}
.tl-browse-head h2{margin:0;font:800 26px/.9 Archivo,sans-serif;font-stretch:66%;text-transform:uppercase}
.tl-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px}
.tl-tile{display:flex;flex-direction:column;justify-content:flex-end;gap:8px;padding:12px 14px;border-bottom:4px solid transparent}
.tl-tile:hover{border-bottom-color:#f5a400}
.tl-tile::before{content:"";width:18px;height:3px;background:#f5a400}
.tl-tile b{font:800 18px/1 Archivo,sans-serif;font-stretch:70%;text-transform:uppercase;text-wrap:balance}
.tl-tile small{font:500 12px/1 Roboto,sans-serif;text-transform:uppercase;letter-spacing:.08em;color:#6c6a66}

/* filters */
.tl-filter{display:flex;flex-direction:column;gap:14px;scroll-margin-top:24px}
.tl-chiprow{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.tl-chiprow>span{flex:none;color:#8a5b00}
.tl-chip{background:#fbfaf7;border:1px solid rgba(20,20,20,.35);color:#141414;padding:10px 14px;font:500 12px/1 Roboto,sans-serif;text-transform:uppercase;letter-spacing:.06em;cursor:pointer}
.tl-chip:hover{border-color:#141414}
.tl-chip[aria-pressed="true"]{background:#f5a400;border-color:#f5a400}
.tl-results{display:flex;flex-wrap:wrap;align-items:center;gap:10px 24px;padding-top:4px}
.tl-count{font:700 13px/1 Roboto,sans-serif;text-transform:uppercase;letter-spacing:.08em}
.tl-textbtn{background:none;border:0;padding:0 0 4px;font:500 13px/1 Roboto,sans-serif;text-transform:uppercase;letter-spacing:.08em;color:#141414;box-shadow:inset 0 -2px 0 #f5a400;cursor:pointer}
.tl-textbtn:hover{color:#8a5b00}
.tl-empty{background:#222;color:#f5f4f1;padding:28px 32px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px;border-bottom:6px solid #f5a400}
.tl-empty p{margin:0;max-width:620px;font-size:16px;line-height:1.55;color:#d6d5d1}
.tl-btn-amber{background:#f5a400;color:#222;border:0;padding:14px 20px;font:500 11.5px/1 Roboto,sans-serif;text-transform:uppercase;letter-spacing:.08em;cursor:pointer}
.tl-btn-amber:hover{background:#f5f4f1}

/* collapsible areas */
.tl-areas{display:flex;flex-direction:column;gap:32px;margin-top:-48px}
.tl-toggle-row{display:flex;justify-content:flex-end;margin-bottom:-12px}
.tl-toggle-all{display:inline-flex;align-items:center;gap:12px;background:#222;color:#f5f4f1;border:0;padding:12px 18px;cursor:pointer}
.tl-toggle-all:hover{background:#f5a400;color:#222}
.tl-toggle-all b{font:400 24px/.6 Archivo,sans-serif;font-stretch:66%}
.tl-area{display:flex;flex-direction:column;gap:16px;scroll-margin-top:24px}
.tl-area-h{margin:0 0 4px;font:inherit}
.tl-area-btn{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;width:100%;margin:0;padding:0 0 14px;background:none;border:0;border-bottom:2px solid #141414;color:#141414;font:inherit;text-align:left;cursor:pointer}
.tl-area-btn:hover{color:#8a5b00}
.tl-area-t{display:flex;flex-direction:column;gap:12px;padding-bottom:4px}
.tl-area-t::before{content:"";display:block;width:48px;height:5px;background:#f5a400}
.tl-area-title{display:block;font:800 clamp(36px,4.6vw,58px)/.9 Archivo,sans-serif;font-stretch:66%;text-transform:uppercase;text-wrap:balance}
.tl-area-places{display:block;font:500 16px/1.45 Roboto,sans-serif;color:#141414;text-wrap:pretty}
.tl-area-r{display:flex;align-items:flex-end;gap:16px 20px}
.tl-area-n{color:#8a5b00;padding-bottom:6px;text-align:right;white-space:nowrap}
.tl-sign{flex:none;width:40px;text-align:center;font:400 48px/.8 Archivo,sans-serif;font-stretch:66%}
.tl-wrap{display:grid;grid-template-rows:1fr;transition:grid-template-rows .55s cubic-bezier(.2,.7,.2,1)}
.is-collapsed>.tl-wrap{grid-template-rows:0fr;transition:grid-template-rows .45s cubic-bezier(.5,0,.3,1)}
.tl-inner{min-height:0;overflow:hidden}
.tl-body{display:flex;flex-direction:column;gap:16px;padding:8px 0 56px;transform-origin:top center;transition:transform .55s cubic-bezier(.2,.7,.2,1),opacity .4s ease .08s,visibility 0s}
.is-collapsed .tl-body{transform:translateY(-40px);opacity:0;visibility:hidden;transition:transform .45s cubic-bezier(.5,0,.3,1),opacity .3s ease,visibility 0s .45s}
.tl-noanim .tl-wrap,.tl-noanim .tl-body{transition:none!important}
@media (prefers-reduced-motion:reduce){.tl-wrap,.tl-body,.tl-q-wrap{transition:none!important}}
@media (max-width:480px){
  .tl-area-btn{gap:12px}
  .tl-area-t{min-width:0}
  .tl-area-title{font-size:32px;overflow-wrap:break-word}
  .tl-area-r{flex-direction:column-reverse;align-items:flex-end;gap:8px}
  .tl-area-n{padding-bottom:0}
}
.tl-area-empty{margin:0;font:400 16px/1.55 Roboto,sans-serif;color:#57554f}
.tl-area-empty a{color:#141414;box-shadow:inset 0 -2px 0 #f5a400}
.tl-area-empty a:hover{color:#a86f00}

/* listing cards */
.tl-card{display:flex;flex-wrap:wrap;gap:28px 48px;padding:clamp(22px,3vw,36px);scroll-margin-top:24px}
.tl-card-main{flex:5 1 300px;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.tl-logo-box{display:flex;align-items:flex-end;height:96px}
.tl-logo-box a{display:block}
.tl-logo-box img{display:block;width:auto;height:auto;object-fit:contain;mix-blend-mode:multiply}
.tl-logo--sq img{max-width:88px;max-height:88px}
.tl-logo--wide img{max-width:200px;max-height:64px;margin-bottom:12px}
.tl-logo--dark a{display:flex;background:#222;padding:10px}
.tl-logo--dark img{max-width:180px;max-height:68px;mix-blend-mode:normal}
.tl-mono{display:flex;align-items:center;justify-content:center;width:88px;height:88px;margin-top:8px;background:#222;color:#f5a400;font:800 34px/1 'Big Shoulders Display',sans-serif;letter-spacing:.06em}
.tl-card-head{display:flex;flex-direction:column;gap:10px}
.tl-card h3{margin:0;font:800 clamp(28px,2.8vw,36px)/.92 Archivo,sans-serif;font-stretch:68%;text-transform:uppercase;text-wrap:balance}
.tl-badges{display:flex;flex-wrap:wrap;gap:6px}
.tl-badge,.tl-tag{font:500 11px/1 Roboto,sans-serif;text-transform:uppercase;letter-spacing:.08em}
.tl-badge{background:#f5a400;color:#141414;padding:6px 9px}
.tl-tag{border:1px solid #141414;padding:5px 8px}
.tl-desc{margin:0;max-width:48ch;font-size:16px;line-height:1.6;color:#2a2a28;text-wrap:pretty}
.tl-card-foot{align-self:stretch;margin-top:auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 36px}
.tl-site{font:500 16px/1.4 Archivo,sans-serif;box-shadow:inset 0 -2px 0 #f5a400;overflow-wrap:anywhere}
.tl-site:hover,.tl-link:hover{color:#8a5b00}
.tl-more{display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px}
.tl-link{font:500 15px/1.4 Archivo,sans-serif;box-shadow:inset 0 -2px 0 #f5a400}
.tl-share{display:inline-flex;align-items:center;gap:8px;background:none;border:0;padding:0;font:500 14px/1.4 Archivo,sans-serif;color:#6c6a66;cursor:pointer}
.tl-share:hover{color:#141414}
.tl-share svg{display:block;flex:none}
.tl-card-facts{flex:7 1 360px;min-width:0;align-self:flex-start}
.tl-facts{margin:0;display:flex;flex-direction:column;border-top:2px solid #141414}
.tl-facts>div{display:grid;grid-template-columns:104px minmax(0,1fr);gap:16px;padding:11px 0;border-bottom:1px solid rgba(20,20,20,.16)}
.tl-facts dt{font:500 13px/1.25 Oswald,sans-serif;text-transform:uppercase;letter-spacing:.03em;color:#8a5b00;padding-top:2px}
.tl-facts dd{margin:0;font-size:15px;line-height:1.45}

/* "claim your listing" strip */
.tl-claim{display:flex;flex-wrap:wrap;border:2px solid #141414;scroll-margin-top:24px;margin-top:-43px;margin-bottom:-43px}
.tl-claim-k{flex:0 1 240px;display:flex;align-items:center;padding:22px 28px;background:#141414;color:#f5f4f1;font:800 30px/.95 Archivo,sans-serif;font-stretch:66%;text-transform:uppercase}
.tl-claim-b{flex:1 1 420px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 28px;padding:20px 28px}
.tl-claim-c{flex:1 1 300px;display:flex;flex-direction:column;gap:6px}
.tl-claim h2{margin:0;font:800 clamp(26px,2.6vw,32px)/1 Archivo,sans-serif;font-stretch:70%;text-transform:uppercase;color:#141414;text-wrap:balance}
.tl-claim p{margin:0;font:400 15px/1.5 Roboto,sans-serif;color:#57554f;text-wrap:pretty}

/* question rows */
.tl-rows{padding:clamp(12px,2.5vw,24px) clamp(24px,4vw,48px)}
.tl-row{display:flex;flex-wrap:wrap;gap:12px 48px;padding:24px 0;border-bottom:1px solid rgba(20,20,20,.18)}
.tl-row:last-child{border-bottom:0}
.tl-row h3{flex:2 1 260px;margin:0;font:800 28px/.95 Archivo,sans-serif;font-stretch:70%;text-transform:uppercase;text-wrap:balance}
.tl-row p{flex:3 1 380px;margin:0;font-size:17px;line-height:1.6;color:#2a2a28;text-wrap:pretty}
.tl-row a,.tl-q-a a{box-shadow:inset 0 -2px 0 #f5a400}
.tl-row a:hover,.tl-q-a a:hover{color:#8a5b00}

/* accordion FAQ */
.tl-faq{padding:clamp(20px,3vw,36px) clamp(24px,4vw,48px);display:flex;flex-direction:column;gap:36px}
.tl-faq-group{display:flex;flex-direction:column}
.tl-faq-group>h3{margin:0;padding-bottom:10px;border-bottom:2px solid #141414;font:500 14px/1.25 Oswald,sans-serif;text-transform:uppercase;letter-spacing:.04em;color:#8a5b00}
.tl-q{border-bottom:1px solid rgba(20,20,20,.18)}
.tl-q h4{margin:0;font:inherit}
.tl-q-btn{display:flex;justify-content:space-between;align-items:center;gap:20px;width:100%;margin:0;padding:20px 0;background:none;border:0;text-align:left;color:#141414;cursor:pointer}
.tl-q-btn:hover{color:#8a5b00}
.tl-q-btn>span:first-child{font:800 26px/.98 Archivo,sans-serif;font-stretch:70%;text-transform:uppercase;text-wrap:balance}
.tl-q-btn>span:last-child{flex:none;width:28px;text-align:center;font:400 36px/.8 Archivo,sans-serif;font-stretch:66%}
.tl-q-wrap{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s cubic-bezier(.2,.7,.2,1)}
.tl-q.is-open .tl-q-wrap{grid-template-rows:1fr}
.tl-q-wrap>div{min-height:0;overflow:hidden}
.tl-q-a{padding:0 0 24px;max-width:72ch;visibility:hidden}
.tl-q.is-open .tl-q-a{visibility:visible}
.tl-q-a p{margin:0;font-size:17px;line-height:1.6;color:#2a2a28;text-wrap:pretty}

/* Ride Report signup */
.tl-news-wrap{max-width:1280px;margin:0 auto}
.tl-news{background:url(/images/textures/grain.svg),#2e2e2e;color:#f5f4f1;margin:0 32px;padding:clamp(32px,4vw,56px) clamp(24px,4vw,48px);display:flex;flex-wrap:wrap;gap:32px;align-items:flex-end;scroll-margin-top:24px}
.tl-news-copy{flex:7 1 380px;display:flex;flex-direction:column;gap:18px}
.tl-rr{position:relative;display:inline-block;align-self:flex-start}
.tl-rr>span{position:relative;z-index:1;display:inline-block;font:800 30px/1 'Big Shoulders Display',sans-serif;text-transform:uppercase;letter-spacing:.04em;color:#9c9a95}
.tl-rr>span>span{color:#eadcb8}
.rg-rider-svg{position:absolute;inset:0;width:100%;height:100%;display:block;overflow:visible;opacity:0;pointer-events:none}
.tl-news h2{margin:0;font-weight:800;font-size:clamp(44px,5.6vw,72px);line-height:.88;font-stretch:66%;text-transform:uppercase}
.tl-news p{margin:0;max-width:480px;font-size:15px;line-height:1.55;color:#d6d5d1}
.tl-news form{flex:5 1 300px;min-width:0;display:flex;flex-direction:column;gap:12px}
.tl-news form>span{font-size:12px;line-height:1.5;color:#b3b2ae}
.tl-news-field{display:flex;border:1px solid #f5f4f1}
.tl-news-field input{flex:1;min-width:0;background:transparent;border:0;padding:16px;color:#f5f4f1;font:400 14px Roboto,sans-serif;outline:none}
.tl-news-field button{background:#f5a400;color:#222;border:0;padding:0 22px;font:600 11.5px/1 Roboto,sans-serif;text-transform:uppercase;letter-spacing:.08em;cursor:pointer}
.tl-news-field button:hover{background:#f5f4f1}

/* footer */
.tl-footer{margin-top:32px;width:100%;background:url(/images/textures/grain.svg),#222;color:#d9d7d2;border-top:4px solid #f5a400;display:flex;flex-direction:column;font-size:14px}
.tl-footer--flush{margin-top:0}
.tl-foot-in{display:flex;flex-wrap:wrap;width:100%;max-width:1280px;margin:0 auto}
.tl-foot-brand{flex:2 1 300px;padding:32px;display:flex;flex-direction:column;gap:16px;border-right:1px solid rgba(255,255,255,.12)}
.tl-foot-brand img{height:56px;align-self:flex-start;display:block}
.tl-foot-brand span{line-height:1.5;max-width:300px}
.tl-foot-social{display:flex;gap:18px;margin-top:4px}.tl-foot-social a{display:inline-flex;color:#d9d7d2;transition:color .2s}.tl-foot-social a:hover{color:#f5a400}.tl-foot-social svg{width:22px;height:22px;display:block}
.tl-foot-col{flex:1 1 180px;padding:32px;display:flex;flex-direction:column;gap:10px;border-right:1px solid rgba(255,255,255,.12)}
.tl-foot-col:last-child{border-right:0}
/* the design's footer leaves About alone on a second row at desktop widths; keep all five columns on one row there */
.tl-foot-brand,.tl-foot-col{box-sizing:content-box}
@media (min-width:1100px){.tl-foot-brand,.tl-foot-col{box-sizing:border-box}}
.tl-foot-col>:first-child{font:500 11px/1 Roboto,sans-serif;text-transform:uppercase;letter-spacing:.1em;color:#f5a400;margin-bottom:6px}
.tl-foot-col a:hover{color:#f5a400}
.tl-foot-col a:first-child:hover{color:#f5f4f1}
.tl-foot-soon{color:#9c9a95}
.tl-foot-copy{border-top:1px solid rgba(255,255,255,.12);padding:16px max(32px,calc((100% - 1280px) / 2 + 32px));font:500 10.5px/1 Roboto,sans-serif;text-transform:uppercase;letter-spacing:.1em;color:#9a9995}
