/* ==========================================================================
   DAL | Aequitas Law - shared design system
   Extracted verbatim from the approved homepage. Every page links this file,
   so the visual language stays identical across the site and a change is made
   once. All rules are scoped under #dal-home.
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;0,600;1,400;1,500&family=DM+Sans:wght@400;500;700&display=swap');

/* ==========================================================================
   TOKENS
   ========================================================================== */
#dal-home {
  /* warm ink family — the "dark" is warm charcoal, not navy */
  --dal-ink: #16120F;
  --dal-ink-2: #241D17;
  --dal-ink-3: #3A312A;

  /* DAL brand tones, retained inside the warmer system */
  --dal-navy: #2E3D5E;
  --dal-navy-deep: #22304A;
  --dal-gold: #CEA23D;

  /* brass accents.
     --dal-brass       decorative only (rules, dots, borders)
     --dal-brass-text  small text on light grounds — calibrated against the
                       DARKEST light ground (stone #EDE6DA) so it passes AA
                       on every section, not just the palest ones
     --dal-brass-num   large display numerals on light grounds (AA large, 3:1)
     --dal-brass-light for text on the dark grounds */
  --dal-brass: #B58B4C;
  --dal-brass-text: #7A5D28;
  --dal-brass-num: #96733A;
  --dal-brass-light: #D9B45F;

  /* grounds */
  --dal-white: #FFFFFF;
  --dal-cream: #FCF9F4;
  --dal-ivory: #F7F3EC;
  --dal-stone: #EDE6DA;
  --dal-line: #DDD4C5;
  --dal-line-dark: rgba(255,255,255,.16);

  /* ---- supporting "people-centred" palette ----------------------------
     Secondary emotional-support tones. These are SECTION GROUNDS and small
     accents only — never the brand. DAL navy + gold stay the identity.
     Text tones (-ink suffix) are darkened from the client's swatches so
     body copy clears AA on the matching ground; the raw swatch values are
     kept for fills, rules and borders. */
  --dal-charcoal: #363A3D;
  --dal-sage: #8C9A82;
  --dal-sage-light: #E5EAE1;
  --dal-sage-ink: #4A5543;      /* AA body text on --dal-sage-light */
  --dal-moss: #68755D;
  --dal-moss-ink: #5A6650;      /* AA small text on --dal-sage-light (moss is 4.01, fails) */
  --dal-slate: #7D8FA3;
  --dal-slate-light: #E7ECF0;
  --dal-slate-ink: #435465;     /* AA body text on --dal-slate-light */
  --dal-teal: #668E8A;
  --dal-teal-ink: #3D5B58;
  --dal-deep-slate: #2B3A46;    /* statement anchor: navy-compatible, softer than near-black */

  /* text */
  --dal-body: #6E6459;
  --dal-body-dark: rgba(255,255,255,.72);

  --dal-display: 'Lora', Georgia, 'Times New Roman', serif;
  --dal-sans: 'DM Sans', 'Segoe UI', system-ui, -apple-system, sans-serif;

  --dal-shell: 1280px;
  --dal-gut: 40px;
  --dal-ease: cubic-bezier(.22,.61,.36,1);
  --dal-ease-out: cubic-bezier(.16,1,.3,1);

  font-family: var(--dal-sans);
  font-size: 17px;
  line-height: 1.75;
  color: var(--dal-body);
  background: var(--dal-white);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: clip;
  position: relative;
}

/* :where() keeps these base defaults at zero specificity, so component and
   section rules override them without needing to be boosted individually. */
