/* United Legal — visual refinement layer (2026-10-13, round 2 audit). Loaded after polish.css on every page.
   Brand tokens, fonts, copy, section order and all behaviour are unchanged. This file lightens the navy-heavy
   pages, adds the hero situation panel (refine.js), tightens attorney/practice presentation and small
   type/contrast corrections. Everything here is reversible by removing the two refine.* files. */

/* ---------- 1. Header: settles on scroll instead of floating flat ---------- */
.ula-header .mainbar{transition:box-shadow .25s ease}
.ula-header.is-scrolled .mainbar{box-shadow:0 10px 30px rgba(12,29,85,.12)}
.ula-header .main-nav>ul>li>a::after{transition:transform .25s var(--ease-out)}

/* ---------- 2. Homepage hero: let the office show, keep the copy column solid ---------- */
.home-hero__video,.home-hero__poster{filter:grayscale(.5) contrast(1.04) brightness(1.1)}
.home-hero__tint{background:linear-gradient(100deg,#0C1D55 0%,rgba(12,29,85,.94) 24%,rgba(12,29,85,.58) 56%,rgba(12,29,85,.66) 100%)}
.home-hero__veil{background:linear-gradient(90deg,rgba(12,29,85,.58) 0%,rgba(12,29,85,.1) 46%,rgba(12,29,85,.26) 100%),linear-gradient(180deg,rgba(5,13,43,.06),rgba(5,13,43,.46))}
.home-hero__box::after{content:"";position:absolute;inset:auto 0 0 0;height:38%;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(5,13,43,0),rgba(5,13,43,.38))}
.home-hero__story .lede{color:#EAF1FA}

/* hero entrance (refine.js adds html.js-hero once the logo intro has finished) */
@keyframes ul-rise{from{opacity:0;transform:translateY(14px)}}
html.js-hero .home-hero__story>*{animation:ul-rise .7s var(--ease-out) both}
html.js-hero .home-hero__story>:nth-child(2){animation-delay:.07s}
html.js-hero .home-hero__story>:nth-child(3){animation-delay:.14s}
html.js-hero .home-hero__story>:nth-child(4){animation-delay:.21s}
html.js-hero .home-hero__story>:nth-child(5){animation-delay:.28s}
html.js-hero .hero-paths{animation:ul-rise .8s .32s var(--ease-out) both}

/* the situation panel (built by refine.js): seven routes above the fold on wide screens */
.hero-paths{display:none}
@media(min-width:1025px){
 .home-hero__grid{grid-template-columns:minmax(0,1.15fr) minmax(340px,400px);gap:48px;align-items:center}
 .hero-paths{display:block;justify-self:end;width:100%;padding:20px 18px 16px;border-radius:24px;color:#fff;background:rgba(10,24,72,.46);border:1px solid rgba(204,225,246,.22);-webkit-backdrop-filter:blur(16px) saturate(1.2);backdrop-filter:blur(16px) saturate(1.2);box-shadow:0 30px 60px rgba(2,9,28,.28)}
 .hero-paths__k{font:500 17px/1.2 var(--f-primary);text-transform:uppercase;letter-spacing:.06em;color:var(--accent);margin:0 6px 8px}
 .hero-paths ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
 .hero-paths li+li{border-top:1px solid rgba(204,225,246,.14)}
 .hero-paths a{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:46px;padding:9px 8px 9px 10px;border-radius:12px;color:#fff;text-decoration:none;font:600 14.5px/1.3 var(--f-text);transition:background .18s ease}
 .hero-paths a:hover,.hero-paths a:focus-visible{background:rgba(255,255,255,.09)}
 .hero-paths a:focus-visible{outline:3px solid var(--accent);outline-offset:1px}
 .hero-paths a svg{width:16px;height:16px;flex:0 0 16px;fill:none;stroke:var(--accent);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s var(--ease-out)}
 .hero-paths a:hover svg,.hero-paths a:focus-visible svg{transform:translateX(3px)}
 [dir=rtl] .hero-paths a svg{transform:scaleX(-1)}
 [dir=rtl] .hero-paths a:hover svg,[dir=rtl] .hero-paths a:focus-visible svg{transform:scaleX(-1) translateX(3px)}
 .hero-paths__note{margin:10px 6px 0;font:400 12px/1.5 var(--f-text);color:#CCE1F6}
 [dir=rtl] .hero-paths__k{letter-spacing:0}
 [dir=rtl] .hero-paths a{font-size:14px;line-height:1.7}
}
@media(min-width:1025px) and (max-width:1250px){.home-hero__grid{grid-template-columns:minmax(0,1fr) minmax(320px,360px);gap:36px}.home-hero__story h1{font-size:clamp(44px,4.4vw,60px)}}

/* ---------- 3. Practice board: one alignment with the other sections, warmer hover ---------- */
.sec-practice .sec-head{align-items:flex-start;text-align:start}
.sec-practice .sec-head h2::after{margin:14px 0 0}
.pboard .pcard{transition:transform .28s var(--ease-out),box-shadow .28s var(--ease-out),border-color .2s}
.pboard .pcard .pcard__icon{transition:background .25s ease,transform .3s var(--ease-out)}
.pboard .pcard:hover{border-color:#9FBEE0;box-shadow:0 22px 44px rgba(12,29,85,.12)}
.pboard .pcard:hover .pcard__icon{background:rgba(249,233,0,.32)}
.pboard .pcard .pcard__eyebrow{letter-spacing:.14em}
@media(prefers-reduced-motion:reduce){.pboard .pcard:hover .pcard__icon{transform:none}}

/* ---------- 4. Reviews: a light surface so the page is not four navy blocks deep ---------- */
.sec-reviews .navy-box.reviews-box{background:#fff;border:1px solid var(--sky);color:var(--primary)}
.reviews-box .eyebrow-light{color:var(--blue)}
.reviews-box .h2--light{color:var(--primary)}
.reviews-box .rev{background:var(--panel);border-color:transparent;color:var(--primary)}
.reviews-box .rev::before{color:var(--blue);opacity:.32}
.reviews-box .rev blockquote{color:#2B3650}
.reviews-box .rev cite{color:var(--primary)}
.reviews-box .rev cite span{color:#5A6680}
.reviews-box .rev-note{color:#5A6680}

/* ---------- 5. Attorneys: tighter profile rhythm; compact rows on phones ---------- */
.att .role{margin-top:12px}
.att .facts{color:#2B3650}
.att__photo{box-shadow:inset 0 0 0 1px rgba(12,29,85,.06)}
@media(max-width:600px){
 .team-grid{gap:22px}
 .team-grid .att{display:grid;grid-template-columns:104px minmax(0,1fr);grid-auto-rows:auto;gap:2px 16px;align-items:start;padding-bottom:18px;border-bottom:1px solid var(--sky)}
 .team-grid .att:last-child{border-bottom:0}
 .team-grid .att .att__photo{grid-row:1/4;border-radius:16px}
 .team-grid .att .role{margin:0;align-self:end}
 .team-grid .att h3{font-size:26px}
 .team-grid .att p{font-size:14px;line-height:1.6;margin-top:4px}
 .team-grid .att .facts{grid-column:1/-1;margin-top:10px}
 [dir=rtl] .team-grid .att h3{font-size:23px}
}

/* ---------- 6. Service and state heroes: a cooler light behind the Quick Check card ---------- */
.hero .hero__bg{background:radial-gradient(ellipse 46% 62% at 82% 44%,rgba(109,181,255,.24),rgba(109,181,255,0) 70%),radial-gradient(ellipse 60% 55% at 50% 100%,#1A2C72 0%,rgba(26,44,114,0) 70%),linear-gradient(#0A1848,var(--primary))}
[dir=rtl] .hero .hero__bg{background:radial-gradient(ellipse 46% 62% at 18% 44%,rgba(109,181,255,.24),rgba(109,181,255,0) 70%),radial-gradient(ellipse 60% 55% at 50% 100%,#1A2C72 0%,rgba(26,44,114,0) 70%),linear-gradient(#0A1848,var(--primary))}
.ll-hero__bg{background:radial-gradient(ellipse 50% 50% at 50% 0%,rgba(109,181,255,.18),rgba(109,181,255,0) 70%),radial-gradient(ellipse 60% 55% at 50% 100%,#1A2C72 0%,rgba(26,44,114,0) 70%),linear-gradient(#0A1848,var(--primary))}
.glass{border-color:rgba(204,225,246,.28)}
/* OpenGlass draws the Quick Check surface with a near-black canvas and brightness(.56); keep the glass, lift it to the brand navy */
.glass.ug-glass-host .ug-surface{background:rgba(18,36,96,.55)!important;-webkit-backdrop-filter:blur(14px) saturate(1.5) brightness(.95)!important;backdrop-filter:blur(14px) saturate(1.5) brightness(.95)!important;box-shadow:0 30px 60px rgba(2,9,28,.35),inset 0 1px 0 rgba(255,255,255,.08)!important}
.glass.ug-glass-host .qa-tile,.glass.ug-glass-host .hi-option{background:rgba(255,255,255,.07);border-color:rgba(204,225,246,.22)}
.glass.ug-glass-host .qa-tile:hover,.glass.ug-glass-host .hi-option:hover{background:rgba(255,255,255,.12)}
html[data-glass=fallback] .glass,html[data-glass=opaque] .glass{background:rgba(16,33,88,.86)}
.service-stats{background:#F2F7FC}
.service-stat-grid strong{letter-spacing:-.01em}
.service-card{box-shadow:0 1px 0 rgba(12,29,85,.04)}
.service-card{transition:transform .25s var(--ease-out),box-shadow .25s var(--ease-out)}
.service-card:hover{transform:translateY(-3px);box-shadow:0 16px 34px rgba(12,29,85,.1)}
@media(max-width:1024px){.hero .hero__bg,[dir=rtl] .hero .hero__bg{background:radial-gradient(ellipse 70% 40% at 50% 60%,rgba(109,181,255,.16),rgba(109,181,255,0) 70%),radial-gradient(ellipse 60% 55% at 50% 100%,#1A2C72 0%,rgba(26,44,114,0) 70%),linear-gradient(#0A1848,var(--primary))}}

/* ---------- 7. Small text that was below a comfortable minimum ---------- */
.service-hero-note{font-size:13px}
.quiz-disclaimer,.hi-legal,.hi-preview{font-size:12.5px}
.close-disclosure{font-size:13px}
.site-footer .footer-bar{font-size:12px}
.site-footer .footer-preview-note{font-size:12.5px}
.r2-featured h2{font-size:12.5px}
.rev-note{font-size:13px}

/* ---------- 8. Closing routes: card lift matches the practice cards ---------- */
.route{transition:transform .22s var(--ease-out),box-shadow .22s var(--ease-out),border-color .2s}
.route:hover{border-color:#9FBEE0}
.close-box{background:linear-gradient(180deg,#F2F7FC,var(--panel))}

/* ---------- 9. Reduced motion ---------- */
@media(prefers-reduced-motion:reduce){
 html.js-hero .home-hero__story>*,html.js-hero .hero-paths{animation:none!important}
 .ula-header .mainbar,.pboard .pcard,.pboard .pcard .pcard__icon,.route,.service-card,.hero-paths a,.hero-paths a svg{transition:none!important}
}
