/* A single-section study. Everything is scoped to the home Practice Areas section. */
#practice{background:var(--ink);color:var(--paper);padding-block:76px 72px;border-top:0;isolation:isolate}
#practice::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background-image:linear-gradient(90deg,rgba(43,43,41,.76) 0%,rgba(43,43,41,.78) 36%,rgba(43,43,41,.93) 61%,rgba(43,43,41,.96) 100%),linear-gradient(180deg,rgba(43,43,41,.35),rgba(43,43,41,.06)),url(laguna-coast-review.jpg);background-size:cover;background-position:center bottom;background-repeat:no-repeat}
#practice::after{display:none}
#practice>.wrap{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(48px,7vw,100px);align-items:start}
#practice .practice-introduction{position:sticky;top:106px}
#practice .statement-h{font-size:clamp(34px,3.4vw,44px);line-height:1.08;letter-spacing:-.015em;max-width:none;margin:0 0 26px;color:var(--paper)}
#practice .practice-introduction>p{font-size:16px;line-height:1.7;color:var(--line);margin-bottom:18px;max-width:39ch}
#practice .practice-introduction>p:first-of-type{font-family:var(--serif);font-size:22px;line-height:1.4;color:var(--paper);margin-bottom:24px;max-width:none}
#practice .practice-introduction>p:last-child{margin-bottom:0}
#practice .practices{display:block;border-top:1px solid var(--brass);margin:0;min-width:0}
#practice .practice{position:relative;display:block;border-radius:0;margin:0;padding:22px 0 23px;border-bottom:1px solid color-mix(in srgb,var(--line) 28%,var(--ink));background:transparent;box-shadow:none;transition:none}
#practice .practice::before{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--brass);transform:scaleX(0);transform-origin:left;pointer-events:none;transition:transform .4s cubic-bezier(.22,1,.36,1)}
#practice .practice h3{color:var(--paper);font-size:clamp(27px,2.2vw,31px);line-height:1.16;margin:0 0 12px;max-width:none;transition:color .25s ease,transform .3s cubic-bezier(.22,1,.36,1)}
#practice .practice p{color:var(--line);font-size:16px;line-height:1.65;max-width:53ch;margin:0}
#practice .practice p:last-child{margin-top:12px;line-height:1.5}
#practice .practice .textlink{display:inline-block;font-family:var(--sans);font-size:11px;line-height:1.5;letter-spacing:.09em;text-transform:uppercase;opacity:1;color:var(--paper);padding-bottom:3px;background-image:linear-gradient(var(--brass),var(--brass));background-size:0 1px;transition:background-size .3s ease,color .25s ease}
#practice .practice .textlink::after{content:"↗";font-family:var(--sans);font-size:15px;line-height:1;margin-left:14px;color:var(--brass);display:inline-block;transition:transform .3s ease}
#practice .practice:focus-within::before{transform:scaleX(1)}
#practice .practice:focus-within .textlink{background-size:100% 1px}
#practice .practice a:focus-visible{outline-color:var(--brass);outline-offset:5px}
/* Only this section opts out of the inherited parent-level reveal. */
.js #practice .rv,.js #practice .practice{opacity:1;transform:none;transition:none}
@media(hover:hover) and (pointer:fine){
 #practice .practice:hover{background:transparent}
 #practice .practice:hover::before{transform:scaleX(1)}
 #practice .practice:hover h3{color:var(--brass);transform:translateX(5px)}
 #practice .practice:hover .textlink{background-size:100% 1px}
 #practice .practice:hover .textlink::after{transform:translate(2px,-2px)}
}
@media(max-width:860px){
 #practice{padding-block:48px 44px}
 #practice::before{background-image:linear-gradient(180deg,rgba(43,43,41,.82),rgba(43,43,41,.90) 38%,rgba(43,43,41,.97) 65%),url(laguna-coast-review.jpg);background-size:100% 100%,auto 900px;background-position:center top;background-repeat:no-repeat}
 #practice>.wrap{grid-template-columns:1fr;gap:32px}
 #practice .practice-introduction{position:static}
 #practice .statement-h{font-size:38px;max-width:18ch;margin-bottom:24px}
 #practice .practice-introduction>p,#practice .practice-introduction>p:first-of-type{max-width:58ch}
 #practice .practice-introduction>p:first-of-type{font-size:22px}
 #practice .practice{padding:24px 0}
 #practice .practice h3{font-size:29px;max-width:27ch}
}
@media(max-width:520px){
 #practice .statement-h{font-size:35px}
 #practice .practice-introduction>p{font-size:16px}
 #practice .practice-introduction>p:first-of-type{font-size:22px;line-height:1.4}
 #practice .practice p{font-size:16px;line-height:1.65}
 #practice .practice .textlink{font-size:10.5px;letter-spacing:.065em}
 #practice .practice .textlink::after{margin-left:10px}
}
@media(prefers-reduced-motion:reduce){
 #practice .practice-introduction{position:static}
 #practice .practice h3,#practice .practice::before,#practice .textlink,#practice .textlink::after{transition:none!important}
 #practice .practice:hover h3,#practice .practice:hover .textlink::after{transform:none}
}