#dal-home *, #dal-home *::before, #dal-home *::after { box-sizing: border-box; }
#dal-home img { max-width: 100%; display: block; }
:where(#dal-home) a { color: inherit; text-decoration: none; }
:where(#dal-home) ul, :where(#dal-home) ol { list-style: none; margin: 0; padding: 0; }
#dal-home button { font-family: inherit; cursor: pointer; }
:where(#dal-home) h1, :where(#dal-home) h2, :where(#dal-home) h3,
:where(#dal-home) h4, :where(#dal-home) h5 {
  font-family: var(--dal-display);
  font-weight: 500;
  color: var(--dal-ink);
  letter-spacing: -0.02em;
  line-height: 1.12;
  margin: 0;
}
:where(#dal-home) p { margin: 0 0 1.1em; }
#dal-home p:last-child { margin-bottom: 0; }

#dal-home a:focus-visible,
#dal-home button:focus-visible,
#dal-home input:focus-visible,
#dal-home select:focus-visible,
#dal-home textarea:focus-visible,
#dal-home [tabindex]:focus-visible {
  outline: 2px solid var(--dal-brass);
  outline-offset: 4px;
}

.dal-shell {
  width: 100%;
  max-width: var(--dal-shell);
  margin: 0 auto;
  padding: 0 var(--dal-gut);
}
@media (max-width: 700px) { #dal-home { --dal-gut: 22px; } }

/* ---- shared type ---- */
.dal-label {
  display: inline-flex; align-items: center; gap: 12px;
  font-family: var(--dal-sans);
  font-size: 12px; font-weight: 700;
  letter-spacing: .2em; text-transform: uppercase;
  color: var(--dal-brass-text);
  margin: 0 0 26px;
}
.dal-label::before {
  content: ""; width: 34px; height: 1px; background: var(--dal-brass); flex-shrink: 0;
}
.dal-label-dark { color: var(--dal-brass-light); }
.dal-label-dark::before { background: var(--dal-brass-light); }

.dal-display {
  font-size: clamp(2.6rem, 5.4vw, 4.6rem);
  line-height: 1.06;
  letter-spacing: -0.028em;
}
.dal-h2 {
  font-size: clamp(2rem, 3.7vw, 3.35rem);
  line-height: 1.1;
}
.dal-lead {
  font-size: 18.5px; line-height: 1.8; color: var(--dal-body); max-width: 56ch;
}
.dal-em { font-style: italic; font-weight: 400; }

/* ---- links & buttons: square, editorial ---- */
.dal-btn {
  position: relative; display: inline-flex; align-items: center; justify-content: center;
  gap: 14px; padding: 19px 38px; border: 1px solid transparent; border-radius: 0;
  font-family: var(--dal-sans); font-size: 13px; font-weight: 700;
  letter-spacing: .14em; text-transform: uppercase; overflow: hidden;
  transition: color .5s var(--dal-ease), border-color .5s var(--dal-ease);
  text-align: center; white-space: normal;
}
.dal-btn > span { position: relative; z-index: 2; }
.dal-btn svg { position: relative; z-index: 2; flex-shrink: 0; transition: transform .5s var(--dal-ease); }
.dal-btn::before {
  content: ""; position: absolute; inset: 0; z-index: 1;
  transform: scaleX(0); transform-origin: right center;
  transition: transform .5s var(--dal-ease);
}
.dal-btn:hover::before, .dal-btn:focus-visible::before { transform: scaleX(1); transform-origin: left center; }
.dal-btn:hover svg { transform: translateX(6px); }

.dal-btn-solid { background: var(--dal-ink); color: var(--dal-white); }
.dal-btn-solid::before { background: var(--dal-brass); }
.dal-btn-solid:hover, .dal-btn-solid:focus-visible { color: var(--dal-ink); }

.dal-btn-line { background: transparent; color: var(--dal-ink); border-color: var(--dal-line); }
.dal-btn-line::before { background: var(--dal-ink); }
.dal-btn-line:hover, .dal-btn-line:focus-visible { color: var(--dal-white); border-color: var(--dal-ink); }

.dal-btn-onDark { background: transparent; color: var(--dal-white); border-color: rgba(255,255,255,.34); }
.dal-btn-onDark::before { background: var(--dal-white); }
.dal-btn-onDark:hover, .dal-btn-onDark:focus-visible { color: var(--dal-ink); border-color: var(--dal-white); }

.dal-btn-brass { background: var(--dal-brass); color: var(--dal-ink); }
.dal-btn-brass::before { background: var(--dal-ink); }
.dal-btn-brass:hover, .dal-btn-brass:focus-visible { color: var(--dal-white); }

/* text link with underline reveal */
.dal-tlink {
  position: relative; display: inline-flex; align-items: center; gap: 11px;
  font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: var(--dal-ink); padding-bottom: 8px;
}
.dal-tlink::after {
  content: ""; position: absolute; left: 0; bottom: 0; height: 1px; width: 100%;
  background: currentColor; transform: scaleX(1); transform-origin: right center;
  transition: transform .5s var(--dal-ease);
}
.dal-tlink:hover::after, .dal-tlink:focus-visible::after {
  transform: scaleX(0); transform-origin: right center;
}
.dal-tlink svg { transition: transform .5s var(--dal-ease); }
.dal-tlink:hover svg { transform: translateX(6px); }
.dal-tlink-dark { color: var(--dal-white); }

/* ---- section rhythm ---- */
.dal-sec { padding: clamp(80px, 10vw, 150px) 0; position: relative; }
.dal-sec-ivory { background: var(--dal-ivory); }
.dal-sec-cream { background: var(--dal-cream); }
.dal-sec-stone { background: var(--dal-stone); }
.dal-sec-ink { background: var(--dal-ink); color: var(--dal-body-dark); }
.dal-sec-ink h2, .dal-sec-ink h3, .dal-sec-ink h4 { color: var(--dal-white); }
/* supporting grounds — used to build the section rhythm, not to recolour DAL */
.dal-sec-sage { background: var(--dal-sage-light); color: var(--dal-sage-ink); }
.dal-sec-slate { background: var(--dal-slate-light); color: var(--dal-slate-ink); }

/* ==========================================================================
   GUIDED LEGAL EXPLORER — alternative to the accordion.
   One DOM, two behaviours:
     >=768px  two-column explorer: topic list left, contextual panel right.
              All six panels occupy the SAME grid cell (col 2 / rows 1-6), so
              the grid always sizes to the tallest panel. The left column's
              rhythm therefore never reflows when the topic changes.
     <768px   editorial expandable rows, one open at a time.
   Colour, type and spacing all come from the locked homepage system.
   ========================================================================== */
.dal-explore { background: var(--dal-sage-light); padding: clamp(88px, 11vw, 150px) 0; }
.dal-explore-head { max-width: 62ch; margin-bottom: clamp(52px, 6vw, 90px); }
.dal-explore-head h2 { color: var(--dal-ink); margin-bottom: 18px; }
.dal-explore-head p { color: var(--dal-sage-ink); font-size: 17.5px; line-height: 1.85; }
.dal-explore-hint {
  display: inline-flex; align-items: center; gap: 10px; margin-top: 22px;
  font-size: 14px; font-style: italic; font-family: var(--dal-display);
  color: var(--dal-moss-ink);
}
.dal-explore-hint svg { flex-shrink: 0; }

.dal-xp { position: relative; }

/* ---------- topic control ---------- */
.dal-xp-item {
  position: relative; width: 100%; background: none; border: none; text-align: left;
  display: grid; grid-template-columns: auto 1fr auto; align-items: baseline;
  gap: 0 20px; padding: 22px 4px 22px 22px; color: var(--dal-ink);
  border-bottom: 1px solid rgba(104,117,93,.26);
  transition: color .4s var(--dal-ease);
}
.dal-xp-item::before {
  content: ""; position: absolute; left: 0; top: 50%; width: 2px; height: 0;
  background: var(--dal-moss); transform: translateY(-50%);
  transition: height .45s var(--dal-ease);
}
.dal-xp-n {
  font-family: var(--dal-sans); font-size: 11.5px; font-weight: 700;
  letter-spacing: .16em; color: var(--dal-moss-ink); transition: color .4s var(--dal-ease);
}
.dal-xp-t {
  font-family: var(--dal-display); font-size: clamp(1.18rem, 1.65vw, 1.4rem);
  font-weight: 500; letter-spacing: -0.015em; line-height: 1.3;
  transition: transform .45s var(--dal-ease);
}
.dal-xp-arrow {
  color: var(--dal-moss); opacity: 0; transform: translateX(-6px);
  transition: opacity .4s var(--dal-ease), transform .45s var(--dal-ease);
}
.dal-xp-item:hover .dal-xp-t, .dal-xp-item:focus-visible .dal-xp-t { transform: translateX(4px); }
.dal-xp-item:hover .dal-xp-arrow, .dal-xp-item:focus-visible .dal-xp-arrow { opacity: .65; transform: none; }
.dal-xp-item[aria-expanded="true"] { color: var(--dal-navy); }
.dal-xp-item[aria-expanded="true"]::before { height: 62%; }
.dal-xp-item[aria-expanded="true"] .dal-xp-n { color: var(--dal-navy); }
.dal-xp-item[aria-expanded="true"] .dal-xp-t { font-weight: 600; transform: translateX(4px); }
.dal-xp-item[aria-expanded="true"] .dal-xp-arrow { opacity: 1; transform: none; }

/* ---------- contextual panel ---------- */
.dal-xp-cat {
  font-family: var(--dal-sans); font-size: 11px; font-weight: 700;
  letter-spacing: .2em; text-transform: uppercase; color: var(--dal-moss-ink);
  margin: 0 0 16px;
}
.dal-xp-panel h3 {
  font-size: clamp(1.7rem, 2.6vw, 2.35rem); color: var(--dal-ink);
  line-height: 1.14; margin-bottom: 20px;
}
.dal-xp-lead { font-size: 17px; line-height: 1.85; color: var(--dal-sage-ink); max-width: 52ch; margin-bottom: 30px; }
.dal-xp-sub {
  font-family: var(--dal-sans); font-size: 11px; font-weight: 700;
  letter-spacing: .18em; text-transform: uppercase; color: var(--dal-moss-ink);
  margin: 0 0 14px; padding-top: 22px; border-top: 1px solid rgba(104,117,93,.26);
}
.dal-xp-list { margin: 0 0 32px; }
.dal-xp-list li {
  position: relative; padding: 7px 0 7px 24px; font-size: 16px; color: var(--dal-sage-ink);
}
.dal-xp-list li::before {
  content: ""; position: absolute; left: 0; top: 18px; width: 10px; height: 1px; background: var(--dal-gold);
}

/* ---------- desktop explorer ---------- */
@media (min-width: 768px) {
  .dal-xp {
    display: grid;
    grid-template-columns: 38% 1fr;
    column-gap: clamp(44px, 6vw, 96px);
    align-items: start;
  }
  .dal-xp-row { display: contents; }
  .dal-xp-item { grid-column: 1; align-self: start; }
  .dal-xp-panel {
    grid-column: 2; grid-row: 1 / span 6; align-self: start;
    position: relative; z-index: 1;
    opacity: 0; visibility: hidden; transform: translateY(10px);
    transition: opacity .32s var(--dal-ease), transform .38s var(--dal-ease), visibility .32s;
  }
  .dal-xp-panel.dal-on { opacity: 1; visibility: visible; transform: none; }
  .dal-xp-toggle { display: none; }
  .dal-xp-ghost {
    position: absolute; right: 0; top: -18px; z-index: 0; pointer-events: none;
    font-family: var(--dal-display); font-weight: 500; font-size: clamp(140px, 15vw, 230px);
    line-height: .8; letter-spacing: -0.05em; color: var(--dal-moss);
    opacity: .07;
  }
}

/* ---------- mobile: editorial expandable rows ---------- */
@media (max-width: 767px) {
  .dal-xp-ghost { display: none; }
  .dal-xp-item { padding: 20px 0 20px 14px; align-items: center; }
  .dal-xp-item::before { left: 0; }
  .dal-xp-arrow { display: none; }
  .dal-xp-toggle { position: relative; width: 26px; height: 26px; flex-shrink: 0; }
  .dal-xp-toggle::before, .dal-xp-toggle::after {
    content: ""; position: absolute; top: 50%; left: 50%; background: var(--dal-moss);
    transform: translate(-50%,-50%); transition: transform .4s var(--dal-ease);
  }
  .dal-xp-toggle::before { width: 13px; height: 1.5px; }
  .dal-xp-toggle::after { width: 1.5px; height: 13px; }
  .dal-xp-item[aria-expanded="true"] .dal-xp-toggle::after { transform: translate(-50%,-50%) rotate(90deg); }
  .dal-xp-panel {
    display: grid; grid-template-rows: 0fr;
    transition: grid-template-rows .5s var(--dal-ease);
    border-bottom: 1px solid rgba(104,117,93,.26);
  }
  .dal-xp-panel.dal-on { grid-template-rows: 1fr; }
  .dal-xp-panel > div { overflow: hidden; }
  .dal-xp-inner { padding: 6px 0 30px 14px; }
  .dal-xp-panel h3 { font-size: 1.35rem; margin-bottom: 14px; }
  .dal-xp-lead { font-size: 16px; margin-bottom: 22px; }
  .dal-xp-sub { padding-top: 18px; }
}

@media (prefers-reduced-motion: reduce) {
  .dal-xp-item, .dal-xp-item::before, .dal-xp-t, .dal-xp-arrow, .dal-xp-n,
  .dal-xp-panel, .dal-xp-toggle::before, .dal-xp-toggle::after {
    transition: none !important;
  }
  .dal-xp-panel { transform: none !important; }
}

/* forward step inside a panel — text link, never a button */
.dal-acc-go {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--dal-sans); font-size: 12px; font-weight: 700;
  letter-spacing: .13em; text-transform: uppercase; color: var(--dal-moss-ink);
  padding: 6px 0; border-bottom: 1px solid transparent;
  transition: color .3s var(--dal-ease), border-color .3s var(--dal-ease);
}
.dal-acc-go:hover, .dal-acc-go:focus-visible { color: var(--dal-ink); border-bottom-color: var(--dal-moss); }
.dal-acc-go svg { transition: transform .35s var(--dal-ease); }
.dal-acc-go:hover svg, .dal-acc-go:focus-visible svg { transform: translateX(5px); }

/* ==========================================================================
   PRIVACY REASSURANCE (form)
   ========================================================================== */
.dal-privacy {
  display: flex; gap: 16px; align-items: flex-start;
  background: var(--dal-slate-light); padding: 22px 24px; margin: 30px 0 0;
  border-left: 2px solid var(--dal-slate);
}
.dal-privacy svg { flex-shrink: 0; margin-top: 3px; color: var(--dal-slate-ink); }
.dal-privacy b {
  display: block; font-family: var(--dal-sans); font-size: 11.5px; font-weight: 700;
  letter-spacing: .18em; text-transform: uppercase; color: var(--dal-slate-ink); margin-bottom: 8px;
}
.dal-privacy p { font-size: 14.5px; line-height: 1.75; color: var(--dal-slate-ink); margin: 0; }

/* ==========================================================================
   CONTEXTUAL SUPPORT CALLOUT
   ========================================================================== */
.dal-support {
  display: grid; grid-template-columns: auto 1fr auto; gap: 26px; align-items: center;
  background: var(--dal-white); border: 1px solid var(--dal-line);
  border-left: 3px solid var(--dal-teal); padding: clamp(24px, 3vw, 34px);
}
.dal-support-ico {
  width: 46px; height: 46px; flex-shrink: 0; border-radius: 50%;
  background: rgba(102,142,138,.14); color: var(--dal-teal-ink);
  display: flex; align-items: center; justify-content: center;
}
.dal-support h3 { font-size: 1.25rem; margin-bottom: 6px; }
.dal-support p { font-size: 15.5px; line-height: 1.7; margin: 0; max-width: 62ch; }
@media (max-width: 820px) {
  .dal-support { grid-template-columns: auto 1fr; gap: 18px; }
  .dal-support > a { grid-column: 1 / -1; justify-self: start; }
}

/* ==========================================================================
   MOTION PRIMITIVES
   ========================================================================== */
.dal-rise { opacity: 0; transform: translateY(34px); transition: opacity 1s var(--dal-ease-out), transform 1s var(--dal-ease-out); }
.dal-rise.dal-in { opacity: 1; transform: none; }
.dal-rise[data-d="1"] { transition-delay: .1s; }
.dal-rise[data-d="2"] { transition-delay: .2s; }
.dal-rise[data-d="3"] { transition-delay: .3s; }
.dal-rise[data-d="4"] { transition-delay: .4s; }

/* per-line clip reveal for display type */
.dal-line { display: block; overflow: hidden; }
.dal-line > span {
  display: block; transform: translateY(105%);
  transition: transform 1.15s var(--dal-ease-out);
}
.dal-in .dal-line > span { transform: none; }
.dal-in .dal-line:nth-child(2) > span { transition-delay: .1s; }
.dal-in .dal-line:nth-child(3) > span { transition-delay: .2s; }
.dal-in .dal-line:nth-child(4) > span { transition-delay: .3s; }

/* image mask reveal */
.dal-mask { position: relative; overflow: hidden; }
.dal-mask > * { transform: scale(1.14); transition: transform 1.5s var(--dal-ease-out); }
.dal-mask::after {
  content: ""; position: absolute; inset: 0; background: var(--dal-ivory);
  transform-origin: right center; transition: transform 1.2s var(--dal-ease-out);
}
.dal-mask.dal-in > * { transform: none; }
.dal-mask.dal-in::after { transform: scaleX(0); }

@media (prefers-reduced-motion: reduce) {
  .dal-rise, .dal-line > span, .dal-mask > *, .dal-mask::after {
    opacity: 1 !important; transform: none !important; transition: none !important;
  }
  .dal-mask::after { display: none; }
  .dal-quick, .dal-quick .dal-quick-arrow { transition: none !important; }
  #dal-home * { animation: none !important; }
}

/* ==========================================================================
   PHOTOGRAPHY SLOTS
   Art-directed placeholders. Every slot states the shot it needs.
   Swap the .dal-shot block for <img class="dal-shot-img" ...> at build.
   ========================================================================== */
.dal-shot {
  position: relative; width: 100%; height: 100%; min-width: 0;
  background:
    radial-gradient(120% 90% at 22% 12%, rgba(181,139,76,.30) 0%, transparent 58%),
    radial-gradient(105% 85% at 88% 88%, rgba(46,61,94,.34) 0%, transparent 62%),
    linear-gradient(152deg, #3A312A 0%, #241D17 52%, #16120F 100%);
  overflow: hidden; display: flex; align-items: flex-end;
}
.dal-shot::before {
  content: ""; position: absolute; inset: 0; opacity: .5; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E");
}
.dal-shot-note {
  position: relative; z-index: 2; width: 100%;
  padding: clamp(18px, 2.2vw, 30px);
  font-size: 12px; line-height: 1.6; color: rgba(255,255,255,.82);
  background: linear-gradient(to top, rgba(10,8,6,.82), transparent);
}
.dal-shot-note b {
  display: block; font-family: var(--dal-sans); font-weight: 700;
  font-size: 10.5px; letter-spacing: .2em; text-transform: uppercase;
  color: var(--dal-brass-light); margin-bottom: 7px;
}
.dal-shot-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 1; }
.dal-shot-light {
  background:
    radial-gradient(120% 90% at 20% 10%, rgba(181,139,76,.20) 0%, transparent 60%),
    linear-gradient(152deg, #EDE6DA 0%, #E2D8C7 60%, #D6CAB5 100%);
}
.dal-shot-light .dal-shot-note { color: var(--dal-ink-3); background: linear-gradient(to top, rgba(255,255,255,.86), transparent); }
.dal-shot-light .dal-shot-note b { color: var(--dal-brass-text); }

/* ==========================================================================
   HEADER
   ========================================================================== */
.dal-topbar {
  position: relative; z-index: 60;
  background: var(--dal-ink); color: rgba(255,255,255,.66);
  font-size: 12.5px; letter-spacing: .04em;
}
.dal-topbar-in {
  display: flex; align-items: center; justify-content: space-between; gap: 20px;
  padding: 11px 0; flex-wrap: wrap;
}
.dal-topbar-l { display: flex; align-items: center; gap: 26px; flex-wrap: wrap; }
.dal-topbar a { display: inline-flex; align-items: center; gap: 8px; min-height: 32px; transition: color .3s; }
.dal-topbar a:hover { color: var(--dal-brass-light); }
.dal-topbar-r { display: flex; align-items: center; gap: 18px; }

.dal-lang { display: inline-flex; align-items: center; gap: 2px; }
.dal-lang button {
  background: none; border: none; padding: 4px 8px; min-height: 32px; font-size: 12px; font-weight: 700;
  letter-spacing: .1em; color: rgba(255,255,255,.55); transition: color .3s;
}
.dal-lang button[aria-pressed="true"] { color: var(--dal-brass-light); }
.dal-lang button:hover { color: var(--dal-white); }
.dal-lang-sep { color: rgba(255,255,255,.3); font-size: 11px; }

.dal-exit {
  display: inline-flex; align-items: center; gap: 8px;
  border: 1px solid rgba(255,255,255,.3); background: transparent; color: rgba(255,255,255,.85);
  font-size: 11.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  padding: 7px 15px; transition: background .3s, color .3s, border-color .3s;
}
.dal-exit:hover, .dal-exit:focus-visible { background: var(--dal-white); color: var(--dal-ink); border-color: var(--dal-white); }

.dal-head {
  position: sticky; top: 0; z-index: 500;
  background: transparent;
  transition: background .5s var(--dal-ease), box-shadow .5s var(--dal-ease), border-color .5s;
  border-bottom: 1px solid transparent;
}
.dal-head.dal-solid {
  background: rgba(252,249,244,.95); backdrop-filter: blur(12px);
  border-bottom-color: var(--dal-line);
  box-shadow: 0 10px 40px -24px rgba(22,18,15,.4);
}
.dal-head-in { display: flex; align-items: center; justify-content: space-between; gap: 28px; padding: 20px 0; }
.dal-logo img { height: 62px; width: auto; transition: height .4s var(--dal-ease); }
.dal-head.dal-solid .dal-logo img { height: 50px; }

.dal-nav { display: flex; align-items: center; gap: 4px; }
.dal-nav > li { position: relative; }
.dal-nav-a {
  position: relative; display: inline-flex; align-items: center; gap: 6px;
  padding: 12px 16px; font-size: 13px; font-weight: 700;
  letter-spacing: .11em; text-transform: uppercase; color: var(--dal-ink);
  background: none; border: none; transition: color .35s;
}
.dal-nav-a::after {
  content: ""; position: absolute; left: 16px; right: 16px; bottom: 4px; height: 1px;
  background: var(--dal-brass); transform: scaleX(0); transform-origin: right center;
  transition: transform .45s var(--dal-ease);
}
.dal-nav-a:hover::after, .dal-nav-a:focus-visible::after,
.dal-nav-a[aria-expanded="true"]::after { transform: scaleX(1); transform-origin: left center; }
.dal-nav-a:hover, .dal-nav-a[aria-expanded="true"] { color: var(--dal-brass-text); }
.dal-caret { transition: transform .35s var(--dal-ease); }
.dal-nav-a[aria-expanded="true"] .dal-caret { transform: rotate(180deg); }

.dal-drop {
  position: absolute; top: calc(100% + 6px); left: 8px; min-width: 300px;
  background: var(--dal-white); border: 1px solid var(--dal-line); padding: 12px;
  box-shadow: 0 30px 60px -30px rgba(22,18,15,.5);
  opacity: 0; visibility: hidden; transform: translateY(10px);
  transition: opacity .4s var(--dal-ease), transform .4s var(--dal-ease), visibility .4s;
}
.dal-drop.dal-open { opacity: 1; visibility: visible; transform: none; }
.dal-drop a { display: block; padding: 13px 16px; transition: background .3s; }
.dal-drop a:hover { background: var(--dal-ivory); }
.dal-drop b {
  display: block; font-family: var(--dal-display); font-size: 17px; font-weight: 500;
  color: var(--dal-ink); letter-spacing: -0.01em; margin-bottom: 3px;
}
.dal-drop span { display: block; font-size: 13px; line-height: 1.5; color: var(--dal-body); }

.dal-head-cta { display: flex; align-items: center; gap: 14px; }
.dal-head-phone {
  display: inline-flex; flex-direction: column; line-height: 1.2; text-align: right;
}
.dal-head-phone small {
  font-size: 10px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase;
  color: var(--dal-brass-text); margin-bottom: 3px;
}
.dal-head-phone b {
  font-family: var(--dal-display); font-size: 19px; font-weight: 500;
  color: var(--dal-ink); letter-spacing: -0.01em;
}
.dal-head .dal-btn { padding: 15px 26px; }

/* Legacy header exit — superseded by the fixed .dal-quick control.
   Kept for the top-bar variant only.
   Compact exit that lived in the sticky header below 1180px.
   The header is always on screen, so the control stays instantly reachable
   without a floating button that would sit on top of page content. */
.dal-head-exit {
  display: none; align-items: center; gap: 8px;
  background: transparent; border: 1px solid var(--dal-line); color: var(--dal-ink);
  font-family: var(--dal-sans); font-size: 11px; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase; padding: 13px 14px; min-height: 44px;
  transition: background .3s, color .3s, border-color .3s;
}
.dal-head-exit:hover, .dal-head-exit:focus-visible { background: var(--dal-ink); color: var(--dal-white); border-color: var(--dal-ink); }
.dal-head-exit svg { flex-shrink: 0; }

.dal-burger {
  display: none; width: 48px; height: 48px; background: none; border: 1px solid var(--dal-line);
  flex-direction: column; align-items: center; justify-content: center; gap: 6px;
}
.dal-burger span { display: block; width: 20px; height: 1.5px; background: var(--dal-ink); transition: transform .35s, opacity .35s; }
.dal-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7.5px) rotate(45deg); }
.dal-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.dal-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7.5px) rotate(-45deg); }

