/*!
Theme Name: DuBoff Law
Theme URI: https://dubofflaw.webfu.com/
Author: Webfu
Author URI: https://webfu.com/
Description: Custom theme for The DuBoff Law Group, PC (Portland, Oregon). Underscores-based, Classic Editor + ACF Free. First build of the Webfu law-firm lineup: palette and type are tokens in :root.
Version: 1.0.0
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: duboff-theme
*/

/* =========================================================
   Tokens. Palette "Crimson & Gold" (lineup theme one); the
   crimson is sampled from the DuBoff logo (#801235).
   Swap this block to re-skin the theme.
   ========================================================= */
:root {
  --dl-crimson: #801235;
  --dl-crimson-deep: #5c0c25;
  --dl-crimson-tint: #f7ecef;
  --dl-gold: #c19a4b;
  --dl-gold-text: #8a6a22;
  --dl-ink: #16151a;
  --dl-ink-80: #36343b;
  --dl-ink-60: #5d5a63;
  --dl-line: #e3e0e4;
  --dl-paper: #ffffff;
  --dl-alt: #f6f5f7;
  --dl-cream: #faf6ee;

  --dl-serif: "EB Garamond", Georgia, "Times New Roman", serif;
  --dl-sans: "Google Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --dl-display: "Plus Jakarta Sans", "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;

  --dl-max: 1200px;
  --dl-text: 760px;
  --dl-radius: 4px;
  --dl-shadow: 0 1px 2px rgba(22, 21, 26, .06), 0 8px 24px rgba(22, 21, 26, .06);
  --dl-header-h: 84px;
}

