/*
 * SLG Service Page stylesheet
 * Part of the slg-page-infrastructure plugin. Enqueued only on pages using the
 * "SLG Service Page" template. Everything is scoped under .slg-page so it cannot
 * collide with the lawrank-template-19 theme or Elementor styles.
 *
 * Derived from the approved ground-truth: 02_Templates/slg-service-page/index.html
 * Spacing and the heading font are refined side by side against the live theme
 * after first upload to a hidden draft.
 */

.slg-page {
  --slg-navy:#283544; --slg-brand:#cf2127; --slg-brandd:#a01a20; --slg-ink:#1f2a30;
  --slg-mut:#5d6b73; --slg-line:#e4e7ea; --slg-gray:#f4f6f7; --slg-tint:#fbf4f4;
  color:var(--slg-ink);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  line-height:1.7; font-size:16px;
}
.slg-page *{ box-sizing:border-box; }

/* The lawrank theme header is position:sticky and transparent until scroll (it gains a
   dark background via .bg-color past 100px). Over our hero it reads as invisible at the
   top, so give it the brand navy at the top of SLG template pages; the theme's black
   still applies once the page is scrolled. Targets the header, which sits outside .slg-page. */
body.page-template-template-slg-page .site-header:not(.bg-color){ background-color:#283544; }

/* Full-bleed band: breaks out of the theme content column so section
   backgrounds run edge to edge, with an inner column for the text. */
.slg-page .slg-band{
  width:100vw; margin-left:calc(50% - 50vw); padding:46px 0;
}
.slg-page .slg-band--alt{ background:var(--slg-gray); }
.slg-page .slg-band--tint{ background:var(--slg-tint); }
.slg-page .slg-inner{ max-width:880px; margin:0 auto; padding:0 24px; }

.slg-page h2{ font-family:'Lora',Georgia,serif; color:var(--slg-navy);
  font-size:27px; font-weight:600; line-height:1.25; margin:0 0 14px; }
.slg-page h3{ font-family:'Inter',sans-serif; color:var(--slg-navy);
  font-size:16px; font-weight:600; margin:18px 0 6px; }
.slg-page p{ margin:0 0 13px; }
.slg-page ul{ margin:0 0 13px; padding-left:20px; }
.slg-page li{ margin:0 0 8px; }
.slg-page a{ color:var(--slg-brandd); }

/* Hero */
.slg-page .slg-hero{ width:100vw; margin-left:calc(50% - 50vw);
  background:var(--slg-navy); color:#fff; text-align:center; padding:56px 24px 50px; }
.slg-page .slg-hero .slg-ey{ color:#e7a9ad; font-size:12px; font-weight:600; letter-spacing:.12em; }
.slg-page .slg-hero h1{ color:#fff; font-family:'Lora',Georgia,serif;
  font-size:clamp(30px,5vw,46px); font-weight:600; line-height:1.12; margin:10px auto 8px; max-width:800px; }
.slg-page .slg-hero .slg-sub{ color:#cfd6db; font-size:18px; max-width:680px; margin:0 auto 8px;
  font-family:'Lora',Georgia,serif; font-style:italic; }
.slg-page .slg-hero .slg-desc{ color:#b9c2c9; font-size:15px; max-width:620px; margin:0 auto 22px; }

/* Buttons */
.slg-page .slg-btns{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.slg-page .slg-btn{ display:inline-block; text-decoration:none; font-weight:600; font-size:15px;
  padding:13px 22px; border-radius:7px; }
.slg-page .slg-btn-r{ background:var(--slg-brand); color:#fff; }
.slg-page .slg-btn-r:hover{ background:var(--slg-brandd); }
.slg-page .slg-btn-o{ border:1.5px solid #fff; color:#fff; padding:12px 22px; }
.slg-page .slg-btn-w{ background:#fff; color:var(--slg-navy); }
.slg-page .slg-btn-w:hover{ background:#eef0f2; }
.slg-page .slg-nofee{ color:#9fb0b8; font-size:13px; margin-top:14px; }

/* Trust badges */
.slg-page .slg-badges{ display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:14px; }
.slg-page .slg-badge{ background:#fff; border:1px solid var(--slg-line); border-radius:14px;
  padding:20px; text-align:center; }
.slg-page .slg-chip{ width:48px; height:48px; border-radius:13px; background:var(--slg-brand);
  color:#fff; display:flex; align-items:center; justify-content:center; margin:0 auto 12px; font-size:24px; }
.slg-page .slg-phrase{ font-family:'Lora',Georgia,serif; color:var(--slg-navy); font-size:16px; line-height:1.3; }
.slg-page .slg-phrase strong{ display:block; font-weight:600; font-size:21px; margin-bottom:3px; }

/* Table of contents */
.slg-page details.slg-toc{ border:1px solid var(--slg-line); border-radius:10px; padding:12px 16px; background:#fff; }
.slg-page details.slg-toc summary{ cursor:pointer; font-weight:600; color:var(--slg-navy); }
.slg-page .slg-toc .slg-links{ columns:2; font-size:14px; color:var(--slg-mut); padding-top:10px; line-height:1.9; }

/* Easy Table of Contents (ez-toc) restyled to match this template. Scoped to .slg-page so the rest of the site is untouched. */
.slg-page #ez-toc-container{ background:#fff; border:1px solid var(--slg-line); border-radius:10px; box-shadow:none; padding:13px 17px 14px; width:auto; float:none; }
.slg-page #ez-toc-container p.ez-toc-title{ font-family:'Lora',Georgia,serif; color:var(--slg-navy); font-size:17px; font-weight:600; text-transform:none; letter-spacing:0; }
.slg-page #ez-toc-container .ez-toc-title-toggle a, .slg-page #ez-toc-container a.ez-toc-toggle{ color:var(--slg-brandd); }
.slg-page #ez-toc-container nav ul.ez-toc-list{ padding-top:10px; }
.slg-page #ez-toc-container ul.ez-toc-list li{ margin:0 0 7px; font-size:14px; }
.slg-page #ez-toc-container ul.ez-toc-list a{ color:var(--slg-mut); text-decoration:none; }
.slg-page #ez-toc-container ul.ez-toc-list a:hover{ color:var(--slg-brand); text-decoration:underline; }

/* Stat cards */
.slg-page .slg-stats{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; margin:0 0 18px; }
.slg-page .slg-stat{ background:#fff; border:1px solid var(--slg-line); border-radius:12px; padding:16px; }
.slg-page .slg-stat .slg-n{ font-family:'Lora',Georgia,serif; color:var(--slg-navy); font-size:26px; font-weight:600; }
.slg-page .slg-stat .slg-l{ font-family:'Lora',Georgia,serif; font-size:14px; color:var(--slg-mut); margin-top:4px; }

/* Card grids (causes, features, cases we handle) */
.slg-page .slg-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; }
.slg-page .slg-gcard{ position:relative; overflow:hidden; background:#fff; border:1px solid var(--slg-line); border-radius:12px; padding:20px 18px 18px; transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.slg-page .slg-gcard::before{ content:""; position:absolute; top:0; left:0; right:0; height:5px; background:var(--slg-brand); }
.slg-page .slg-gcard:hover{ transform:translateY(-4px); box-shadow:0 10px 26px rgba(40,53,68,.13); border-color:#d7dbe0; }
.slg-page .slg-gcard .slg-ic{ color:var(--slg-brand); font-size:24px; }
.slg-page .slg-gcard .slg-t{ font-family:'Lora',Georgia,serif; font-weight:600; color:var(--slg-navy); font-size:17px; margin:8px 0 5px; }
.slg-page .slg-gcard p{ font-size:14px; color:var(--slg-mut); margin:0; line-height:1.55; }
.slg-page .slg-gcard .slg-cta{ display:inline-flex; align-items:center; gap:5px; margin-top:11px; color:var(--slg-brandd); font-weight:600; font-size:14px; text-decoration:none; background:none !important; box-shadow:none !important; padding:0 !important; border:0 !important; border-radius:0 !important; }
.slg-page .slg-gcard .slg-cta:hover{ color:var(--slg-brand); text-decoration:underline; }
.slg-page .slg-gcard .slg-cta::before, .slg-page .slg-gcard .slg-cta::after{ display:none !important; }
.slg-page .slg-gcard .slg-cta i{ transition:transform .18s ease; }
.slg-page .slg-gcard:hover .slg-cta i{ transform:translateX(3px); }

/* Callout (case results, key figures) */
.slg-page .slg-callout{ background:#fff; border-left:4px solid var(--slg-brand);
  padding:16px 18px; margin:6px 0 12px; border-radius:0 8px 8px 0; }
.slg-page .slg-disc{ font-size:13px; color:var(--slg-mut); }

/* Attorney block */
.slg-page .slg-atty{ display:flex; gap:18px; align-items:flex-start; background:#fff;
  border:1px solid var(--slg-line); border-radius:14px; padding:20px; margin-top:14px; }
.slg-page .slg-avt{ width:60px; height:60px; border-radius:50%; background:var(--slg-navy); color:#fff;
  display:flex; align-items:center; justify-content:center; font-family:'Lora',Georgia,serif;
  font-weight:600; font-size:20px; flex:none; }
.slg-page .slg-quote{ font-family:'Lora',Georgia,serif; font-style:italic; color:var(--slg-ink);
  font-size:17px; border-left:3px solid var(--slg-brand); padding-left:14px; margin:10px 0; }

/* Photo variant of the attorney block (Why Choose): sub-head + side-by-side */
.slg-page .slg-atty__sub{ font-family:'Lora',Georgia,serif; color:var(--slg-navy); font-size:22px; font-weight:600; text-align:center; margin:8px 0 14px; }
.slg-page .slg-atty--photo{ align-items:flex-start; gap:22px; }
.slg-page .slg-founders{ margin:0; flex:0 0 50%; max-width:470px; }
.slg-page .slg-founders img{ width:100%; height:auto; border-radius:12px; display:block; border:1px solid var(--slg-line); }
.slg-page .slg-founders figcaption{ font-family:'Lora',Georgia,serif; color:var(--slg-mut); font-size:12.5px; text-align:center; margin-top:8px; }

/* Reviews */
.slg-page .slg-rev{ background:#fff; border:1px solid var(--slg-line); border-radius:14px; padding:26px; text-align:center; }
.slg-page .slg-rev .slg-stars{ color:#e0a32a; font-size:24px; letter-spacing:3px; }
.slg-page .slg-rev .slg-big{ font-family:'Lora',Georgia,serif; color:var(--slg-navy); font-size:26px; font-weight:600; margin-top:10px; }

/* FAQ */
.slg-page details.slg-faq{ border:1px solid var(--slg-line); border-radius:10px; padding:13px 16px; margin:0 0 9px; background:#fff; }
.slg-page details.slg-faq summary{ cursor:pointer; font-weight:600; color:var(--slg-navy); }
.slg-page details.slg-faq p{ margin:11px 0 0; color:var(--slg-ink); }

/* Final CTA band */
.slg-page .slg-cta{ background:var(--slg-navy); color:#fff; text-align:center; }
.slg-page .slg-cta h2{ color:#fff; }
.slg-page .slg-cta p{ color:#cfd6db; }

/* Case results carousel (Slick) */
.slg-page .slg-cr{ position:relative; margin-top:6px; }
.slg-page .slg-cr__slide{ padding:0 9px; }
.slg-page .slg-cr__slide img{ width:100%; height:auto; display:block; border-radius:12px;
  border:1px solid var(--slg-line); box-shadow:0 6px 18px rgba(40,53,68,.08); }
.slg-page .slg-cr .slick-list{ overflow:hidden; }
.slg-page .slg-cr .slick-prev, .slg-page .slg-cr .slick-next{ width:40px; height:40px; z-index:5; }
.slg-page .slg-cr .slick-prev{ left:-8px; }
.slg-page .slg-cr .slick-next{ right:-8px; }
.slg-page .slg-cr .slick-prev:before, .slg-page .slg-cr .slick-next:before{ color:var(--slg-brand); font-size:38px; opacity:1; line-height:1; }
.slg-page .slg-cr .slick-dots li button:before{ color:var(--slg-brand); font-size:9px; opacity:.4; }
.slg-page .slg-cr .slick-dots li.slick-active button:before{ opacity:1; }
.slg-page .slg-cr__more{ text-align:center; margin-top:16px; }
.slg-page .slg-cr__more a{ display:inline-flex; align-items:center; gap:5px; color:var(--slg-brandd);
  font-weight:600; font-size:14px; text-decoration:none; }
.slg-page .slg-cr__more a:hover{ text-decoration:underline; }
.slg-page .slg-cr__slide img{ cursor:zoom-in; }

/* Case result lightbox (overlay mounts on <body>, so these rules are unscoped) */
.slg-lb{ position:fixed; inset:0; z-index:2147483647; display:none; align-items:center; justify-content:center;
  background:rgba(20,26,32,.92); padding:28px; }
.slg-lb.open{ display:flex; }
.slg-lb__fig{ margin:0; max-width:min(92vw,560px); display:flex; flex-direction:column; align-items:center; }
.slg-lb__fig img{ max-width:100%; max-height:84vh; width:auto; height:auto; border-radius:10px;
  box-shadow:0 12px 44px rgba(0,0,0,.55); }
.slg-lb__fig figcaption{ color:#cfd6db; font-size:13px; line-height:1.5; margin-top:12px; text-align:center; max-width:520px; }
.slg-lb__x{ position:absolute; top:14px; right:20px; background:none; border:0; color:#fff; font-size:36px;
  line-height:1; cursor:pointer; padding:4px 10px; }
.slg-lb__nav{ position:absolute; top:50%; transform:translateY(-50%); width:48px; height:48px; border:0;
  border-radius:50%; background:rgba(255,255,255,.14); color:#fff; font-size:26px; cursor:pointer; }
.slg-lb__nav:hover{ background:#cf2127; }
.slg-lb__prev{ left:18px; }
.slg-lb__next{ right:18px; }
@media (max-width:600px){ .slg-lb__nav{ width:40px; height:40px; font-size:22px; } .slg-lb{ padding:14px; } }

/* Attorney carousel (Slick) */
.slg-page .slg-at{ position:relative; margin-top:6px; }
.slg-page .slg-at__slide{ padding:0 10px; }
.slg-page .slg-at__photo{ aspect-ratio:1/1; border-radius:12px; overflow:hidden; border:1px solid var(--slg-line); background:var(--slg-gray); }
.slg-page .slg-at__photo img{ width:100%; height:100%; object-fit:cover; object-position:top center; display:block; }
.slg-page .slg-at__name{ font-family:'Lora',Georgia,serif; color:var(--slg-navy); font-size:18px; font-weight:600; margin:12px 0 3px; }
.slg-page .slg-at__bio{ display:inline-flex; align-items:center; gap:5px; color:var(--slg-brandd); font-weight:600; font-size:14px; text-decoration:none; }
.slg-page .slg-at__bio:hover{ text-decoration:underline; }
.slg-page .slg-at__bio i{ transition:transform .18s ease; }
.slg-page .slg-at__card:hover .slg-at__bio i{ transform:translateX(3px); }
.slg-page .slg-at .slick-prev, .slg-page .slg-at .slick-next{ width:40px; height:40px; z-index:5; }
.slg-page .slg-at .slick-prev{ left:-8px; }
.slg-page .slg-at .slick-next{ right:-8px; }
.slg-page .slg-at .slick-prev:before, .slg-page .slg-at .slick-next:before{ color:var(--slg-brand); font-size:38px; opacity:1; line-height:1; }
.slg-page .slg-at .slick-dots li button:before{ color:var(--slg-brand); font-size:9px; opacity:.4; }
.slg-page .slg-at .slick-dots li.slick-active button:before{ opacity:1; }

/* Sticky mobile call bar */
.slg-page .slg-callbar{ position:fixed; left:0; right:0; bottom:0; background:var(--slg-brand); color:#fff;
  display:none; align-items:center; justify-content:center; gap:8px; padding:13px; font-weight:600;
  text-decoration:none; z-index:9000; }
@media (max-width:768px){
  .slg-page .slg-callbar{ display:flex; }
  .slg-page .slg-atty{ flex-direction:column; }
  .slg-page .slg-atty--photo .slg-founders{ flex-basis:auto; max-width:none; width:100%; }
  body.slg-has-callbar{ padding-bottom:54px; }
}

/* Hero: two-column with an always-visible native lead form (v0.3.0) */
.slg-page .slg-hero{ text-align:left; padding:48px 24px; }
.slg-page .slg-hero-grid{ max-width:1080px; margin:0 auto; display:grid; grid-template-columns:1.05fr .95fr; gap:36px; align-items:start; }
.slg-page .slg-hero-copy h1{ text-align:left; margin:6px 0 10px; max-width:none; }
.slg-page .slg-hero-copy .slg-sub{ text-align:left; margin:0 0 10px; max-width:none; }
.slg-page .slg-hero-copy .slg-desc{ text-align:left; margin:0 0 20px; max-width:none; }
.slg-page .slg-hero-copy .slg-btns{ justify-content:flex-start; }
.slg-page .slg-hero-copy .slg-nofee{ text-align:left; }
.slg-page .slg-hero-trust{ display:flex; align-items:center; gap:9px; margin-top:14px; }
.slg-page .slg-hero-trust .slg-stars{ color:#e0a32a; font-size:15px; letter-spacing:2px; }
.slg-page .slg-hero-trust .t{ color:#9fb0b8; font-size:12.5px; }

/* Lead form card */
.slg-page .slg-hero-form{ position:relative; }
.slg-page .slg-form-card{ background:#fff; border-radius:14px; padding:22px; box-shadow:0 12px 32px rgba(20,26,32,.20); }
.slg-page .slg-form-eyebrow{ display:inline-block; background:var(--slg-tint); color:var(--slg-brandd); font-size:11px; font-weight:600; padding:4px 10px; border-radius:6px; letter-spacing:.02em; }
.slg-page .slg-form-h{ font-family:'Lora',Georgia,serif; color:var(--slg-navy); font-size:22px; font-weight:600; line-height:1.2; margin:10px 0 3px; }
.slg-page .slg-form-sub{ color:var(--slg-mut); font-size:13.5px; margin:0 0 14px; }
.slg-page .slg-form-row{ margin-bottom:10px; }
.slg-page .slg-form-row label{ display:block; font-size:12.5px; font-weight:600; color:#3a464d; }
.slg-page .slg-form-row .slg-req{ color:var(--slg-brand); }
.slg-page .slg-leadform input, .slg-page .slg-leadform textarea, .slg-page .slg-leadform select{ width:100%; margin-top:4px; padding:10px 12px; border:1px solid #d9dee2; border-radius:8px; font-family:'Inter',sans-serif; font-size:14px; color:var(--slg-ink); background:#fff; }
.slg-page .slg-leadform input:focus, .slg-page .slg-leadform textarea:focus, .slg-page .slg-leadform select:focus{ outline:none; border-color:var(--slg-brand); box-shadow:0 0 0 3px rgba(207,33,39,.12); }
.slg-page .slg-leadform textarea{ resize:vertical; min-height:62px; }
.slg-page .slg-leadform select{ cursor:pointer; -webkit-appearance:none; appearance:none; padding-right:34px; background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%235d6b73' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 12px center; }
.slg-page .slg-form-submit{ display:flex; align-items:center; justify-content:center; gap:7px; width:100%; border:0; cursor:pointer; margin-top:6px; font-size:15px; }
.slg-page .slg-form-submit[disabled]{ opacity:.65; cursor:default; }
.slg-page .slg-form-status{ font-size:13px; margin:8px 0 0; min-height:1px; }
.slg-page .slg-form-status.error{ color:var(--slg-brandd); }
.slg-page .slg-form-legal{ font-size:10.5px; color:#8a949a; line-height:1.45; margin:9px 0 0; }
.slg-page .slg-form-success{ background:#fff; border-radius:14px; padding:28px 22px; text-align:center; box-shadow:0 12px 32px rgba(20,26,32,.20); }
.slg-page .slg-form-success p{ color:var(--slg-mut); }
.slg-page .slg-hp{ position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden; }

/* Embedded lead form: the .slg-page wrapper the [slg_lead_form] shortcode adds when
   the form is placed outside the service-page template (e.g. a blog post). Constrain
   + center so it reads as an intentional card inside a normal content column. */
.slg-leadform-embed{ max-width:540px; margin:22px auto 6px; }
.slg-leadform-embed .slg-form-card{ box-shadow:0 6px 22px rgba(20,26,32,.12); }

@media (max-width:860px){
  .slg-page .slg-hero-grid{ grid-template-columns:1fr; gap:24px; }
  .slg-page .slg-hero{ padding:40px 22px; }
}