@media (max-width: 1180px) {
  .dal-nav, .dal-head-phone { display: none; }
  .dal-head-cta .dal-btn { display: none; }
  .dal-burger { display: inline-flex; }
  /* the fixed Quick Exit covers every width, so no header duplicate */
}
@media (max-width: 700px) {
  .dal-topbar-l a:nth-child(2) { display: none; }
  .dal-logo img { height: 46px; }
}
/* Keep the exit control LABELLED at every width — it must never degrade to a
   bare icon. Tighten the surrounding chrome instead so the text always fits. */
@media (max-width: 420px) {
  .dal-head-in { gap: 10px; }
  .dal-head-cta { gap: 8px; }
  .dal-head-exit { padding: 12px 10px; min-height: 44px; font-size: 10px; letter-spacing: .06em; gap: 6px; }
  .dal-logo img { height: 40px; }
}

/* ==========================================================================
   QUICK EXIT — persistent fixed control
   Discoverable at a glance without shouting. Anchored to the right edge,
   clear of the reading column, and always labelled (never a bare icon).
   ========================================================================== */
.dal-quick {
  position: fixed; right: 0; top: 42vh; z-index: 800;
  display: inline-flex; align-items: center; gap: 9px;
  background: var(--dal-navy-deep); color: var(--dal-ivory);
  border: none; border-right: 0;
  padding: 15px 18px 15px 16px; min-height: 48px;
  font-family: var(--dal-sans); font-size: 11.5px; font-weight: 700;
  letter-spacing: .13em; text-transform: uppercase;
  box-shadow: -6px 8px 26px -12px rgba(22,18,15,.55);
  transition: background .35s var(--dal-ease), padding-right .35s var(--dal-ease);
}
.dal-quick::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: var(--dal-slate);
}
.dal-quick:hover, .dal-quick:focus-visible { background: var(--dal-charcoal); padding-right: 24px; }
.dal-quick .dal-quick-arrow { transition: transform .35s var(--dal-ease); }
.dal-quick:hover .dal-quick-arrow, .dal-quick:focus-visible .dal-quick-arrow { transform: translate(2px,-2px); }
.dal-quick:focus-visible { outline: 2px solid var(--dal-brass); outline-offset: 3px; }
.dal-quick svg { flex-shrink: 0; }
/* the header/top-bar controls are redundant once this exists */
.dal-topbar-r .dal-exit { display: none; }
@media (max-width: 1180px) {
  .dal-quick { top: auto; bottom: 0; right: 0; left: 0; justify-content: center; padding: 15px 18px; }
  .dal-quick::before { left: 0; right: 0; bottom: auto; width: auto; height: 3px; }
  .dal-quick:hover, .dal-quick:focus-visible { padding-right: 18px; }
}