/* =========================================================
   Base
   ========================================================= */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 96px; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--dl-sans);
  font-size: 1.0625rem;
  line-height: 1.65;
  font-weight: 400;
  color: var(--dl-ink-80);
  background: var(--dl-paper);
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
html, body { overflow-x: clip; }
a { color: var(--dl-crimson); text-underline-offset: 3px; }
a:hover { color: var(--dl-crimson-deep); }
:focus-visible { outline: 2px solid var(--dl-gold); outline-offset: 3px; }
h1, h2, h3, h4, h5, h6 { font-family: var(--dl-display); font-weight: 600; color: var(--dl-ink); line-height: 1.15; margin: 0 0 .5em; letter-spacing: -.01em; }
h1, h2 { font-weight: 700; }
h1 { letter-spacing: -.02em; }
h1 { font-size: clamp(2.5rem, 5vw, 4.25rem); }
h2 { font-size: clamp(1.9rem, 3.2vw, 2.75rem); }
h3 { font-size: 1.45rem; }
h4 { font-size: 1.2rem; }
p { margin: 0 0 1.1em; }
ul { padding-left: 1.2em; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
.dl-skip:focus { position: fixed !important; top: 8px; left: 8px; width: auto; height: auto; clip: auto; z-index: 1000; background: var(--dl-paper); padding: 10px 16px; }

.dl-container { width: 100%; max-width: var(--dl-max); margin: 0 auto; padding: 0 24px; }
.dl-container--narrow { max-width: 900px; }
.dl-container--text { max-width: calc(var(--dl-text) + 48px); }

.dl-icon { width: 1.15em; height: 1.15em; flex: none; }

.dl-eyebrow {
  font-family: var(--dl-sans);
  font-size: .8rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--dl-crimson);
  margin: 0 0 14px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.dl-eyebrow::before { content: ""; width: 28px; height: 1px; background: var(--dl-gold); }
.dl-eyebrow--gold { color: var(--dl-gold); }

/* Buttons */
.dl-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  font: 500 1rem/1 var(--dl-sans);
  padding: 15px 22px;
  border-radius: var(--dl-radius);
  border: 1px solid transparent;
  text-decoration: none;
  cursor: pointer;
  transition: background-color .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
  white-space: nowrap;
}
.dl-btn--primary { background: var(--dl-crimson); color: #fff; }
.dl-btn--primary:hover { background: var(--dl-crimson-deep); color: #fff; }
.dl-btn--ghost { background: transparent; color: var(--dl-ink); border-color: var(--dl-ink); }
.dl-btn--ghost:hover { background: var(--dl-ink); color: #fff; }
.dl-btn--ghost-light { background: transparent; color: #fff; border-color: rgba(255,255,255,.45); }
.dl-btn--ghost-light:hover { background: #fff; color: var(--dl-ink); }
.dl-btn--lg { padding: 18px 26px; font-size: 1.0625rem; }
.dl-btn--sm { padding: 10px 14px; font-size: .9rem; }
.dl-btn:active { transform: translateY(1px); }

.dl-readmore {
  display: inline-flex; align-items: center; gap: 8px;
  font-weight: 500; text-decoration: none; color: var(--dl-crimson);
  border-bottom: 1px solid var(--dl-gold); padding-bottom: 3px;
}
.dl-readmore .dl-icon { transition: transform .18s ease; }
.dl-readmore:hover .dl-icon { transform: translateX(3px); }
.dl-readmore--light { color: #fff; }
.dl-readmore--light:hover { color: #fff; }

/* Tooltips (data-tip) */
.dl-tip { position: relative; }
.dl-tip::after {
  content: attr(data-tip);
  position: absolute; left: 50%; top: calc(100% + 10px);
  transform: translate(-50%, -4px);
  background: var(--dl-ink); color: #fff;
  font: 400 .8rem/1.3 var(--dl-sans);
  padding: 7px 10px; border-radius: 3px;
  white-space: nowrap; pointer-events: none;
  opacity: 0; transition: opacity .15s ease, transform .15s ease;
  z-index: 60;
}
.dl-tip:hover::after, .dl-tip:focus-visible::after { opacity: 1; transform: translate(-50%, 0); }
.dl-menu-toggle.dl-tip::after { left: auto; right: 0; transform: translateY(-4px); }
.dl-menu-toggle.dl-tip:hover::after, .dl-menu-toggle.dl-tip:focus-visible::after { transform: none; }
/* Touch screens have no hover: a tapped button would keep its tooltip stuck open. */
@media (hover: none) { .dl-tip::after { display: none; } }

/* Skeleton placeholder for late-loading embeds */
.dl-skeleton { background: linear-gradient(100deg, #eceaed 30%, #f6f5f7 50%, #eceaed 70%); background-size: 300% 100%; animation: dl-shimmer 1.6s ease-in-out infinite; }
@keyframes dl-shimmer { 0% { background-position: 100% 0; } 100% { background-position: 0 0; } }
@media (prefers-reduced-motion: reduce) { .dl-skeleton { animation: none; } html { scroll-behavior: auto; } }

/* =========================================================
   Header
   ========================================================= */
.dl-utility { background: var(--dl-ink); color: rgba(255,255,255,.82); font-size: .85rem; }
.dl-utility__bar { display: flex; justify-content: space-between; gap: 24px; padding-top: 9px; padding-bottom: 9px; }
.dl-utility__item { display: inline-flex; align-items: center; gap: 8px; }
.dl-utility__item .dl-icon { color: var(--dl-gold); width: 15px; height: 15px; }

.dl-header {
  position: sticky; top: 0; z-index: 50;
  border-bottom: 1px solid var(--dl-line);
  transition: box-shadow .2s ease, margin-bottom .2s ease;
}
/* Blur lives on a pseudo-element: backdrop-filter on .dl-header itself would make it the
   containing block for the fixed mobile drawer and clip the drawer to the header's height. */
.dl-header::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: rgba(255,255,255,.97);
  -webkit-backdrop-filter: saturate(1.4) blur(8px);
  backdrop-filter: saturate(1.4) blur(8px);
}
.admin-bar .dl-header { top: 32px; }
.dl-header__bar { display: flex; align-items: center; gap: 28px; height: var(--dl-header-h); transition: height .2s ease; }
.dl-header.is-scrolled { box-shadow: 0 6px 20px rgba(22,21,26,.08); }
/* The bar shrinks, but margin-bottom grows by the same amount on the same timing, so the
   header's footprint in the page never changes. Without this the page reflows by the shrink,
   scroll anchoring pulls the scroll back under the threshold, and the header shakes. */
.dl-header.is-scrolled { margin-bottom: calc(var(--dl-header-h) - 66px); }
.dl-header.is-scrolled .dl-header__bar { height: 66px; }
.dl-brand { flex: none; }
.dl-brand img { height: 46px; width: auto; transition: height .2s ease; }
.dl-header.is-scrolled .dl-brand img { height: 38px; }
.dl-header__right { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.dl-header__call { padding: 12px 16px; }

.dl-nav { margin-left: auto; }
.dl-nav__list { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 4px; }
.dl-nav__item { position: relative; display: flex; align-items: center; }
.dl-nav__link {
  display: block; padding: 10px 12px;
  color: var(--dl-ink); text-decoration: none; font-weight: 500; font-size: .98rem;
  border-bottom: 2px solid transparent;
}
.dl-nav__link:hover, .dl-nav__item.is-current > .dl-nav__link { color: var(--dl-crimson); border-bottom-color: var(--dl-gold); }
.dl-nav__caret { background: none; border: 0; padding: 6px 4px; margin-left: -10px; color: var(--dl-ink-60); cursor: pointer; display: inline-flex; }
.dl-nav__caret .dl-icon { width: 16px; height: 16px; transition: transform .18s ease; }
.dl-nav__dropdown {
  list-style: none; margin: 0; padding: 10px 0;
  position: absolute; top: 100%; left: 0; min-width: 280px;
  background: #fff; border: 1px solid var(--dl-line); border-top: 2px solid var(--dl-crimson);
  box-shadow: var(--dl-shadow);
  opacity: 0; visibility: hidden; transform: translateY(6px);
  transition: opacity .16s ease, transform .16s ease, visibility .16s;
}
.dl-nav__item--has-dropdown:hover > .dl-nav__dropdown,
.dl-nav__item--has-dropdown:focus-within > .dl-nav__dropdown,
.dl-nav__item--has-dropdown.is-open > .dl-nav__dropdown { opacity: 1; visibility: visible; transform: none; }
.dl-nav__item.is-open .dl-nav__caret .dl-icon { transform: rotate(180deg); }
.dl-nav__subitem a { display: block; padding: 9px 20px; color: var(--dl-ink-80); text-decoration: none; font-size: .95rem; }
.dl-nav__subitem a:hover, .dl-nav__subitem a[aria-current] { background: var(--dl-crimson-tint); color: var(--dl-crimson); }
.dl-nav__drawer-foot { display: none; }

.dl-menu-toggle { display: none; background: none; border: 1px solid var(--dl-line); border-radius: var(--dl-radius); padding: 10px; cursor: pointer; color: var(--dl-ink); }
.dl-menu-toggle .dl-icon { width: 22px; height: 22px; }
.dl-menu-toggle .dl-icon--close { display: none; }
.dl-menu-toggle[aria-expanded="true"] .dl-icon--open { display: none; }
.dl-menu-toggle[aria-expanded="true"] .dl-icon--close { display: block; }
.dl-nav__scrim { position: fixed; inset: 0; background: rgba(22,21,26,.4); z-index: 40; }

@media (max-width: 1100px) {
  .dl-header__call span { display: none; }
  .dl-header__call { padding: 12px; }
}
@media (max-width: 980px) {
  .dl-utility__item--right { display: none; }
  .dl-menu-toggle { display: inline-flex; }
  .dl-header__call { display: none; }
  .dl-nav {
    position: fixed; top: 0; right: 0; bottom: 0; width: min(360px, 88vw);
    background: #fff; z-index: 55; padding: 128px 24px 24px; overflow-y: auto; overscroll-behavior: contain;
    transform: translateX(100%); transition: transform .24s ease; visibility: hidden;
  }
  .dl-nav.is-open { transform: none; visibility: visible; box-shadow: -10px 0 30px rgba(0,0,0,.12); }
  .dl-nav__list { flex-direction: column; align-items: stretch; gap: 0; }
  .dl-nav__item { flex-wrap: wrap; border-bottom: 1px solid var(--dl-line); }
  .dl-nav__link { flex: 1; padding: 14px 0; font-size: 1.05rem; border: 0; }
  .dl-nav__caret { margin: 0; padding: 12px; }
  .dl-nav__dropdown { position: static; flex-basis: 100%; min-width: 0; border: 0; box-shadow: none; padding: 0 0 10px; display: none; opacity: 1; visibility: visible; transform: none; }
  .dl-nav__item--has-dropdown:hover > .dl-nav__dropdown { display: none; }
  .dl-nav__item--has-dropdown.is-open > .dl-nav__dropdown { display: block; }
  .dl-nav__subitem a { padding: 9px 12px; }
  .dl-nav__drawer-foot { display: block; padding-top: 24px; }
  .dl-nav__drawer-foot .dl-btn { width: 100%; }
  .dl-nav__drawer-foot p { display: flex; gap: 8px; font-size: .9rem; margin-top: 16px; }
  .dl-menu-toggle { position: relative; z-index: 60; }
}
@media (max-width: 782px) { .admin-bar .dl-header { top: 46px; } }
@media (max-width: 600px) {
  .dl-utility { display: none; }
  .dl-nav { padding-top: 84px; }
  .dl-brand img { height: 38px; }
  :root { --dl-header-h: 70px; }
}

/* =========================================================
   Hero (home)
   ========================================================= */
.dl-hero { position: relative; padding: 72px 0 88px; overflow: hidden; }
.dl-hero::before {
  content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 38%;
  background: var(--dl-crimson-tint);
}
.dl-hero__grid { position: relative; display: grid; grid-template-columns: 1.15fr .85fr; gap: 64px; align-items: center; }
.dl-hero__title { font-size: clamp(2.6rem, 5.4vw, 4.6rem); line-height: 1.04; margin-bottom: 24px; }
/* Subhead under the H1: about 62% of the H1 size so it reads as a subhead (greg-826). */
.dl-hero__title:has(+ .dl-hero__sub) { margin-bottom: 14px; }
.dl-hero__sub { font-family: var(--dl-display); font-weight: 500; letter-spacing: -.005em; font-size: clamp(1.6rem, 3.35vw, 2.85rem); line-height: 1.2; color: var(--dl-crimson); text-wrap: balance; margin: 0 0 26px; }
.dl-hero__lede { font-size: 1.2rem; color: var(--dl-ink-60); max-width: 36em; margin-bottom: 34px; }
.dl-hero__ctas { display: flex; flex-wrap: wrap; gap: 14px; }
.dl-hero__media { position: relative; justify-self: end; width: min(440px, 100%); }
.dl-hero__portrait { margin: 0; position: relative; }
.dl-hero__portrait::before { content: ""; position: absolute; inset: 18px -18px -18px 18px; border: 1px solid var(--dl-gold); z-index: 0; }
.dl-hero__portrait img { position: relative; z-index: 1; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.dl-hero__portrait figcaption { position: relative; z-index: 1; margin-top: 30px; font-size: .9rem; color: var(--dl-ink-60); text-align: right; }
.dl-hero__book {
  position: absolute; z-index: 2; left: -64px; bottom: 56px; width: 150px;
  box-shadow: 0 18px 40px rgba(22,21,26,.28); transform: rotate(-4deg);
}
.dl-hero__book img { width: 100%; }
@media (max-width: 900px) {
  .dl-hero { padding: 48px 0 64px; }
  .dl-hero::before { width: 100%; top: auto; height: 46%; }
  .dl-hero__grid { grid-template-columns: 1fr; gap: 48px; }
  .dl-hero__media { justify-self: center; width: min(360px, 82%); }
  .dl-hero__book { left: -36px; width: 112px; bottom: 48px; }
}
@media (max-width: 600px) {
  /* Phone hero: H1, tagline and both buttons fit the first screen (greg-823). */
  .dl-hero { padding-top: 20px; }
  .dl-hero__title { font-size: 2.375rem; line-height: 1.1; margin-bottom: 16px; }
  .dl-hero__title:has(+ .dl-hero__sub) { margin-bottom: 10px; }
  .dl-hero__sub { font-size: 1.475rem; margin-bottom: 16px; }
  .dl-hero__lede { font-size: 1.0625rem; line-height: 1.55; margin-bottom: 22px; }
  .dl-hero__ctas { gap: 10px; }
}
@media (max-width: 480px) {
  .dl-hero__ctas .dl-btn { width: 100%; }
}

/* Facts strip */
.dl-facts { background: var(--dl-ink); color: #fff; }
.dl-facts__list { list-style: none; margin: 0 auto; display: grid; grid-template-columns: repeat(4, 1fr); }
.dl-fact { padding: 30px 24px; border-left: 1px solid rgba(255,255,255,.12); display: flex; flex-direction: column; gap: 4px; }
.dl-fact:first-child { border-left: 0; padding-left: 0; }
.dl-fact__big { font-family: var(--dl-display); font-size: 2.2rem; line-height: 1.1; color: var(--dl-gold); }
.dl-fact__small { font-size: .92rem; color: rgba(255,255,255,.78); }
@media (max-width: 800px) {
  .dl-facts__list { grid-template-columns: 1fr 1fr; }
  .dl-fact, .dl-fact:first-child { padding: 22px 16px; border-left: 0; border-top: 1px solid rgba(255,255,255,.12); }
  .dl-fact:nth-child(-n+2) { border-top: 0; }
  .dl-fact__big { font-size: 1.6rem; }
}

/* =========================================================
   Sections
   ========================================================= */
.dl-section { padding: 96px 0; }
.dl-section--tight { padding: 56px 0; }
.dl-section--alt { background: var(--dl-alt); }
.dl-section__head { max-width: 760px; margin-bottom: 48px; }
.dl-section__head--row { max-width: none; display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; }
.dl-section__title { margin-bottom: 16px; }
.dl-section__intro { font-size: 1.15rem; color: var(--dl-ink-60); }
@media (max-width: 700px) {
  .dl-section { padding: 64px 0; }
  .dl-section__head--row { flex-direction: column; align-items: flex-start; }
}

/* Practice cards */
.dl-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--dl-line); border: 1px solid var(--dl-line); }
.dl-card { background: #fff; padding: 36px 32px; display: flex; flex-direction: column; transition: background-color .2s ease; }
.dl-card:hover { background: var(--dl-crimson-tint); }
.dl-card__icon { width: 52px; height: 52px; display: grid; place-items: center; border: 1px solid var(--dl-gold); color: var(--dl-crimson); margin-bottom: 22px; }
.dl-card__icon .dl-icon { width: 24px; height: 24px; }
.dl-card__title { font-size: 1.55rem; margin-bottom: 10px; }
.dl-card__text { color: var(--dl-ink-60); flex: 1; }
.dl-card__more { display: inline-flex; align-items: center; gap: 8px; font-weight: 500; text-decoration: none; font-size: .95rem; margin-top: 8px; }
.dl-card__more .dl-icon { transition: transform .18s ease; }
.dl-card:hover .dl-card__more .dl-icon { transform: translateX(4px); }
@media (max-width: 960px) { .dl-cards { grid-template-columns: 1fr 1fr; } }
@media (max-width: 620px) { .dl-cards { grid-template-columns: 1fr; } .dl-card { padding: 28px 22px; } }

/* Firm */
.dl-firm__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: center; }
.dl-firm__figure { margin: 0; }
.dl-firm__figure { justify-self: center; width: min(440px, 100%); }
.dl-firm__figure img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: top center; }
/* Book cover over the "Who we are" photo, same treatment as the banner book (greg-919). */
.dl-firm__photo { position: relative; }
.dl-firm__book { position: absolute; z-index: 2; left: -56px; bottom: 40px; width: 140px; box-shadow: 0 18px 40px rgba(22,21,26,.28); transform: rotate(-4deg); }
.dl-firm__book img { width: 100%; aspect-ratio: auto; object-fit: fill; }
@media (max-width: 900px) { .dl-firm__book { left: -10px; width: 104px; bottom: 28px; } }
.dl-firm__figure figcaption, .dl-practice__figure figcaption { font-size: .88rem; color: var(--dl-ink-60); margin-top: 10px; }
.dl-offer { list-style: none; padding: 0; margin: 28px 0 32px; display: grid; grid-template-columns: 1fr 1fr; gap: 14px 24px; }
.dl-offer li { display: flex; gap: 10px; align-items: flex-start; font-weight: 500; color: var(--dl-ink); line-height: 1.4; }
.dl-offer .dl-icon { color: var(--dl-crimson); margin-top: 1px; }
@media (max-width: 900px) { .dl-firm__grid { grid-template-columns: 1fr; gap: 40px; } }
@media (max-width: 520px) { .dl-offer { grid-template-columns: 1fr; } }

/* Book band */
.dl-bookband { background: var(--dl-crimson); color: rgba(255,255,255,.88); }
.dl-bookband .dl-section__title { color: #fff; }
.dl-bookband__grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 64px; align-items: center; }
.dl-bookband__covers { list-style: none; margin: 0; padding: 0; display: flex; justify-content: flex-end; align-items: flex-end; gap: 14px; }
.dl-bookband__covers li { flex: 0 1 120px; box-shadow: 0 14px 30px rgba(0,0,0,.3); transition: transform .2s ease; }
.dl-bookband__covers li:nth-child(odd) { transform: translateY(-14px); }
.dl-bookband__covers li:hover { transform: translateY(-20px); }
.dl-bookband__covers img { width: 100%; aspect-ratio: 196 / 280; object-fit: cover; }
@media (max-width: 960px) {
  .dl-bookband__grid { grid-template-columns: 1fr; gap: 40px; }
  .dl-bookband__covers { justify-content: flex-start; flex-wrap: wrap; }
  .dl-bookband__covers li { flex-basis: calc(25% - 11px); }
}
@media (max-width: 520px) { .dl-bookband__covers li { flex-basis: calc(33.33% - 10px); } .dl-bookband__covers li:nth-child(odd) { transform: none; } }

/* Testimonials */
.dl-quote { margin: 0; position: relative; }
.dl-quote__mark { width: 40px; height: 40px; color: var(--dl-gold); margin-bottom: 10px; }
.dl-quote__title { font-family: var(--dl-sans); font-size: .8rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--dl-crimson); margin-bottom: 10px; }
.dl-quote__body { margin: 0 0 20px; font-family: var(--dl-serif); font-size: 1.35rem; line-height: 1.5; color: var(--dl-ink); }
.dl-quote__body p:last-child { margin-bottom: 0; }
.dl-quote__cite { display: flex; flex-direction: column; font-size: .95rem; }
.dl-quote__cite strong { font-weight: 500; color: var(--dl-ink); }
.dl-quote__cite span { color: var(--dl-ink-60); }
.dl-quote__disclaimer { margin: 18px 0 0; font-size: .8rem; color: var(--dl-ink-60); line-height: 1.5; }
.dl-quote--feature { text-align: center; }
.dl-quote--feature .dl-quote__mark { margin: 0 auto 14px; }
.dl-quote--feature .dl-quote__body { font-size: clamp(1.2rem, 2vw, 1.5rem); }
.dl-quote--feature .dl-quote__cite { align-items: center; }
.dl-quote--feature .dl-quote__disclaimer { max-width: 640px; margin-left: auto; margin-right: auto; }
.dl-quote--inline { margin-top: 48px; padding: 32px; background: var(--dl-alt); border-left: 3px solid var(--dl-crimson); }
.dl-page__aside .dl-quote, .dl-contact__aside .dl-quote { padding: 28px; background: var(--dl-alt); border-top: 3px solid var(--dl-crimson); }
.dl-page__aside .dl-quote__body, .dl-contact__aside .dl-quote__body { font-size: 1.15rem; }

/* Office */
.dl-office__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: center; }
.dl-office__figure { margin: 0; }
.dl-office__figure img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; object-position: center 35%; }
.dl-office__address { display: flex; gap: 10px; font-weight: 500; color: var(--dl-ink); }
.dl-office__address .dl-icon { color: var(--dl-crimson); margin-top: 3px; }
.dl-office__ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
@media (max-width: 900px) { .dl-office__grid { grid-template-columns: 1fr; gap: 36px; } }

/* Post cards */
.dl-postlist { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.dl-postcard { height: 100%; display: flex; flex-direction: column; padding: 28px; border: 1px solid var(--dl-line); border-top: 3px solid var(--dl-crimson); background: #fff; transition: box-shadow .2s ease; }
.dl-postcard:hover { box-shadow: var(--dl-shadow); }
.dl-postcard__meta { font-size: .85rem; color: var(--dl-ink-60); margin-bottom: 10px; }
.dl-postcard__title { font-size: 1.4rem; }
.dl-postcard__excerpt { color: var(--dl-ink-60); flex: 1; font-size: .98rem; }
.dl-postcard__more { display: inline-flex; align-items: center; gap: 8px; font-weight: 500; text-decoration: none; font-size: .95rem; }
@media (max-width: 960px) { .dl-postlist { grid-template-columns: 1fr 1fr; } }
@media (max-width: 620px) { .dl-postlist { grid-template-columns: 1fr; } }

/* Search + pagination */
.dl-search { display: flex; gap: 10px; max-width: 640px; margin-bottom: 40px; }
.dl-search input { flex: 1; min-width: 0; font: inherit; padding: 14px 16px; border: 1px solid #c9c5cb; border-radius: var(--dl-radius); }
.dl-search input:focus { outline: none; border-color: var(--dl-crimson); box-shadow: 0 0 0 3px var(--dl-crimson-tint); }
.dl-pagination { margin-top: 48px; display: flex; flex-wrap: wrap; gap: 6px; }
.dl-pagination .page-numbers { display: inline-flex; min-width: 44px; height: 44px; align-items: center; justify-content: center; padding: 0 12px; border: 1px solid var(--dl-line); text-decoration: none; color: var(--dl-ink); }
.dl-pagination .page-numbers.current { background: var(--dl-crimson); border-color: var(--dl-crimson); color: #fff; }
.dl-pagination a.page-numbers:hover { border-color: var(--dl-crimson); color: var(--dl-crimson); }

/* =========================================================
   Inner pages
   ========================================================= */
.dl-pagehead { background: var(--dl-alt); border-bottom: 1px solid var(--dl-line); padding: 64px 0 56px; position: relative; }
.dl-pagehead::after { content: ""; position: absolute; left: 0; bottom: -1px; width: 120px; height: 3px; background: var(--dl-crimson); }
.dl-pagehead__inner { max-width: var(--dl-max); }
.dl-pagehead__title { max-width: 18em; margin-bottom: 14px; font-size: clamp(2.3rem, 4.4vw, 3.6rem); }
.dl-pagehead__lede { font-size: 1.2rem; color: var(--dl-ink-60); max-width: 40em; margin: 0; }
.dl-pagehead__ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.dl-pagehead__icon { display: inline-grid; place-items: center; width: 56px; height: 56px; border: 1px solid var(--dl-gold); color: var(--dl-crimson); background: #fff; margin-bottom: 20px; }
.dl-pagehead__icon .dl-icon { width: 26px; height: 26px; }
.dl-crumbs { display: flex; gap: 8px; font-size: .88rem; color: var(--dl-ink-60); margin-bottom: 22px; }
.dl-crumbs a { color: var(--dl-ink-60); text-decoration: none; }
.dl-crumbs a:hover { color: var(--dl-crimson); text-decoration: underline; }
@media (max-width: 600px) { .dl-pagehead { padding: 44px 0 40px; } .dl-pagehead__ctas .dl-btn { width: 100%; } }

.dl-page { padding-top: 64px; padding-bottom: 80px; }
.dl-page--with-aside { display: grid; grid-template-columns: minmax(0, var(--dl-text)) 340px; gap: 72px; justify-content: space-between; }
.dl-page--columns .dl-prose { max-width: none; }
.dl-prose--columns { columns: 2 340px; column-gap: 64px; }
.dl-prose--columns h2, .dl-prose--columns h3 { break-after: avoid; }
.dl-prose--columns p { break-inside: avoid; }
@media (max-width: 960px) { .dl-page--with-aside { grid-template-columns: 1fr; gap: 40px; } }

.dl-prose { max-width: var(--dl-text); }
.dl-prose > *:first-child { margin-top: 0; }
.dl-prose h2 { font-size: clamp(1.7rem, 2.6vw, 2.2rem); margin-top: 1.6em; }
.dl-prose h3 { margin-top: 1.5em; }
.dl-prose h4 { margin-top: 1.4em; }
.dl-prose ul, .dl-prose ol { margin: 0 0 1.2em; padding-left: 1.3em; }
.dl-prose li { margin-bottom: .4em; }
.dl-prose li::marker { color: var(--dl-crimson); }
.dl-prose blockquote { margin: 1.6em 0; padding: 4px 0 4px 24px; border-left: 3px solid var(--dl-gold); font-family: var(--dl-serif); font-size: 1.25rem; color: var(--dl-ink); }
.dl-prose img { margin: 1.4em 0; }
.dl-prose .alignleft { float: left; margin: .4em 28px 1em 0; max-width: 45%; }
.dl-prose .alignright { float: right; margin: .4em 0 1em 28px; max-width: 45%; }
.dl-prose .aligncenter { margin-left: auto; margin-right: auto; }
.dl-prose .wp-caption-text { font-size: .88rem; color: var(--dl-ink-60); }
.dl-prose::after { content: ""; display: table; clear: both; }
.dl-prose table { border-collapse: collapse; width: 100%; margin: 1.4em 0; font-size: .95rem; }
.dl-prose th, .dl-prose td { border: 1px solid var(--dl-line); padding: 10px 12px; text-align: left; }
@media (max-width: 600px) { .dl-prose .alignleft, .dl-prose .alignright { float: none; margin: 1.2em 0; max-width: 100%; } }

/* Practice area */
.dl-practice { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 72px; padding-top: 64px; padding-bottom: 88px; }
.dl-practice__figure { margin: 0 0 36px; }
.dl-practice__figure img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.dl-practice__aside { display: flex; flex-direction: column; gap: 24px; }
.dl-checklist { border: 1px solid var(--dl-line); border-top: 3px solid var(--dl-crimson); padding: 28px; background: #fff; }
.dl-checklist__title { font-size: 1.4rem; margin-bottom: 16px; }
.dl-checklist ul { list-style: none; margin: 0; padding: 0; }
.dl-checklist li { position: relative; padding: 9px 0 9px 26px; border-top: 1px solid var(--dl-line); line-height: 1.45; font-size: .98rem; }
.dl-checklist li:first-child { border-top: 0; }
.dl-checklist li::before { content: ""; position: absolute; left: 2px; top: 17px; width: 9px; height: 9px; border: 1.5px solid var(--dl-gold); transform: rotate(45deg); }
@media (min-width: 961px) { .dl-practice__aside { position: sticky; top: 100px; align-self: start; } }
@media (max-width: 960px) { .dl-practice { grid-template-columns: 1fr; gap: 40px; } }

.dl-related { padding-top: 72px; }
.dl-related__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.dl-related__list a { display: flex; align-items: center; gap: 12px; padding: 18px 20px; border: 1px solid var(--dl-line); text-decoration: none; color: var(--dl-ink); font-weight: 500; transition: border-color .18s ease, background-color .18s ease; }
.dl-related__list a > .dl-icon:first-child { color: var(--dl-crimson); }
.dl-related__list a:hover { border-color: var(--dl-crimson); background: var(--dl-crimson-tint); }
.dl-related__arrow { margin-left: auto; color: var(--dl-ink-60); }
@media (max-width: 900px) { .dl-related__list { grid-template-columns: 1fr; } }

/* Consultation band */
.dl-consult { background: var(--dl-ink); color: rgba(255,255,255,.82); padding: 96px 0; }
.dl-consult h2 { color: #fff; }
.dl-consult__grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 72px; align-items: start; }
.dl-consult__phone { display: inline-flex; align-items: center; gap: 12px; font-family: var(--dl-display); font-size: 2rem; color: #fff; text-decoration: none; margin: 10px 0 16px; }
.dl-consult__phone .dl-icon { color: var(--dl-gold); width: 26px; height: 26px; }
.dl-consult__phone:hover { color: var(--dl-gold); }
.dl-consult__address { display: flex; gap: 10px; font-size: .95rem; }
.dl-consult__address .dl-icon { color: var(--dl-gold); margin-top: 3px; }
.dl-consult__form { background: #fff; color: var(--dl-ink-80); padding: 36px; border-top: 3px solid var(--dl-gold); }
@media (max-width: 900px) { .dl-consult { padding: 64px 0; } .dl-consult__grid { grid-template-columns: 1fr; gap: 36px; } .dl-consult__form { padding: 24px 20px; } }

/* Forms (WPForms Lite, restyled to the palette) */
.dl-form .wpforms-container { margin: 0 !important; }
.dl-form .wpforms-field { padding: 0 0 18px !important; }
.dl-form .wpforms-field-label { font: 500 .95rem/1.3 var(--dl-sans) !important; color: var(--dl-ink) !important; margin-bottom: 8px !important; }
.dl-form .wpforms-required-label { color: var(--dl-crimson) !important; }
.dl-form input[type="text"], .dl-form input[type="email"], .dl-form input[type="tel"], .dl-form select, .dl-form textarea {
  width: 100% !important; max-width: 100% !important;
  font: 400 1rem/1.4 var(--dl-sans) !important; color: var(--dl-ink) !important;
  background: #fff !important; border: 1px solid #c9c5cb !important; border-radius: var(--dl-radius) !important;
  padding: 13px 14px !important; height: auto !important; box-shadow: none !important;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.dl-form textarea { min-height: 140px !important; }
.dl-form select { appearance: none !important; -webkit-appearance: none !important; padding-right: 42px !important; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23801235' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center !important; }
.dl-form input:focus, .dl-form select:focus, .dl-form textarea:focus { outline: none !important; border-color: var(--dl-crimson) !important; box-shadow: 0 0 0 3px var(--dl-crimson-tint) !important; }
.dl-form .wpforms-field-sublabel { font-size: .8rem !important; color: var(--dl-ink-60) !important; }
.dl-form .wpforms-error, .dl-form label.wpforms-error { color: #b42318 !important; font-size: .85rem !important; }
.dl-form input.wpforms-error, .dl-form textarea.wpforms-error { border-color: #b42318 !important; }
.dl-form .wpforms-submit-container { padding-top: 6px !important; }
.dl-form button[type="submit"], .dl-form .wpforms-submit {
  background: var(--dl-crimson) !important; color: #fff !important; border: 0 !important; border-radius: var(--dl-radius) !important;
  font: 500 1.05rem/1 var(--dl-sans) !important; padding: 18px 28px !important; height: auto !important; cursor: pointer; width: 100%;
  transition: background-color .18s ease;
}
.dl-form button[type="submit"]:hover, .dl-form .wpforms-submit:hover { background: var(--dl-crimson-deep) !important; }
.dl-form .wpforms-field-row { max-width: none !important; }
.dl-form .wpforms-confirmation-container-full { background: var(--dl-crimson-tint) !important; border: 1px solid var(--dl-crimson) !important; color: var(--dl-ink) !important; }
.dl-form__note { font-size: .82rem; color: var(--dl-ink-60); margin: 16px 0 0; line-height: 1.5; }

/* Contact */
.dl-contact { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 72px; padding-top: 64px; padding-bottom: 72px; }
.dl-contact__aside { display: flex; flex-direction: column; gap: 24px; }
.dl-office-card { padding: 30px; border: 1px solid var(--dl-line); border-top: 3px solid var(--dl-crimson); }
.dl-office-card h2 { font-size: 1.6rem; }
.dl-office-card__row { display: flex; gap: 12px; }
.dl-office-card__row .dl-icon { color: var(--dl-crimson); margin-top: 4px; }
.dl-office-card__row a { font-weight: 500; }
.dl-office-card__area { font-size: .92rem; color: var(--dl-ink-60); margin: 0; padding-top: 14px; border-top: 1px solid var(--dl-line); }
.dl-map__frame { height: 420px; }
.dl-map__frame iframe { width: 100%; height: 100%; border: 0; display: block; }
@media (max-width: 960px) { .dl-contact { grid-template-columns: 1fr; gap: 40px; } .dl-map__frame { height: 320px; } }

/* Team */
.dl-team { padding-top: 24px; }
.dl-team + .dl-team { padding-top: 0; }
.dl-team__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px 28px; }
.dl-person__photo { aspect-ratio: 4 / 5; background: var(--dl-alt); overflow: hidden; margin-bottom: 18px; position: relative; }
.dl-person__photo::after { content: ""; position: absolute; left: 0; bottom: 0; width: 48px; height: 3px; background: var(--dl-crimson); }
.dl-person__photo img { width: 100%; height: 100%; object-fit: cover; object-position: top center; }
.dl-person__initials { display: grid; place-items: center; height: 100%; font-family: var(--dl-display); font-size: 4rem; color: var(--dl-gold); }
.dl-person__name { font-size: 1.45rem; margin-bottom: 2px; }
.dl-person__role { color: var(--dl-ink-60); margin-bottom: 10px; font-size: .95rem; }
.dl-person__phone { display: inline-flex; align-items: center; gap: 8px; font-size: .92rem; text-decoration: none; font-weight: 500; }
.dl-team--staff .dl-team__grid { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1000px) { .dl-team__grid, .dl-team--staff .dl-team__grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 720px) { .dl-team__grid, .dl-team--staff .dl-team__grid { grid-template-columns: 1fr 1fr; gap: 32px 16px; } .dl-person__name { font-size: 1.2rem; } }

/* Books */
.dl-books { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 36px 56px; }
.dl-book { display: grid; grid-template-columns: 150px 1fr; gap: 28px; padding-bottom: 36px; border-bottom: 1px solid var(--dl-line); }
.dl-book__cover img { width: 100%; box-shadow: 0 10px 24px rgba(22,21,26,.18); }
.dl-book__title { font-size: 1.45rem; }
.dl-book__desc { color: var(--dl-ink-60); font-size: .98rem; }
@media (max-width: 900px) { .dl-books { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .dl-book { grid-template-columns: 96px 1fr; gap: 18px; } }

/* Article */
.dl-pagehead--article .dl-pagehead__title { max-width: none; font-size: clamp(2rem, 4vw, 3rem); }
.dl-article__meta { display: flex; gap: 10px; color: var(--dl-ink-60); font-size: .95rem; margin: 0; }
.dl-article .dl-container--text { padding-top: 48px; }
.dl-article__figure { margin: 0 0 36px; }
.dl-article__figure img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.dl-article .dl-prose { font-size: 1.1rem; }
.dl-article__disclaimer { font-size: .88rem; color: var(--dl-ink-60); border-top: 1px solid var(--dl-line); padding-top: 18px; margin-top: 40px; }
.dl-article__nav { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 32px 0 80px; }
.dl-article__navlink { display: flex; flex-direction: column; gap: 4px; padding: 18px 20px; border: 1px solid var(--dl-line); text-decoration: none; color: var(--dl-ink); }
.dl-article__navlink small { color: var(--dl-ink-60); }
.dl-article__navlink span { font-family: var(--dl-display); font-size: 1.15rem; line-height: 1.3; }
.dl-article__navlink--next { text-align: right; grid-column: 2; }
.dl-article__navlink:hover { border-color: var(--dl-crimson); }
@media (max-width: 600px) { .dl-article__nav { grid-template-columns: 1fr; } .dl-article__navlink--next { grid-column: auto; text-align: left; } }

/* =========================================================
   Footer
   ========================================================= */
.dl-footer { background: var(--dl-ink); color: rgba(255,255,255,.72); padding: 80px 0 32px; font-size: .95rem; border-top: 3px solid var(--dl-crimson); }
.dl-footer a { color: rgba(255,255,255,.86); text-decoration: none; }
.dl-footer a:hover { color: var(--dl-gold); }
.dl-footer__grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1.2fr; gap: 48px; padding-bottom: 48px; border-bottom: 1px solid rgba(255,255,255,.12); }
.dl-footer__name { font-family: var(--dl-display); font-size: 1.6rem; color: #fff; margin-bottom: 6px; line-height: 1.2; }
.dl-footer__tag { font-family: var(--dl-display); font-weight: 500; font-size: 1.1rem; color: var(--dl-gold); margin-bottom: 24px; }
.dl-footer__h { font-family: var(--dl-display); font-size: .8rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--dl-gold); margin-bottom: 18px; }
.dl-footer__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.dl-footer__list--icons li { display: flex; gap: 10px; }
.dl-footer__list--icons .dl-icon { color: var(--dl-gold); margin-top: 4px; }
.dl-footer__list small { color: rgba(255,255,255,.55); }
.dl-footer__disclaimer { font-size: .84rem; color: rgba(255,255,255,.55); margin: 28px 0 0; max-width: 820px; }
.dl-footer__disclaimer a { text-decoration: underline; }
.dl-footer__legal { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; margin-top: 20px; font-size: .84rem; color: rgba(255,255,255,.55); }
@media (max-width: 960px) { .dl-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .dl-footer { padding-top: 56px; } .dl-footer__grid { grid-template-columns: 1fr; gap: 36px; } }

/* =========================================================
   Home page 2: $100 Attorney Consultation (top bar + callout)
   ========================================================= */
.dl-offerbar { background: var(--dl-ink); color: var(--dl-cream); font-size: .9rem; border-bottom: 1px solid rgba(193,154,75,.45); }
.dl-offerbar__link {
  display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 4px 14px;
  padding-top: 10px; padding-bottom: 10px; color: inherit; text-decoration: none; text-align: center; letter-spacing: .01em;
}
.dl-offerbar__link:hover, .dl-offerbar__link:focus-visible { color: #fff; }
.dl-offerbar__link:hover .dl-offerbar__tail { text-decoration: underline; text-decoration-color: var(--dl-gold); }
.dl-offerbar .dl-price { font-family: var(--dl-display); font-size: 1.3em; font-weight: 600; color: var(--dl-gold); line-height: 1; padding: 0 1px; }
.dl-offerbar__sep { width: 4px; height: 4px; border-radius: 50%; background: var(--dl-gold); }
.dl-offerbar__tail { display: inline-flex; align-items: center; gap: 6px; font-weight: 500; }
.dl-offerbar__tail .dl-icon { width: 15px; height: 15px; color: var(--dl-gold); transition: transform .18s ease; }
.dl-offerbar__link:hover .dl-offerbar__tail .dl-icon { transform: translateX(3px); }
.dl-offerbar__main--narrow { display: none; }
@media (max-width: 600px) {
  .dl-offerbar { font-size: .84rem; }
  .dl-offerbar__link { padding-top: 9px; padding-bottom: 9px; gap: 2px 10px; }
  .dl-offerbar__main--wide { display: none; }
  .dl-offerbar__main--narrow { display: inline; }
  .dl-offerbar__sep { display: none; }
  .dl-offerbar__main, .dl-offerbar__tail { flex-basis: 100%; justify-content: center; }
  .dl-has-offerbar .dl-nav { padding-top: 136px; }
}

.dl-offer100 { position: relative; z-index: 1; margin-top: -56px; }
.dl-has-offerbar .dl-hero { padding-bottom: 64px; }
@media (max-width: 900px) { .dl-has-offerbar .dl-hero { padding-bottom: 72px; } }
.dl-offer100__panel {
  display: grid; grid-template-columns: .95fr 1.35fr auto; gap: 48px; align-items: start;
  background: var(--dl-cream); border: 1px solid #ebe1cc; border-top: 3px solid var(--dl-gold);
  padding: 44px 48px; box-shadow: var(--dl-shadow);
}
.dl-offer100__title { font-size: clamp(1.9rem, 2.8vw, 2.5rem); line-height: 1.1; color: var(--dl-crimson); margin: 0 0 12px; }
.dl-offer100__title .dl-price { display: block; font-size: 1.6em; line-height: 1; letter-spacing: -.01em; margin-bottom: 4px; }
.dl-offer100__benefit {
  display: inline-flex; align-items: center; gap: 10px; margin: 0;
  font-size: .8rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--dl-gold-text);
}
.dl-offer100__benefit::before { content: ""; width: 28px; height: 1px; background: var(--dl-gold); }
.dl-offer100__cta { align-self: center; }
.dl-offer100__copy { border-left: 1px solid #e2d6bd; padding-left: 40px; }
.dl-offer100__heading { font-family: var(--dl-display); font-size: 1.45rem; line-height: 1.25; color: var(--dl-ink); margin-bottom: 10px; }
.dl-offer100__copy p:not(.dl-offer100__heading) { color: var(--dl-ink-60); }
.dl-offer100__copy p:last-child { margin-bottom: 0; }
.dl-offer100__terms { font-family: var(--dl-display); font-weight: 500; font-size: 1.12rem; color: var(--dl-ink-80) !important; }
@media (max-width: 1080px) {
  .dl-offer100__panel { grid-template-columns: 1fr 1.4fr; gap: 32px 40px; }
  .dl-offer100__cta { grid-column: 1 / -1; }
}
@media (max-width: 900px) { .dl-offer100 { margin-top: -40px; } }
@media (max-width: 700px) {
  .dl-offer100__panel { grid-template-columns: 1fr; padding: 32px 24px; gap: 24px; }
  .dl-offer100__copy { border-left: 0; padding-left: 0; border-top: 1px solid #e2d6bd; padding-top: 24px; }
  .dl-offer100__cta .dl-btn { width: 100%; white-space: normal; }
}
.dl-offer100 + .dl-facts { margin-top: 64px; }
@media (max-width: 700px) { .dl-offer100 + .dl-facts { margin-top: 48px; } }
