/* TORKLAW design system v1 — tokens, base, states, responsive overrides */
:root{--tl-black:#0E0B0B;--tl-red:#C22921;--tl-red-signal:#FB2E23;--tl-red-hover:#A8221B;--tl-grey:#F3F3F3;--tl-white:#FFFFFF;--tl-line:#DCDCDC;--tl-line-dark:#3A3535;--tl-panel:#1A1616;--tl-text:#0E0B0B;--tl-body:#333333;--tl-muted:#6A6A6A;--tl-icon:#7A7A7A;--tl-gold:#F2A900;--tl-font:'Montserrat',system-ui,sans-serif}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--tl-font);background:var(--tl-grey);color:var(--tl-text);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.tl-stripe{background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.55) 0 28px,rgba(255,255,255,0) 28px 120px)}
.btn-red:hover{background:var(--tl-red-hover)!important}
.btn-dark:hover{background:#2A2626!important}
.btn-outline:hover{background:rgba(255,255,255,.12)!important;color:#fff!important}
.card-link:hover{border-color:var(--tl-black)!important;color:var(--tl-black)!important}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--tl-red-signal);outline-offset:2px}
input:focus,textarea:focus{border-color:var(--tl-black)!important}
/* Attorney stories row (Instagram-style) */
.tl-story{transition:transform .15s ease}.tl-story:hover,.tl-story:focus-visible{transform:scale(1.1)}
/* TORKLAW design system v1 — tokens, base, states, responsive overrides */
:root{--tl-black:#0E0B0B;--tl-red:#C22921;--tl-red-signal:#FB2E23;--tl-red-hover:#A8221B;--tl-grey:#F3F3F3;--tl-white:#FFFFFF;--tl-line:#DCDCDC;--tl-line-dark:#3A3535;--tl-panel:#1A1616;--tl-text:#0E0B0B;--tl-body:#333333;--tl-muted:#6A6A6A;--tl-icon:#7A7A7A;--tl-gold:#F2A900;--tl-font:'Montserrat',system-ui,sans-serif}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--tl-font);background:var(--tl-grey);color:var(--tl-text);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.tl-stripe{background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.55) 0 28px,rgba(255,255,255,0) 28px 120px)}
.btn-red:hover{background:var(--tl-red-hover)!important}
.btn-dark:hover{background:#2A2626!important}
.btn-outline:hover{background:rgba(255,255,255,.12)!important;color:#fff!important}
.card-link:hover{border-color:var(--tl-black)!important;color:var(--tl-black)!important}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--tl-red-signal);outline-offset:2px}
input:focus,textarea:focus{border-color:var(--tl-black)!important}
/* Attorney stories row (Instagram-style) */
.tl-story{transition:transform .15s ease}.tl-story:hover,.tl-story:focus-visible{transform:scale(1.1)}
.tl-stories{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;scroll-snap-type:x proximity;scroll-behavior:smooth;overscroll-behavior-x:contain}.tl-stories::-webkit-scrollbar{display:none}.tl-stories .tl-story{scroll-snap-align:start}
.tl-stories-btn{transition:opacity .15s}.tl-stories-btn[disabled]{opacity:.25;cursor:default}
@media (hover:none){.tl-stories-btn{display:none!important}.tl-stories{padding-left:0!important;padding-right:0!important}}
/* Sticky header (JS adds .is-scrolled to body after 400px) */
body.is-scrolled .tl-nav{position:fixed;top:0;left:0;right:0;z-index:50;height:64px!important;box-shadow:0 8px 24px -12px rgba(0,0,0,.6)}
/* Live chat + mobile bottom bar are position:fixed in production */
.tl-chat{position:fixed!important;right:24px;bottom:24px;z-index:60}
.tl-bottom-bar{position:fixed!important;left:0;right:0;bottom:0;z-index:60}

/* FULL-BLEED FIX (v3.0.2): section backgrounds run edge to edge on any screen width;
   content stays centered at 1280px between 80px gutters. Applies to every direct section of the page. */
.tl-page{max-width:none!important;width:100%!important;margin:0!important}
.tl-page > div,.tl-page > header,.tl-page > footer,.tl-page > section{padding-left:max(80px,calc((100% - 1280px)/2))!important;padding-right:max(80px,calc((100% - 1280px)/2))!important}
.tl-page > div[style*="position: fixed"]{padding-left:0!important;padding-right:0!important}
@media (max-width:1024px){.tl-page > div,.tl-page > header,.tl-page > footer,.tl-page > section{padding-left:20px!important;padding-right:20px!important}}
/* Resources details block (ChatGPT's link-preservation list) */
details.tl-more{max-width:1280px;margin:0 auto;padding:16px 0 40px;font-size:14px;color:#6A6A6A}details.tl-more summary{cursor:pointer;font-weight:700;color:#0E0B0B}

/* RESPONSIVE: the reference pages use inline 12-column grids at 1440. Below 1024px, stack everything. */
@media (max-width:1024px){
  .tl-page [style*="grid-template-columns"]{grid-template-columns:1fr!important}
  .tl-page [style*="grid-column"]{grid-column:auto!important}
  .tl-page [style*="grid-row"]{grid-row:auto!important}
  .tl-page [style*="padding: 64px 80px"],.tl-page [style*="padding: 0 80px"],.tl-page [style*="80px"]{padding-left:20px!important;padding-right:20px!important}
  .tl-page h1{font-size:34px!important}
  .tl-page h2{font-size:28px!important}
  .tl-page [style*="height: 84px"]{height:auto!important;padding-top:16px!important;padding-bottom:16px!important;gap:10px}
  .tl-page [style*="display: flex; gap: 30px"],.tl-page [style*="display: flex; gap: 36px"]{display:none!important} /* desktop menu → hamburger */
}
@media (max-width:640px){
  .tl-page [style*="grid-template-columns: repeat(2"]{grid-template-columns:1fr!important}
  .tl-page [style*="font-size: 44px"]{font-size:32px!important}
  .tl-page [style*="font-size: 40px"]{font-size:30px!important}
}
.tl-stories{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;scroll-snap-type:x proximity;scroll-behavior:smooth;overscroll-behavior-x:contain}.tl-stories::-webkit-scrollbar{display:none}.tl-stories .tl-story{scroll-snap-align:start}
.tl-stories-btn{transition:opacity .15s}.tl-stories-btn[disabled]{opacity:.25;cursor:default}
@media (hover:none){.tl-stories-btn{display:none!important}.tl-stories{padding-left:0!important;padding-right:0!important}}
/* Sticky header (JS adds .is-scrolled to body after 400px) */
body.is-scrolled .tl-nav{position:fixed;top:0;left:0;right:0;z-index:50;height:64px!important;box-shadow:0 8px 24px -12px rgba(0,0,0,.6)}
/* Live chat + mobile bottom bar are position:fixed in production */
.tl-chat{position:fixed!important;right:24px;bottom:24px;z-index:60}
.tl-bottom-bar{position:fixed!important;left:0;right:0;bottom:0;z-index:60}
/* RESPONSIVE: the reference pages use inline 12-column grids at 1440. Below 1024px, stack everything. */
@media (max-width:1024px){
  .tl-page [style*="grid-template-columns"]{grid-template-columns:1fr!important}
  .tl-page [style*="grid-column"]{grid-column:auto!important}
  .tl-page [style*="grid-row"]{grid-row:auto!important}
  .tl-page [style*="padding: 64px 80px"],.tl-page [style*="padding: 0 80px"],.tl-page [style*="80px"]{padding-left:20px!important;padding-right:20px!important}
  .tl-page h1{font-size:34px!important}
  .tl-page h2{font-size:28px!important}
  .tl-page [style*="height: 84px"]{height:auto!important;padding-top:16px!important;padding-bottom:16px!important;gap:10px}
  .tl-page [style*="display: flex; gap: 30px"],.tl-page [style*="display: flex; gap: 36px"]{display:none!important} /* desktop menu → hamburger */
}
@media (max-width:640px){
  .tl-page [style*="grid-template-columns: repeat(2"]{grid-template-columns:1fr!important}
  .tl-page [style*="font-size: 44px"]{font-size:32px!important}
  .tl-page [style*="font-size: 40px"]{font-size:30px!important}
}