/* mobile drawer */
.dal-drawer {
  position: fixed; inset: 0; z-index: 800; background: var(--dal-ink);
  padding: 26px; overflow-y: auto; display: none;
}
.dal-drawer.dal-open { display: block; }
.dal-drawer-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 44px; }
.dal-drawer-close { width: 48px; height: 48px; background: none; border: 1px solid rgba(255,255,255,.25); color: #fff; }
.dal-drawer nav a, .dal-drawer nav button {
  display: flex; align-items: center; justify-content: space-between; width: 100%;
  padding: 20px 0; border-bottom: 1px solid rgba(255,255,255,.12);
  font-family: var(--dal-display); font-size: 26px; font-weight: 500; letter-spacing: -0.02em;
  color: var(--dal-white); background: none; border-left: none; border-right: none; border-top: none;
  text-align: left; text-transform: none;
}
.dal-drawer .dal-drop {
  position: static; opacity: 1; visibility: visible; transform: none; display: none;
  background: transparent; border: none; box-shadow: none; padding: 6px 0 14px 16px; min-width: 0;
}
.dal-drawer .dal-drop.dal-open { display: block; }
.dal-drawer .dal-drop a {
  font-family: var(--dal-sans); font-size: 15px; padding: 11px 0; border-bottom: none; color: rgba(255,255,255,.75);
}
.dal-drawer .dal-drop b { color: rgba(255,255,255,.92); font-size: 16px; }
.dal-drawer .dal-drop span { color: rgba(255,255,255,.5); }
.dal-drawer-foot { margin-top: 36px; display: flex; flex-direction: column; gap: 18px; }
.dal-drawer-phone { font-family: var(--dal-display); font-size: 30px; color: var(--dal-brass-light); letter-spacing: -0.02em; }

/* ==========================================================================
   HERO — cinematic, full height
   ========================================================================== */
.dal-hero { position: relative; min-height: 92vh; min-height: 92svh; display: flex; align-items: stretch; overflow: hidden; background: var(--dal-ink); margin-top: -1px; }
.dal-hero-media { position: absolute; inset: 0; z-index: 1; }
.dal-hero-media::after {
  content: ""; position: absolute; inset: 0; z-index: 3; pointer-events: none;
  background:
    linear-gradient(105deg, rgba(12,10,8,.90) 0%, rgba(12,10,8,.72) 42%, rgba(12,10,8,.30) 72%, rgba(12,10,8,.42) 100%);
}

/* --- hero slider --- */
.dal-hero-slider { position: absolute; inset: 0; z-index: 1; }
.dal-slide {
  position: absolute; inset: 0; opacity: 0; overflow: hidden;
  transition: opacity 1.4s var(--dal-ease-out);
}
.dal-slide.dal-on { opacity: 1; }
.dal-slide img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.dal-slide.dal-on img { animation: dal-kb 9s var(--dal-ease-out) forwards; }
@keyframes dal-kb { from { transform: scale(1.10); } to { transform: scale(1); } }

.dal-hero-ctrl {
  align-self: flex-end; display: flex; align-items: center; gap: 22px;
  margin-top: clamp(30px, 4vw, 54px); position: relative; z-index: 6;
}
.dal-hero-dots { display: flex; align-items: center; gap: 10px; }
.dal-hero-dots button {
  width: 34px; height: 34px; padding: 0; border: none; background: none;
  display: inline-flex; align-items: center; justify-content: center;
}
.dal-hero-dots button::before {
  content: ""; width: 100%; height: 2px; background: rgba(255,255,255,.34);
  transition: background .4s var(--dal-ease), transform .4s var(--dal-ease);
}
.dal-hero-dots button[aria-current="true"]::before { background: var(--dal-brass-light); transform: scaleY(2); }
.dal-hero-arrows { display: flex; gap: 8px; }
.dal-hero-arrows button {
  width: 52px; height: 52px; border: 1px solid rgba(255,255,255,.30); background: transparent;
  color: var(--dal-white); display: inline-flex; align-items: center; justify-content: center;
  transition: background .4s var(--dal-ease), color .4s var(--dal-ease), border-color .4s var(--dal-ease);
}
.dal-hero-arrows button:hover, .dal-hero-arrows button:focus-visible {
  background: var(--dal-white); color: var(--dal-ink); border-color: var(--dal-white);
}
@media (prefers-reduced-motion: reduce) {
  .dal-slide { transition: none; }
  .dal-slide.dal-on img { animation: none; }
}
@media (max-width: 700px) {
  .dal-hero-ctrl { align-self: flex-start; gap: 14px; margin-top: 26px; }
  .dal-hero-arrows button { width: 46px; height: 46px; }
}

.dal-hero-in {
  position: relative; z-index: 5; width: 100%; display: flex; flex-direction: column; justify-content: center;
  padding-top: 120px; padding-bottom: 130px;
}
.dal-hero-grid { display: grid; grid-template-columns: minmax(0,1fr); gap: 40px; }
.dal-hero h1 {
  color: var(--dal-white);
  font-size: clamp(2.9rem, 6.6vw, 5.6rem);
  line-height: 1.03; letter-spacing: -0.03em; font-weight: 500;
  max-width: 15ch; margin-bottom: 32px;
}
.dal-hero h1 .dal-em { color: var(--dal-brass-light); }
.dal-hero-sub { color: rgba(255,255,255,.78); font-size: 18.5px; line-height: 1.8; max-width: 52ch; margin-bottom: 44px; }
.dal-hero-acts { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }

/* vertical wordmark rail */
.dal-hero-rail {
  position: absolute; left: 18px; bottom: 130px; z-index: 6;
  writing-mode: vertical-rl; transform: rotate(180deg);
  font-size: 11px; font-weight: 700; letter-spacing: .34em; text-transform: uppercase;
  color: rgba(255,255,255,.42);
}
.dal-hero-rail::after { content: ""; display: block; width: 1px; height: 60px; background: rgba(255,255,255,.28); margin: 18px auto 0; }

/* hero bottom bar: practice quick links + scroll cue */
.dal-hero-bar {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 6;
  border-top: 1px solid rgba(255,255,255,.16);
  background: linear-gradient(to top, rgba(12,10,8,.62), transparent);
}
.dal-hero-bar-in { display: flex; align-items: stretch; }
.dal-hero-bar a {
  flex: 1; display: flex; align-items: center; justify-content: space-between; gap: 14px;
  padding: 26px 30px; color: rgba(255,255,255,.9);
  border-right: 1px solid rgba(255,255,255,.14);
  font-size: 13px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  position: relative; overflow: hidden; transition: color .45s var(--dal-ease);
}
.dal-hero-bar a:first-child { border-left: 1px solid rgba(255,255,255,.14); }
.dal-hero-bar a::before {
  content: ""; position: absolute; inset: 0; background: var(--dal-white); z-index: 1;
  transform: translateY(101%); transition: transform .5s var(--dal-ease);
}
.dal-hero-bar a:hover::before, .dal-hero-bar a:focus-visible::before { transform: none; }
.dal-hero-bar a:hover, .dal-hero-bar a:focus-visible { color: var(--dal-ink); }
.dal-hero-bar a > * { position: relative; z-index: 2; }
.dal-hero-bar em {
  font-family: var(--dal-display); font-style: normal; font-size: 12px;
  color: var(--dal-brass-light); letter-spacing: .1em; transition: color .45s;
}
.dal-hero-bar a:hover em { color: var(--dal-brass-text); }

@media (max-width: 1180px) { .dal-hero-rail { display: none; } }
@media (max-width: 900px) {
  .dal-hero { min-height: 88vh; min-height: 88svh; }
  .dal-hero-in { padding-top: 90px; padding-bottom: 96px; }
  .dal-hero-bar-in { flex-direction: column; }
  .dal-hero-bar a { border-left: 1px solid rgba(255,255,255,.14); padding: 16px 22px; font-size: 12px; }
  .dal-hero-media::after { background: linear-gradient(180deg, rgba(12,10,8,.80) 0%, rgba(12,10,8,.72) 55%, rgba(12,10,8,.88) 100%); }
}
@media (max-width: 700px) {
  .dal-hero-bar a:nth-child(3) { display: none; }
  .dal-hero-sub { font-size: 17px; margin-bottom: 34px; }
  .dal-hero-acts .dal-btn { width: 100%; }
}

/* ==========================================================================
   REASSURANCE STRIP
   ========================================================================== */
.dal-strip { background: var(--dal-cream); padding: clamp(60px, 7vw, 96px) 0; }
.dal-strip-grid { display: grid; grid-template-columns: repeat(3, 1fr); }
.dal-strip-item { padding: 0 clamp(20px, 3vw, 46px); border-left: 1px solid var(--dal-line); }
.dal-strip-item:first-child { padding-left: 0; border-left: none; }
.dal-strip-item:last-child { padding-right: 0; }
.dal-strip-item h3 {
  font-size: clamp(1.5rem, 2.2vw, 2rem); margin-bottom: 14px;
}
.dal-strip-item p { font-size: 16px; line-height: 1.75; }
.dal-strip-n {
  display: block; font-family: var(--dal-display); font-size: 13px; font-style: italic;
  color: var(--dal-brass-text); margin-bottom: 18px; letter-spacing: .06em;
}
@media (max-width: 880px) {
  .dal-strip-grid { grid-template-columns: 1fr; gap: 40px; }
  .dal-strip-item { padding: 0 0 0 24px; border-left: 1px solid var(--dal-line); }
  .dal-strip-item:first-child { padding-left: 24px; border-left: 1px solid var(--dal-line); }
}

/* ==========================================================================
   PRACTICE AREAS — full-bleed photographic panels
   ========================================================================== */
.dal-prac { background: var(--dal-stone); padding-top: clamp(80px, 9vw, 130px); }
.dal-prac-head {
  display: grid; grid-template-columns: 1fr auto; gap: 40px; align-items: end;
  margin-bottom: clamp(46px, 5vw, 72px);
}
.dal-prac-head h2 { color: var(--dal-navy); max-width: 18ch; }
/* eyebrow moves to moss on the light ground; its rule stays gold */
.dal-prac .dal-label { color: var(--dal-moss-ink); }
.dal-prac .dal-label::before { background: var(--dal-gold); }
.dal-prac .dal-tlink { color: var(--dal-navy); }
.dal-prac .dal-tlink:hover { color: var(--dal-moss-ink); }
.dal-prac-panels {
  display: grid; grid-template-columns: repeat(3, 1fr);
  box-shadow: 0 26px 60px -34px rgba(34,48,74,.45);
}
.dal-panel {
  position: relative; display: block; min-height: clamp(440px, 56vw, 640px);
  overflow: hidden; border-left: 1px solid var(--dal-stone);
  color: var(--dal-white);
}
.dal-panel:first-child { border-left: none; }
.dal-panel-media { position: absolute; inset: 0; z-index: 1; }
.dal-panel-media .dal-shot { transition: transform 1.3s var(--dal-ease-out); }
.dal-panel:hover .dal-panel-media .dal-shot { transform: scale(1.07); }
.dal-panel::after {
  content: ""; position: absolute; inset: 0; z-index: 2;
  background: linear-gradient(to top, rgba(12,10,8,.90) 8%, rgba(12,10,8,.42) 52%, rgba(12,10,8,.24) 100%);
  transition: background .6s var(--dal-ease);
}
.dal-panel:hover::after { background: linear-gradient(to top, rgba(12,10,8,.94) 12%, rgba(12,10,8,.62) 62%, rgba(12,10,8,.40) 100%); }
.dal-panel-in {
  position: relative; z-index: 3; height: 100%; display: flex; flex-direction: column; justify-content: flex-end;
  padding: clamp(28px, 3vw, 44px);
}
.dal-panel-n {
  font-family: var(--dal-display); font-size: clamp(3rem, 5vw, 4.6rem); line-height: 1;
  color: rgba(255,255,255,.20); letter-spacing: -0.04em; margin-bottom: auto;
  transition: color .6s var(--dal-ease);
}
.dal-panel:hover .dal-panel-n { color: var(--dal-brass-light); }
.dal-panel h3 { color: var(--dal-white); font-size: clamp(1.6rem, 2.3vw, 2.15rem); margin-bottom: 14px; }
.dal-panel-desc {
  font-size: 15.5px; line-height: 1.7; color: rgba(255,255,255,.74); margin-bottom: 20px;
  max-width: 34ch;
}
.dal-panel-more {
  max-height: 0; opacity: 0; overflow: hidden;
  transition: max-height .7s var(--dal-ease), opacity .5s var(--dal-ease), margin .7s var(--dal-ease);
}
.dal-panel:hover .dal-panel-more, .dal-panel:focus-visible .dal-panel-more { max-height: 200px; opacity: 1; }
.dal-panel-more li {
  font-size: 14px; color: rgba(255,255,255,.66); padding: 5px 0 5px 18px; position: relative;
}
.dal-panel-more li::before { content: ""; position: absolute; left: 0; top: 15px; width: 8px; height: 1px; background: var(--dal-brass-light); }
.dal-panel-go {
  display: inline-flex; align-items: center; gap: 10px; margin-top: 18px;
  font-size: 12px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase;
  color: var(--dal-brass-light);
}
.dal-panel-go svg { transition: transform .5s var(--dal-ease); }
.dal-panel:hover .dal-panel-go svg { transform: translateX(7px); }

@media (max-width: 980px) {
  .dal-prac-panels { grid-template-columns: 1fr; }
  .dal-panel { border-left: none; border-top: 1px solid rgba(255,255,255,.14); min-height: 420px; }
  .dal-panel:first-child { border-top: none; }
  .dal-panel-more { max-height: 200px; opacity: 1; }
  .dal-prac-head { grid-template-columns: 1fr; align-items: start; }
}

/* ==========================================================================
   APPROACH — asymmetric editorial
   ========================================================================== */
.dal-appr { background: var(--dal-white); overflow: hidden; }
.dal-appr-grid {
  display: grid; grid-template-columns: 1.02fr .98fr; gap: clamp(40px, 6vw, 96px); align-items: center;
}
.dal-appr-copy h2 { margin-bottom: 30px; max-width: 17ch; }
.dal-appr-copy p { font-size: 17.5px; line-height: 1.85; margin-bottom: 20px; max-width: 50ch; }
.dal-appr-rule { width: 64px; height: 1px; background: var(--dal-brass); margin: 34px 0; }
.dal-appr-pill { display: grid; grid-template-columns: repeat(2, 1fr); gap: 26px 34px; margin-top: 34px; }
.dal-appr-pill div { border-top: 1px solid var(--dal-line); padding-top: 16px; }
.dal-appr-pill b {
  display: block; font-family: var(--dal-display); font-size: 18px; font-weight: 500;
  color: var(--dal-ink); letter-spacing: -0.01em; margin-bottom: 5px;
}
.dal-appr-pill span { font-size: 14.5px; line-height: 1.6; }

.dal-appr-media { position: relative; min-width: 0; }
.dal-appr-main { aspect-ratio: 4/5; }
/* Oversized: deliberately bleeds past the grid toward the viewport edge.
   Uses --dal-vw (the real clientWidth, set from JS) rather than 100vw, because
   100vw INCLUDES the scrollbar and would push the image into horizontal overflow. */
@media (min-width: 1100px) {
  .dal-appr-main { margin-right: calc((var(--dal-vw, 100vw) - var(--dal-shell)) / -2); }
}
.dal-appr-inset {
  position: absolute; left: -56px; bottom: -52px; width: 46%; aspect-ratio: 1/1;
  border: 10px solid var(--dal-white); z-index: 3;
}
.dal-appr-stat {
  position: absolute; left: -56px; top: -40px; z-index: 4;
  background: var(--dal-ink); color: var(--dal-white); padding: 22px 26px; max-width: 210px;
}
.dal-appr-stat b { display: block; font-family: var(--dal-display); font-size: 17px; font-weight: 500; margin-bottom: 6px; color: #fff; }
.dal-appr-stat span { font-size: 13px; line-height: 1.6; color: rgba(255,255,255,.7); }

@media (max-width: 1000px) {
  .dal-appr-grid { grid-template-columns: 1fr; gap: 54px; }
  .dal-appr-media { order: -1; }
  .dal-appr-inset { left: auto; right: 0; bottom: -34px; width: 42%; border-width: 8px; }
  .dal-appr-stat { left: 0; top: -24px; max-width: 190px; padding: 18px 20px; }
  .dal-appr-main { aspect-ratio: 5/4; }
}
@media (max-width: 620px) {
  .dal-appr-inset, .dal-appr-stat { display: none; }
  .dal-appr-pill { grid-template-columns: 1fr; gap: 20px; }
}

/* ==========================================================================
   SIGNATURE STATEMENT
   ========================================================================== */
.dal-stmt { background: var(--dal-deep-slate); padding: clamp(90px, 12vw, 180px) 0; position: relative; overflow: hidden; }
.dal-stmt::before {
  content: ""; position: absolute; top: -30%; right: -10%; width: 60%; height: 160%;
  background: radial-gradient(circle at center, rgba(125,143,163,.20) 0%, transparent 62%);
  pointer-events: none;
}
.dal-stmt-in { position: relative; z-index: 2; max-width: 1000px; }
.dal-stmt blockquote {
  margin: 0; font-family: var(--dal-display); font-weight: 500; color: var(--dal-white);
  font-size: clamp(2.1rem, 5vw, 4.1rem); line-height: 1.12; letter-spacing: -0.03em;
}
.dal-stmt blockquote .dal-em { color: var(--dal-brass-light); }
.dal-stmt-foot {
  margin-top: 46px; padding-top: 26px; border-top: 1px solid rgba(255,255,255,.16);
  display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap;
  font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.55);
}

/* ==========================================================================
   PROCESS — sticky heading + scrolling steps
   ========================================================================== */
.dal-proc { background: var(--dal-slate-light); color: var(--dal-slate-ink); }
.dal-proc .dal-label { color: #4E6076; }
.dal-proc .dal-label::before { background: var(--dal-slate); }
.dal-proc p { color: var(--dal-slate-ink); }
.dal-proc-grid { display: grid; grid-template-columns: .82fr 1.18fr; gap: clamp(40px, 6vw, 90px); align-items: start; }
.dal-proc-side { position: sticky; top: 140px; }
.dal-proc-side h2 { margin-bottom: 24px; max-width: 13ch; }
.dal-proc-side p { font-size: 16.5px; max-width: 40ch; margin-bottom: 30px; }

.dal-steps { position: relative; list-style: none; }
.dal-steps::before {
  content: ""; position: absolute; left: 0; top: 12px; bottom: 12px; width: 1px; background: rgba(125,143,163,.4);
}
/* progress fill driven by --dal-fill from the scroll loop, so no extra
   (and invalid) element has to live inside the <ol> */
.dal-steps::after {
  content: ""; position: absolute; left: 0; top: 12px; width: 1px; background: var(--dal-slate);
  height: var(--dal-fill, 0px); transition: height .3s linear; z-index: 2;
}
.dal-step { position: relative; padding: 0 0 clamp(42px, 5vw, 66px) clamp(34px, 5vw, 66px); }
.dal-step:last-child { padding-bottom: 0; }
.dal-step::before {
  content: ""; position: absolute; left: -4px; top: 12px; width: 9px; height: 9px;
  background: var(--dal-slate-light); border: 1px solid var(--dal-slate); border-radius: 50%; z-index: 3;
  transition: background .5s var(--dal-ease), transform .5s var(--dal-ease);
}
.dal-step.dal-active::before { background: var(--dal-slate); transform: scale(1.35); }
.dal-step-n {
  display: block; font-family: var(--dal-display); font-size: clamp(2.6rem, 4.4vw, 3.9rem);
  line-height: 1; letter-spacing: -0.04em; color: rgba(67,84,101,.26);
  margin-bottom: 12px; transition: color .5s var(--dal-ease);
}
.dal-step.dal-active .dal-step-n { color: #4E6076; }
.dal-step h3 { font-size: clamp(1.35rem, 2vw, 1.75rem); margin-bottom: 10px; }
.dal-step p { font-size: 16px; max-width: 46ch; }
@media (max-width: 900px) {
  .dal-proc-grid { grid-template-columns: 1fr; gap: 44px; }
  .dal-proc-side { position: static; }
}

/* ==========================================================================
   TEAM — editorial portraits
   ========================================================================== */
.dal-team { background: var(--dal-white); }
.dal-team-head { display: grid; grid-template-columns: 1fr auto; gap: 30px; align-items: end; margin-bottom: clamp(44px, 5vw, 70px); }
.dal-team-head h2 { max-width: 16ch; }
.dal-team-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(24px, 3vw, 44px); }
.dal-person { position: relative; min-width: 0; }
.dal-person:nth-child(2) { margin-top: 54px; }
.dal-person-photo { position: relative; aspect-ratio: 3/4; overflow: hidden; }
.dal-person-photo .dal-shot { transition: transform 1.2s var(--dal-ease-out); }
.dal-person:hover .dal-person-photo .dal-shot { transform: scale(1.06); }
.dal-person-over {
  position: absolute; inset: auto 0 0 0; z-index: 4; padding: 22px;
  background: linear-gradient(to top, rgba(12,10,8,.88), transparent);
  transform: translateY(14px); opacity: 0;
  transition: transform .6s var(--dal-ease), opacity .6s var(--dal-ease);
}
.dal-person:hover .dal-person-over, .dal-person:focus-within .dal-person-over { transform: none; opacity: 1; }
.dal-person-body { padding-top: 22px; border-top: 1px solid var(--dal-line); margin-top: 22px; }
.dal-person-body h3 { font-size: 21px; margin-bottom: 5px; }
.dal-person-role {
  display: block; font-size: 11.5px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase;
  color: var(--dal-brass-text); margin-bottom: 14px;
}
.dal-person-body p { font-size: 15px; line-height: 1.7; margin-bottom: 16px; }
/* Placeholder team cards must never be mistakable for confirmed DAL staff.
   The badge is removed together with the placeholder when real bios land. */
.dal-person-tbd .dal-person-photo::after {
  content: "PLACEHOLDER"; position: absolute; left: 0; top: 0; z-index: 5;
  background: var(--dal-ink); color: var(--dal-brass-light);
  font-family: var(--dal-sans); font-size: 10px; font-weight: 700;
  letter-spacing: .18em; padding: 7px 12px;
}
.dal-person-tbd .dal-person-photo .dal-shot-img { filter: grayscale(1) opacity(.55); }
.dal-person-tbd .dal-person-body { border-top-color: var(--dal-line); }
.dal-person-tbd h3, .dal-person-tbd .dal-person-role { color: var(--dal-body); }
@media (max-width: 900px) {
  .dal-team-grid { grid-template-columns: 1fr; max-width: 460px; }
  .dal-person:nth-child(2) { margin-top: 0; }
  .dal-team-head { grid-template-columns: 1fr; align-items: start; }
  .dal-person-over { transform: none; opacity: 1; }
}

/* ==========================================================================
   COMMUNITY — split, warm
   ========================================================================== */
.dal-comm { background: var(--dal-cream); overflow: hidden; }
.dal-comm-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 6vw, 88px); align-items: center; }
.dal-comm-media { min-width: 0; }
.dal-comm-media .dal-shot { aspect-ratio: 5/4; }
.dal-comm h2 { max-width: 16ch; margin-bottom: 26px; }
.dal-comm p { font-size: 17.5px; line-height: 1.85; max-width: 48ch; margin-bottom: 30px; }
.dal-comm-list { margin: 34px 0; }
.dal-comm-list li {
  display: flex; align-items: baseline; gap: 16px; padding: 15px 0;
  border-top: 1px solid var(--dal-line); font-size: 16px; color: var(--dal-ink);
}
.dal-comm-list li:last-child { border-bottom: 1px solid var(--dal-line); }
.dal-comm-list em {
  font-family: var(--dal-display); font-style: italic; font-size: 13px;
  color: var(--dal-brass-text); flex-shrink: 0; min-width: 26px;
}
.dal-comm-list span { margin-left: auto; font-size: 13px; color: var(--dal-body); }
@media (max-width: 900px) {
  .dal-comm-grid { grid-template-columns: 1fr; gap: 44px; }
  .dal-comm-media { order: -1; }
}

/* ==========================================================================
   RESOURCES — magazine
   ========================================================================== */
.dal-res { background: var(--dal-white); }
.dal-res-head { display: grid; grid-template-columns: 1fr auto; gap: 30px; align-items: end; margin-bottom: clamp(40px, 5vw, 64px); }
.dal-res-head h2 { max-width: 18ch; }
.dal-res-grid { display: grid; grid-template-columns: 1.22fr .78fr; gap: clamp(30px, 4vw, 60px); }
.dal-feat { min-width: 0; }
.dal-feat-media { aspect-ratio: 16/10; margin-bottom: 26px; overflow: hidden; }
.dal-feat-media .dal-shot { transition: transform 1.2s var(--dal-ease-out); }
.dal-feat:hover .dal-feat-media .dal-shot { transform: scale(1.05); }
.dal-res-meta {
  display: flex; align-items: center; gap: 14px; margin-bottom: 14px;
  font-size: 11.5px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase;
  color: var(--dal-brass-text);
}
.dal-res-meta span { color: var(--dal-body); font-weight: 400; letter-spacing: .08em; }
.dal-feat h3 { font-size: clamp(1.5rem, 2.2vw, 2rem); margin-bottom: 14px; }
.dal-feat p { font-size: 16.5px; margin-bottom: 22px; max-width: 52ch; }
.dal-res-side { display: flex; flex-direction: column; min-width: 0; }
.dal-res-item { display: grid; grid-template-columns: 108px 1fr; gap: 20px; padding: 24px 0; border-top: 1px solid var(--dal-line); align-items: start; }
.dal-res-item:last-of-type { border-bottom: 1px solid var(--dal-line); margin-bottom: 30px; }
.dal-res-item-media { aspect-ratio: 1/1; overflow: hidden; }
.dal-res-item h4 { font-size: 17px; margin-bottom: 8px; line-height: 1.3; }
.dal-res-item p { font-size: 14px; line-height: 1.6; }
@media (max-width: 900px) { .dal-res-grid { grid-template-columns: 1fr; } .dal-res-head { grid-template-columns: 1fr; align-items: start; } }
@media (max-width: 460px) { .dal-res-item { grid-template-columns: 1fr; } .dal-res-item-media { aspect-ratio: 16/9; } }

/* ==========================================================================
   CONTACT — dark info panel + light form
   ========================================================================== */
.dal-contact { background: var(--dal-ivory); padding: 0; }
.dal-contact-grid { display: grid; grid-template-columns: .84fr 1.16fr; }
.dal-contact-info {
  background: var(--dal-sage-light); color: var(--dal-sage-ink);
  padding: clamp(56px, 7vw, 110px) clamp(30px, 4vw, 68px);
}
.dal-contact-info h2 { color: var(--dal-navy); margin-bottom: 24px; max-width: 14ch; }
.dal-contact-info .dal-label { color: var(--dal-moss-ink); }
.dal-contact-info .dal-label::before { background: var(--dal-gold); }
.dal-contact-info > p { font-size: 16.5px; line-height: 1.8; margin-bottom: 40px; max-width: 42ch; }
.dal-phone-block { display: block; margin-bottom: 38px; }
.dal-phone-block small {
  display: block; font-size: 11px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase;
  color: var(--dal-moss-ink); margin-bottom: 12px;
}
.dal-phone-block b {
  display: block; font-family: var(--dal-display); font-weight: 500;
  font-size: clamp(2.1rem, 3.6vw, 3.1rem); line-height: 1.05; letter-spacing: -0.03em;
  color: var(--dal-navy); transition: color .4s var(--dal-ease);
}
.dal-phone-block:hover b { color: var(--dal-moss-ink); }
.dal-cmeta { display: flex; flex-direction: column; gap: 20px; padding-top: 30px; border-top: 1px solid rgba(90,102,80,.30); }
.dal-cmeta div { display: flex; gap: 14px; align-items: flex-start; font-size: 15px; }
.dal-cmeta svg { flex-shrink: 0; margin-top: 4px; color: var(--dal-moss-ink); }
.dal-cmeta a:hover { color: var(--dal-navy); }

.dal-contact-form { padding: clamp(56px, 7vw, 110px) clamp(30px, 4vw, 68px); background: var(--dal-cream); }
.dal-note {
  border-left: 2px solid var(--dal-brass); padding: 4px 0 4px 20px; margin-bottom: 26px;
  font-size: 14.5px; line-height: 1.7;
}
.dal-note b { display: block; font-family: var(--dal-display); font-size: 16px; font-weight: 500; color: var(--dal-ink); margin-bottom: 6px; }
.dal-note-plain { font-size: 13.5px; line-height: 1.7; padding: 16px 18px; background: var(--dal-ivory); margin-bottom: 34px; }

/* the form CTA remains the one strong control in a now-light section */
.dal-contact-form .dal-btn-solid { background: var(--dal-navy); color: var(--dal-ivory); }
.dal-fgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.dal-f { display: flex; flex-direction: column; gap: 8px; }
.dal-f-full { grid-column: 1 / -1; }
.dal-f label { font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--dal-ink); }
.dal-f .dal-opt { font-weight: 400; letter-spacing: .04em; text-transform: none; color: var(--dal-body); }
.dal-f input, .dal-f select, .dal-f textarea {
  font-family: var(--dal-sans); font-size: 16px; color: var(--dal-ink);
  padding: 14px 0; border: none; border-bottom: 1px solid var(--dal-line);
  background: transparent; border-radius: 0; width: 100%;
  transition: border-color .4s var(--dal-ease);
}
.dal-f input:focus, .dal-f select:focus, .dal-f textarea:focus { border-bottom-color: var(--dal-moss); outline: none; }
.dal-f input:focus-visible, .dal-f select:focus-visible, .dal-f textarea:focus-visible { outline: 2px solid var(--dal-brass); outline-offset: 4px; }
.dal-f textarea { resize: vertical; min-height: 96px; }
.dal-f-err { font-size: 12.5px; color: #A03526; display: none; }
.has-err .dal-f-err { display: block; }
.has-err input, .has-err select, .has-err textarea { border-bottom-color: #A03526; }
.dal-consent { display: flex; gap: 14px; align-items: flex-start; margin-top: 26px; }
.dal-consent.has-err { outline: 1px solid #A03526; outline-offset: 8px; }
.dal-consent input { width: 18px; height: 18px; margin-top: 3px; flex-shrink: 0; accent-color: var(--dal-ink); }
.dal-consent label { font-size: 14px; line-height: 1.6; color: var(--dal-body); }
.dal-alert { display: none; padding: 14px 18px; font-size: 14px; margin-bottom: 24px; }
.dal-alert.dal-active { display: block; }
.dal-alert-err { background: #FBEBE8; border-left: 2px solid #A03526; color: #7C2A1E; }
.dal-alert-ok { background: #ECF3EA; border-left: 2px solid #3F7238; color: #2C5427; }
@media (max-width: 1000px) { .dal-contact-grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .dal-fgrid { grid-template-columns: 1fr; } }

/* ==========================================================================
   FOOTER
   ========================================================================== */
.dal-foot { background: var(--dal-ink); color: rgba(255,255,255,.62); padding: clamp(64px, 8vw, 104px) 0 0; font-size: 15px; }
.dal-foot-top { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.1fr; gap: clamp(30px, 4vw, 56px); padding-bottom: 60px; }
.dal-foot-brand img { height: 58px; margin-bottom: 24px; }
.dal-foot-brand p { font-size: 15px; line-height: 1.8; max-width: 32ch; }
.dal-foot h3 {
  font-family: var(--dal-sans); font-size: 11px; font-weight: 700; letter-spacing: .2em;
  text-transform: uppercase; color: var(--dal-brass-light); margin-bottom: 22px;
}
.dal-foot ul { display: flex; flex-direction: column; gap: 5px; }
.dal-foot ul a, .dal-foot-bot button { display: inline-block; padding: 4px 0; }
.dal-foot a { transition: color .3s; }
.dal-foot a:hover { color: var(--dal-white); }
.dal-foot-soc { display: flex; gap: 10px; margin-top: 26px; }
.dal-foot-soc a {
  width: 42px; height: 42px; border: 1px solid rgba(255,255,255,.2);
  display: flex; align-items: center; justify-content: center;
  transition: background .35s, color .35s, border-color .35s;
}
.dal-foot-soc a:hover { background: var(--dal-brass); border-color: var(--dal-brass); color: var(--dal-ink); }
.dal-foot-safety {
  font-size: 12.5px; line-height: 1.7; color: rgba(255,255,255,.42);
  padding: 24px 0; border-top: 1px solid rgba(255,255,255,.12); max-width: 78ch;
}
.dal-foot-bot {
  border-top: 1px solid rgba(255,255,255,.12); padding: 22px 0;
  display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap;
  font-size: 13px; color: rgba(255,255,255,.45);
}
.dal-foot-bot ul { flex-direction: row; gap: 24px; flex-wrap: wrap; }
.dal-foot-bot button { background: none; border: none; color: inherit; font-size: 13px; padding: 4px 0; font-family: inherit; }
.dal-foot-bot button:hover { color: var(--dal-white); }
@media (max-width: 900px) { .dal-foot-top { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .dal-foot-top { grid-template-columns: 1fr; gap: 36px; } }

/* ==========================================================================
   COOKIE CONSENT
   ========================================================================== */
@media (max-width: 700px) { }

.dal-cookie {
  position: fixed; left: 20px; right: 20px; bottom: 20px; z-index: 900; max-width: 620px; margin: 0 auto;
  background: var(--dal-white); border: 1px solid var(--dal-line); padding: 28px 30px;
  box-shadow: 0 34px 70px -30px rgba(22,18,15,.55); display: none;
}
.dal-cookie.dal-active { display: block; }
.dal-cookie h2 { font-size: 20px; margin-bottom: 10px; }
.dal-cookie p { font-size: 14px; line-height: 1.7; margin-bottom: 20px; }
.dal-cookie-acts { display: flex; gap: 12px; flex-wrap: wrap; }
.dal-cookie-acts .dal-btn { flex: 1; min-width: 150px; padding: 15px 20px; font-size: 11.5px; }
.dal-cookie-manage { margin-top: 16px; font-size: 12px; }
.dal-cookie-prefs { display: none; margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--dal-line); }
.dal-cookie-prefs.dal-active { display: block; }
.dal-cookie-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 0; }
.dal-cookie-row b { display: block; font-family: var(--dal-display); font-size: 16px; font-weight: 500; color: var(--dal-ink); }
.dal-cookie-row span { font-size: 13px; }
.dal-sw { position: relative; width: 46px; height: 24px; flex-shrink: 0; }
.dal-sw input { position: absolute; inset: 0; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.dal-sw i { position: absolute; inset: 0; background: var(--dal-line); transition: background .3s; }
.dal-sw i::before { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; background: #fff; transition: transform .3s; }
.dal-sw input:checked + i { background: var(--dal-ink); }
.dal-sw input:checked + i::before { transform: translateX(22px); }
.dal-sw input:disabled + i { background: var(--dal-brass); opacity: .6; }

.dal-sr {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.dal-skip {
  position: absolute; left: 16px; top: -70px; z-index: 999;
  background: var(--dal-ink); color: #fff; padding: 14px 22px;
  font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; transition: top .25s;
}
.dal-skip:focus { top: 16px; }

/* The fixed Quick Exit becomes a full-width bottom bar below 1180px. Reserve
   space for it so it can never cover the footer's legal links or the Cookie
   Settings button. Declared last, and ID-scoped, because the base
   `.dal-foot-bot { padding: 22px 0 }` shorthand appears later in this sheet
   and was overriding the same rule set inside the media query above. */
@media (max-width: 1180px) {
  #dal-home .dal-foot-bot { padding-bottom: 88px; }
}


/* ==========================================================================
   INTERNAL PAGES - components added for Family Law, Property, Wills,
   Legacy Program and Team. Tokens only; no new colours introduced.
   ========================================================================== */

/* ---- page hero (quieter than the homepage slider) ---- */
.dal-phero {
  position: relative; background: var(--dal-ink); overflow: hidden;
  min-height: 62vh; display: flex; align-items: flex-end;
}
.dal-phero-media { position: absolute; inset: 0; z-index: 1; }
.dal-phero-media img { width: 100%; height: 100%; object-fit: cover; }
.dal-phero-media::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(100deg, rgba(12,10,8,.90) 0%, rgba(12,10,8,.72) 46%, rgba(12,10,8,.40) 100%);
}
.dal-phero-in {
  position: relative; z-index: 3; width: 100%;
  padding-top: clamp(96px, 13vw, 170px); padding-bottom: clamp(52px, 7vw, 92px);
}
.dal-phero h1 {
  color: var(--dal-white); font-size: clamp(2.3rem, 5vw, 4rem);
  line-height: 1.06; letter-spacing: -0.03em; max-width: 17ch; margin-bottom: 24px;
}
.dal-phero-lead { color: rgba(255,255,255,.80); font-size: 18px; line-height: 1.8; max-width: 52ch; }
.dal-phero-acts { display: flex; gap: 16px; flex-wrap: wrap; margin-top: 36px; }
@media (max-width: 700px) {
  .dal-phero { min-height: 56vh; }
  .dal-phero-acts .dal-btn { width: 100%; }
}

/* ---- testimonials ---- */
.dal-tst { background: var(--dal-cream); }
.dal-tst-head { max-width: 58ch; margin-bottom: clamp(44px, 5vw, 70px); }
.dal-tst-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(26px, 3vw, 46px); }
.dal-tst-item { display: flex; flex-direction: column; min-width: 0; }
.dal-tst-mark {
  font-family: var(--dal-display); font-size: 62px; line-height: .7; color: var(--dal-gold);
  opacity: .5; margin-bottom: 18px;
}
.dal-tst-item blockquote {
  margin: 0 0 24px; font-family: var(--dal-display); font-size: 17.5px; font-weight: 400;
  line-height: 1.7; color: var(--dal-ink); letter-spacing: -0.005em;
}
.dal-tst-by {
  margin-top: auto; padding-top: 18px; border-top: 1px solid var(--dal-line);
  font-family: var(--dal-sans); font-size: 11.5px; font-weight: 700;
  letter-spacing: .16em; text-transform: uppercase; color: var(--dal-brass-text);
}
@media (max-width: 900px) { .dal-tst-grid { grid-template-columns: 1fr; gap: 40px; } }

/* ---- support beyond the legal matter ---- */
.dal-supb-head { max-width: 56ch; margin-bottom: clamp(34px, 4vw, 52px); }
.dal-supb-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(36px, 5vw, 76px); }
.dal-supb-grid p { color: var(--dal-sage-ink); font-size: 16.5px; line-height: 1.85; }
.dal-supb-lead { font-size: 18.5px !important; color: var(--dal-ink) !important; }
.dal-supb-close { font-family: var(--dal-display); font-size: 18px !important; color: var(--dal-ink) !important; margin-bottom: 26px; }
.dal-supb { max-width: 70ch; }
.dal-supb h2 { margin-bottom: 18px; }
.dal-supb p { color: var(--dal-sage-ink); font-size: 16.5px; line-height: 1.85; margin-bottom: 22px; }
@media (max-width: 860px) { .dal-supb-grid { grid-template-columns: 1fr; gap: 28px; } }

/* ---- emergency / safety information (calm, never an alarm banner) ---- */
.dal-emerg {
  background: var(--dal-slate-light); border-left: 2px solid var(--dal-slate);
  padding: clamp(24px, 3vw, 34px); margin-top: 40px;
}
.dal-emerg-h {
  font-family: var(--dal-sans); font-size: 11.5px; font-weight: 700; letter-spacing: .18em;
  text-transform: uppercase; color: var(--dal-slate-ink); margin: 0 0 18px;
}
.dal-emerg ul { display: flex; flex-direction: column; gap: 12px; }
.dal-emerg li {
  display: flex; justify-content: space-between; align-items: baseline; gap: 18px;
  padding-bottom: 12px; border-bottom: 1px solid rgba(67,84,101,.20); flex-wrap: wrap;
}
.dal-emerg li:last-child { border-bottom: none; padding-bottom: 0; }
.dal-emerg span { font-size: 15px; color: var(--dal-slate-ink); }
.dal-emerg b {
  font-family: var(--dal-display); font-size: 19px; font-weight: 500;
  color: var(--dal-navy); letter-spacing: -0.01em; white-space: nowrap;
}
.dal-emerg-note { font-size: 13px; color: var(--dal-slate-ink); margin: 18px 0 0; }

/* ---- editorial copy blocks (Property / Wills / Legacy) ---- */
.dal-ed { display: grid; grid-template-columns: .44fr .56fr; gap: clamp(36px, 6vw, 92px); align-items: start; }
.dal-ed-head h2 { max-width: 15ch; }
.dal-ed-body p { font-size: 17px; line-height: 1.88; margin-bottom: 1.15em; max-width: 60ch; }
.dal-ed-body p:first-child { font-size: 18.5px; color: var(--dal-ink); }
@media (max-width: 900px) { .dal-ed { grid-template-columns: 1fr; gap: 24px; } }

.dal-split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(36px, 6vw, 88px); align-items: center; }
.dal-split-media img { width: 100%; aspect-ratio: 5/4; object-fit: cover; }
.dal-split p { font-size: 17px; line-height: 1.88; margin-bottom: 1.1em; }
@media (max-width: 900px) { .dal-split { grid-template-columns: 1fr; gap: 32px; } .dal-split-media { order: -1; } }

/* ---- four calm pillars ---- */
.dal-pillars { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(24px, 3vw, 44px); }
.dal-pillars > div { border-top: 2px solid var(--dal-gold); padding-top: 20px; }
.dal-pillars h3 { font-size: 1.15rem; margin-bottom: 10px; }
.dal-pillars p { font-size: 15px; line-height: 1.7; }
@media (max-width: 900px) { .dal-pillars { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .dal-pillars { grid-template-columns: 1fr; } }

/* ---- simple listed pathways ---- */
.dal-ways { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 clamp(36px, 5vw, 72px); }
.dal-ways li {
  display: flex; gap: 18px; align-items: baseline;
  padding: 20px 0; border-bottom: 1px solid var(--dal-line); font-size: 16.5px; color: var(--dal-ink);
}
.dal-ways em {
  font-family: var(--dal-display); font-style: italic; font-size: 13px;
  color: var(--dal-brass-text); flex-shrink: 0;
}
@media (max-width: 760px) { .dal-ways { grid-template-columns: 1fr; } }

/* ---- is / is not ---- */
.dal-isnot { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(30px, 4vw, 64px); }
.dal-isnot > div { padding: clamp(26px, 3vw, 38px); }
.dal-isnot-yes { background: var(--dal-sage-light); }
.dal-isnot-no { background: var(--dal-stone); }
.dal-isnot h3 { font-size: 1.2rem; margin-bottom: 18px; }
.dal-isnot li { position: relative; padding: 9px 0 9px 24px; font-size: 16px; line-height: 1.6; }
.dal-isnot-yes li { color: var(--dal-sage-ink); }
.dal-isnot-no li { color: var(--dal-body); }
.dal-isnot li::before {
  content: ""; position: absolute; left: 0; top: 18px; width: 11px; height: 1px; background: var(--dal-moss);
}
.dal-isnot-no li::before { background: var(--dal-body); opacity: .5; }
@media (max-width: 760px) { .dal-isnot { grid-template-columns: 1fr; } }

/* ---- department photo placeholder ---- */
.dal-deptphoto {
  position: relative; aspect-ratio: 16/9; background: var(--dal-stone);
  border: 1px solid var(--dal-line); display: flex; align-items: center; justify-content: center;
  text-align: center; padding: 30px;
}
.dal-deptphoto p {
  font-family: var(--dal-sans); font-size: 11.5px; font-weight: 700; letter-spacing: .18em;
  text-transform: uppercase; color: var(--dal-brass-text); margin: 0;
}
.dal-deptphoto small { display: block; font-size: 13px; font-weight: 400; letter-spacing: 0;
  text-transform: none; color: var(--dal-body); margin-top: 10px; }

/* ---- pending-copy placeholder ---- */
.dal-pending {
  border: 1px dashed var(--dal-line); background: var(--dal-cream);
  padding: clamp(24px, 3vw, 36px);
}
.dal-pending p:first-child {
  font-family: var(--dal-sans); font-size: 11.5px; font-weight: 700; letter-spacing: .18em;
  text-transform: uppercase; color: var(--dal-brass-text); margin-bottom: 12px;
}
.dal-pending p { font-size: 15.5px; line-height: 1.75; }

/* ---- team ---- */
.dal-people { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(26px, 3vw, 46px); }
.dal-pcard { min-width: 0; }
.dal-pcard-photo {
  position: relative; aspect-ratio: 3/4; background: var(--dal-stone);
  border: 1px solid var(--dal-line); overflow: hidden;
  display: flex; align-items: center; justify-content: center;
}
.dal-pcard-photo span {
  font-family: var(--dal-display); font-size: 40px; color: var(--dal-navy); opacity: .28; letter-spacing: -0.03em;
}
/* Fills the 3/4 frame the monogram otherwise occupies. */
.dal-pcard-img { width: 100%; height: 100%; object-fit: cover; object-position: center top; display: block; }
.dal-pcard-photo small {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 9px 12px;
  font-family: var(--dal-sans); font-size: 9.5px; font-weight: 700; letter-spacing: .16em;
  text-transform: uppercase; color: var(--dal-brass-text); background: rgba(252,249,244,.92);
}
.dal-pcard-body { padding-top: 20px; border-top: 2px solid var(--dal-gold); margin-top: 20px; }
.dal-pcard h3 { font-size: 1.2rem; margin-bottom: 4px; }
.dal-pcard-role {
  display: block; font-size: 11.5px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase;
  color: var(--dal-brass-text); margin-bottom: 14px;
}
.dal-pcard-lead { font-size: 15px; line-height: 1.7; margin-bottom: 16px; }
.dal-pbio { height: 0; overflow: hidden; transition: height .5s var(--dal-ease); }
.dal-pbio > div { min-height: 0; }
.dal-pbio-in { padding-top: 6px; }
.dal-pbio-in p { font-size: 15px; line-height: 1.8; margin-bottom: 1em; color: var(--dal-body); }
.dal-pmore {
  display: inline-flex; align-items: center; gap: 9px; background: none; border: none; padding: 7px 0;
  font-family: var(--dal-sans); font-size: 11.5px; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: var(--dal-navy); border-bottom: 1px solid var(--dal-gold);
  transition: color .3s var(--dal-ease);
}
.dal-pmore:hover { color: var(--dal-moss-ink); }
.dal-pmore .dal-pmore-x { display: none; }
.dal-pmore[aria-expanded="true"] .dal-pmore-o { display: none; }
.dal-pmore[aria-expanded="true"] .dal-pmore-x { display: inline; }
@media (max-width: 900px) { .dal-people { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .dal-people { grid-template-columns: 1fr; max-width: 420px; } }

/* ==========================================================================
   HEADER FIT
   The seven-item nav plus logo, phone and CTA needed ~1490px; below that the
   labels wrapped onto a second line. Three changes, no redesign:
     - nothing in the header may break mid-label
     - the nav is tightened so it fits from 1280px up
     - the phone block (already shown in the top bar) is dropped below 1440px
   ========================================================================== */
.dal-head-in { flex-wrap: nowrap; gap: 20px; }
.dal-nav { gap: 0; flex-wrap: nowrap; }
.dal-nav-a {
  padding: 12px 11px; font-size: 12px; letter-spacing: .07em;
  white-space: nowrap;
  /* the Legal Services item is a <button> and the rest are <a>; without an
     explicit line-height and box reset the button computes 5px shorter and
     sits 2px lower than its neighbours */
  line-height: 1.75; align-self: center; box-sizing: border-box;
}
.dal-nav-a::after { left: 11px; right: 11px; }
.dal-head-phone b, .dal-head-phone small { white-space: nowrap; }
.dal-head .dal-btn { white-space: nowrap; padding: 15px 22px; }
.dal-head .dal-btn span { white-space: nowrap; }
.dal-logo img { flex-shrink: 0; }

/* the top bar already carries the phone number, so the header duplicate is
   the first thing to go when space is tight */
@media (max-width: 1440px) {
  #dal-home .dal-head-phone { display: none; }
}
/* hand over to the drawer while the nav still fits on one line */
@media (max-width: 1280px) {
  #dal-home .dal-nav { display: none; }
  #dal-home .dal-head-cta .dal-btn { display: none; }
  #dal-home .dal-burger { display: inline-flex; }
}

/* ---- monogram used while a headshot is pending ---- */
.dal-mono {
  position: absolute; inset: 0; background: var(--dal-stone);
  display: flex; align-items: center; justify-content: center;
}
.dal-mono span {
  font-family: var(--dal-display); font-size: clamp(38px, 4vw, 52px); font-weight: 500;
  color: var(--dal-navy); opacity: .26; letter-spacing: -0.03em;
}
.dal-person-photo { position: relative; background: var(--dal-stone); }

/* ---- quiet "coming soon" note ---- */
.dal-soon-note {
  font-family: var(--dal-display); font-style: italic; font-size: 15.5px;
  color: var(--dal-moss-ink);
}

/* ==========================================================================
   TEAM PROFILE PAGES
   One page per person. The portrait column sticks while the biography scrolls
   on desktop, so the person stays present while you read about them.
   ========================================================================== */
.dal-profhero {
  background: var(--dal-ink); color: var(--dal-body-dark);
  padding: clamp(120px, 14vw, 180px) 0 clamp(46px, 6vw, 76px);
}
.dal-prof-back {
  display: inline-flex; align-items: center; gap: 10px; margin-bottom: 30px;
  /* WCAG 2.2 AA 2.5.8 - the label alone measured under the 24px minimum */
  min-height: 32px; padding: 6px 0;
  font-family: var(--dal-sans); font-size: 11.5px; font-weight: 700;
  letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.62);
  transition: color .3s var(--dal-ease);
}
.dal-prof-back:hover { color: var(--dal-brass-light); }
.dal-prof-back svg { transition: transform .35s var(--dal-ease); }
.dal-prof-back:hover svg { transform: translateX(-4px); }
#dal-home .dal-profhero h1 {
  color: var(--dal-white); font-size: clamp(2.2rem, 4.4vw, 3.5rem);
  line-height: 1.06; letter-spacing: -0.03em; margin-bottom: 16px;
}
.dal-prof-role {
  font-family: var(--dal-sans); font-size: 12.5px; font-weight: 700;
  letter-spacing: .18em; text-transform: uppercase; color: var(--dal-brass-light); margin: 0;
}

.dal-prof { background: var(--dal-white); }
.dal-prof-grid {
  display: grid; grid-template-columns: .38fr .62fr; gap: clamp(40px, 6vw, 92px);
  align-items: start;
}
.dal-prof-aside { position: sticky; top: 130px; }
.dal-prof-photo {
  position: relative; aspect-ratio: 3/4; overflow: hidden;
  background: var(--dal-stone); border: 1px solid var(--dal-line);
}
.dal-prof-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.dal-prof-mono {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
}
.dal-prof-mono span {
  font-family: var(--dal-display); font-size: clamp(56px, 7vw, 86px); font-weight: 500;
  color: var(--dal-navy); opacity: .22; letter-spacing: -0.04em;
}
.dal-prof-meta { padding-top: 22px; margin-top: 22px; border-top: 2px solid var(--dal-gold); }
.dal-prof-meta-role {
  font-family: var(--dal-sans); font-size: 11.5px; font-weight: 700; letter-spacing: .15em;
  text-transform: uppercase; color: var(--dal-brass-text); margin-bottom: 6px;
}
.dal-prof-meta-firm {
  font-family: var(--dal-display); font-size: 17px; color: var(--dal-ink); margin-bottom: 18px;
}
.dal-prof-bio p { font-size: 17px; line-height: 1.9; margin-bottom: 1.25em; max-width: 62ch; }
.dal-prof-lead {
  font-family: var(--dal-display); font-size: clamp(1.25rem, 2vw, 1.6rem) !important;
  line-height: 1.5 !important; color: var(--dal-ink); letter-spacing: -0.015em;
  padding-bottom: 26px; margin-bottom: 30px !important; border-bottom: 1px solid var(--dal-line);
}
@media (max-width: 900px) {
  .dal-prof-grid { grid-template-columns: 1fr; gap: 34px; }
  .dal-prof-aside { position: static; max-width: 320px; }
}

/* ---- the rest of the team ---- */
.dal-minis { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(14px, 1.6vw, 22px); }
.dal-mini {
  display: flex; align-items: center; gap: 14px; padding: 16px;
  background: var(--dal-white); border: 1px solid var(--dal-line);
  transition: border-color .35s var(--dal-ease), transform .35s var(--dal-ease);
}
.dal-mini:hover { border-color: var(--dal-gold); transform: translateY(-2px); }
/* The monogram and a real headshot occupy the same 46px box, so a card looks the
   same whether or not that person's photograph has been supplied. Without the
   size the image lays out at its intrinsic 900x1200 and pushes the name and role
   out over the neighbouring cards. */
.dal-mini-mono, .dal-mini-img {
  width: 46px; height: 46px; flex-shrink: 0; background: var(--dal-stone);
}
.dal-mini-mono {
  display: flex; align-items: center; justify-content: center;
  font-family: var(--dal-display); font-size: 16px; color: var(--dal-navy); opacity: .85;
}
.dal-mini-img { object-fit: cover; object-position: center top; display: block; }
.dal-mini-body { display: flex; flex-direction: column; min-width: 0; }
.dal-mini-body b {
  font-family: var(--dal-display); font-size: 15.5px; font-weight: 500;
  color: var(--dal-ink); letter-spacing: -0.01em;
}
.dal-mini-body i {
  font-style: normal; font-size: 11px; font-weight: 700; letter-spacing: .1em;
  text-transform: uppercase; color: var(--dal-brass-text); margin-top: 3px;
}
@media (max-width: 1100px) { .dal-minis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 780px)  { .dal-minis { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px)  { .dal-minis { grid-template-columns: 1fr; } }

@media (prefers-reduced-motion: reduce) {
  .dal-mini, .dal-prof-back svg { transition: none !important; }
  .dal-mini:hover { transform: none !important; }
}

/* ---- closing CTA ---- */
.dal-close-cta { background: var(--dal-ivory); text-align: center; }
.dal-close-cta h2 { max-width: 20ch; margin: 0 auto 18px; }
.dal-close-cta p { max-width: 54ch; margin: 0 auto 34px; font-size: 17px; }
.dal-close-acts { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }

/* ---- Legacy: Richardson-led program lockup ---- */
.dal-lockup {
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
  padding-bottom: 22px; margin-bottom: 26px; border-bottom: 1px solid rgba(255,255,255,.22);
}
.dal-lockup b {
  font-family: var(--dal-sans); font-size: 13px; font-weight: 700; letter-spacing: .26em;
  text-transform: uppercase; color: var(--dal-white);
}
.dal-lockup span {
  font-size: 12.5px; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.62);
}
.dal-partner {
  background: var(--dal-stone); padding: clamp(28px, 3.5vw, 44px);
  display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 4vw, 56px);
}
.dal-partner h3 { font-size: 1.1rem; margin-bottom: 10px; }
.dal-partner p { font-size: 15.5px; line-height: 1.75; }
@media (max-width: 760px) { .dal-partner { grid-template-columns: 1fr; gap: 22px; } }

/* ---- referral split ---- */
.dal-paths { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 3vw, 40px); }
.dal-path {
  display: block; padding: clamp(28px, 3vw, 40px); background: var(--dal-white);
  border: 1px solid var(--dal-line); border-left: 3px solid var(--dal-navy);
  transition: border-left-color .4s var(--dal-ease), transform .4s var(--dal-ease);
}
.dal-path:hover { border-left-color: var(--dal-gold); transform: translateY(-3px); }
.dal-path h3 { font-size: 1.25rem; margin-bottom: 10px; }
.dal-path p { font-size: 15.5px; line-height: 1.7; margin-bottom: 16px; }
@media (max-width: 760px) { .dal-paths { grid-template-columns: 1fr; } }

@media (prefers-reduced-motion: reduce) {
  .dal-pbio, .dal-path { transition: none !important; }
  .dal-path:hover { transform: none !important; }
}
/* ==========================================================================
   SEPTEMBER 2026 - multi-select fields and the Legacy Program referral form.
   Tokens only; nothing in the approved visual system is redefined.
   ========================================================================== */

/* ---- checkbox groups (Area of Legal Support, Legacy form) ----
   fieldset carries browser defaults, so it is reset back to a plain block
   before it inherits the .dal-f flex column. */
.dal-checks { border: 0; margin: 0; padding: 0; min-width: 0; }
.dal-checks legend {
  padding: 0; font-size: 12px; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase; color: var(--dal-ink);
}
.dal-checks .dal-opt {
  font-weight: 400; letter-spacing: .04em; text-transform: none; color: var(--dal-body);
}
.dal-check-grid {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2px 18px; margin-top: 4px;
}
.dal-check-grid-tight { grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* The whole row is the target, so it clears 24x24 (WCAG 2.2 target size)
   comfortably even though the box itself is 20px. */
.dal-check {
  display: flex; align-items: center; gap: 11px; min-height: 44px;
  cursor: pointer; border-bottom: 1px solid var(--dal-line);
}
.dal-check:last-child { border-bottom: 1px solid var(--dal-line); }
.dal-check input {
  width: 20px; height: 20px; flex-shrink: 0; margin: 0;
  accent-color: var(--dal-navy); cursor: pointer;
}
.dal-check span {
  font-family: var(--dal-sans); font-size: 15px; line-height: 1.45;
  font-weight: 400; letter-spacing: 0; text-transform: none; color: var(--dal-body);
}
.dal-check:hover span { color: var(--dal-ink); }
.dal-check input:focus-visible { outline: 2px solid var(--dal-brass); outline-offset: 3px; }
.dal-checks.has-err { outline: 1px solid #A03526; outline-offset: 8px; }
@media (max-width: 560px) { .dal-check-grid { grid-template-columns: 1fr; } }

/* ---- Legacy: who you would speak with ---- */
.dal-legacy-contact { margin-top: 28px; display: flex; flex-direction: column; gap: 18px; align-items: flex-start; }
.dal-legacy-phone {
  display: inline-flex; flex-direction: column; gap: 4px; text-decoration: none;
  border-bottom: 1px solid var(--dal-line); padding-bottom: 10px; min-height: 44px;
}
.dal-legacy-phone small {
  font-size: 11.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: var(--dal-brass-text);
}
.dal-legacy-phone b {
  font-family: var(--dal-display); font-weight: 500; font-size: clamp(1.5rem, 2.6vw, 2rem);
  letter-spacing: -0.01em; color: var(--dal-ink);
}
.dal-legacy-phone:hover b { color: var(--dal-navy); }
.dal-legacy-who {
  background: var(--dal-white); border: 1px solid var(--dal-line); border-top: 3px solid var(--dal-navy);
  padding: clamp(28px, 3vw, 40px);
}
.dal-legacy-who-name { font-family: var(--dal-display); font-size: 1.4rem; color: var(--dal-ink); margin-bottom: 4px; }
.dal-legacy-who-role {
  font-size: 11.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: var(--dal-brass-text); margin-bottom: 18px;
}
.dal-legacy-who p { font-size: 15.5px; line-height: 1.75; margin-bottom: 18px; }

/* ---- Legacy referral form ---- */
.dal-legacyform { background: var(--dal-stone); }
.dal-legacyform-grid {
  display: grid; grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
  gap: clamp(32px, 5vw, 76px); align-items: start;
}
.dal-legacyform-intro p { font-size: 16px; line-height: 1.8; }
.dal-legacy-direct {
  margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--dal-line);
  display: flex; flex-direction: column; gap: 6px; align-items: flex-start;
}
.dal-legacy-direct p {
  font-size: 11.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: var(--dal-brass-text); margin-bottom: 6px;
}
.dal-legacy-direct a {
  text-decoration: none; color: var(--dal-ink); font-size: 15.5px;
  display: inline-flex; align-items: center; min-height: 32px;
}
.dal-legacy-direct a b { font-family: var(--dal-display); font-size: 1.3rem; font-weight: 500; }
.dal-legacy-direct a:hover { color: var(--dal-navy); }
.dal-legacyform .dal-form {
  background: var(--dal-white); border: 1px solid var(--dal-line);
  padding: clamp(26px, 3.4vw, 48px);
}
@media (max-width: 900px) { .dal-legacyform-grid { grid-template-columns: 1fr; } }