/* Layout concept: charcoal frame (header, heroes, footer) around off-white reading pages; a full-width court photograph in the home hero; gold logo; emerald marks every action; a thin rose line and soft rose boxes add a light tint of pink on every page. */
:root{
  /* Client palette */
  --charcoal:#2C3E50;        /* headers, hero, nav, headings */
  --charcoal-dark:#22252A;   /* footer, body text */
  --emerald:#8A6420;         /* deep gold: links, borders, icons (5:1 on the light background) */
  --emerald-teal:#6B4C14;    /* darker gold for hover */
  --white:#FFFFFF;
  --offwhite:#F8F9FA;
  /* Supporting tints derived from the palette */
  --tint:#EEF2F1;            /* light bands */
  --emerald-tint:#FBF1D3;    /* pale premium yellow for hover backgrounds */
  --rule:#DCE1E5;
  --field:#B7C0C8;
  --muted:#56616D;
  --on-dark:#FFFFFF;
  --on-dark-muted:#C3CCD5;
  --ph-bg:#FFF0BF;
  --ph-ink:#5C4A12;
  --ok:#6B4C14;
  --err:#9A3B32;
  /* Rose accent: lines and soft boxes only (not for text, too light for contrast) */
  --rose:#E6A9B8;
  --rose-strong:#C86F87;
  --rose-tint:#FBEEF1;
  --rose-line:#F1CDD6;
  /* Gold, taken from the logo: lines, card edges, icons and numerals (not body text) */
  --gold-hi:#F6E3A8;
  --gold:#D6AF5A;
  --gold-deep:#A57B2C;
  --gold-ink:#8A6420;        /* gold for small text on light backgrounds (5:1 contrast) */
  --gold-line:#E6CF95;
  --cream:#FBF6EA;
  --yellow:#F2C94C;          /* premium yellow highlight */
  --btn-gold:linear-gradient(135deg, #F8E7AE 0%, #E9C463 42%, #C9973A 100%);
  --btn-gold-hover:linear-gradient(135deg, #FFF0B8 0%, #F6D262 50%, #E0AE3E 100%);
  --gold-grad:linear-gradient(90deg, #A57B2C 0%, #D6AF5A 35%, #F6E3A8 55%, #D6AF5A 75%, #A57B2C 100%);
  --font-display:"Eczar", Georgia, "Times New Roman", serif;
  --font-body:"Mukta", "Segoe UI", system-ui, -apple-system, sans-serif;
  --measure:68ch;
  --gutter:clamp(16px, 5vw, 56px);
  color-scheme:light;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--offwhite);
  color:var(--charcoal-dark);
  font-family:var(--font-body);
  font-size:18px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%}
[hidden]{display:none !important}
::selection{background:var(--rose-tint); color:var(--charcoal-dark)}
h1,h2,h3{font-family:var(--font-display); font-weight:600; line-height:1.15; margin:0; text-wrap:balance; color:var(--charcoal)}
h2{font-size:clamp(28px, 3.6vw, 38px)}
h3{font-size:21px}
p{margin:0 0 1em}
a{color:var(--emerald); text-underline-offset:3px; text-decoration-thickness:1px}
a:hover{color:var(--emerald-teal)}
:focus-visible{outline:3px solid var(--emerald-teal); outline-offset:3px; border-radius:2px}
.wrap{max-width:1160px; margin:0 auto; padding-inline:var(--gutter)}
.skip{position:absolute; left:-9999px; top:0; background:var(--white); padding:8px 14px; z-index:10}
.skip:focus{left:16px; top:16px}

/* Placeholder text that still needs the firm's real details */
.ph{background:var(--ph-bg); color:var(--ph-ink); padding:0 .25em; border-radius:2px; box-decoration-break:clone; -webkit-box-decoration-break:clone}

/* Buttons */
.btn{display:inline-block; font:inherit; font-weight:600; font-size:17px; line-height:1.2; text-decoration:none; padding:13px 24px; border-radius:3px; border:1px solid var(--emerald); cursor:pointer}
.btn-solid{background:var(--btn-gold); border-color:#C9973A; color:var(--charcoal-dark); box-shadow:0 6px 16px rgba(165,123,44,.22)}
.btn-solid:hover{background:var(--btn-gold-hover); border-color:#E0AE3E; color:var(--charcoal-dark)}
.btn-line{background:transparent; color:var(--emerald); border-color:#C9973A}
.btn-line:hover{background:var(--emerald-tint); color:var(--emerald)}
.on-dark .btn-line{border-color:rgba(214,175,90,.75)}
.on-dark .btn-line{color:var(--white); border-color:rgba(255,255,255,.65)}
.on-dark .btn-line:hover{background:rgba(255,255,255,.1); color:var(--white)}
.actions{display:flex; flex-wrap:wrap; gap:14px}
.btn svg{width:18px; height:18px; vertical-align:-3px; margin-right:8px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round}
.btn-sm{padding:10px 18px; font-size:16px}
.badge{display:inline-block; font-size:14px; font-weight:600; line-height:1.3; color:var(--gold-ink); background:var(--cream); border:1px solid var(--gold-line); border-radius:999px; padding:3px 12px}
.badges{display:flex; flex-wrap:wrap; gap:8px; margin-top:12px}

/* Header */
.site-head{position:relative; background:var(--charcoal); color:var(--on-dark); border-top:3px solid var(--rose)}
.site-head::after{content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:var(--gold-grad); opacity:.75}
.bar{display:flex; align-items:center; justify-content:space-between; gap:24px; padding-block:14px}
.mark{display:flex; align-items:center; gap:14px; text-decoration:none; color:var(--white); line-height:1.1}
.mark:hover{color:var(--white)}
.mark-logo{display:block; flex:none; height:40px; width:auto}
.mark{min-width:0}
.mark-text{display:flex; flex-direction:column; min-width:0; overflow:hidden; padding-left:14px; border-left:1px solid rgba(214,175,90,.6)}
.mark b{font-family:var(--font-display); font-weight:600; font-size:20px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.mark small{font-size:13px; color:var(--on-dark-muted); margin-top:3px}
.nav{display:flex; align-items:center; gap:26px; list-style:none; margin:0; padding:0}
.nav-link{display:inline-block; line-height:1.6}
.nav a{color:var(--on-dark-muted); text-decoration:none; font-size:16px; padding-block:6px; border-bottom:2px solid transparent; white-space:nowrap}
.nav a:hover{color:var(--gold-hi); border-bottom-color:rgba(214,175,90,.5)}
.nav a[aria-current="page"]{color:var(--gold-hi); border-bottom-color:var(--gold)}
.nav > li{position:relative}
.dd-btn{display:inline-flex; align-items:center; gap:6px; font:inherit; font-size:16px; line-height:1.6; color:var(--on-dark-muted); background:none; border:0; border-bottom:2px solid transparent; padding:6px 0; cursor:pointer; white-space:nowrap}
.dd-btn:hover, .dd-btn[aria-expanded="true"]{color:var(--gold-hi)}
.dd-btn.is-current{color:var(--gold-hi); border-bottom-color:var(--gold)}
.caret{width:12px; height:12px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; transition:transform .2s ease}
.dd-btn[aria-expanded="true"] .caret{transform:rotate(180deg)}
.dd{display:none; position:absolute; top:calc(100% + 14px); left:-18px; z-index:60; min-width:270px; background:var(--white); border-radius:8px; border-top:3px solid var(--gold); box-shadow:0 22px 50px rgba(20,28,36,.28); padding:10px}
.dd.open{display:block}
.dd::before{content:""; position:absolute; top:-9px; left:28px; border:6px solid transparent; border-bottom-color:var(--gold)}
.dd ul{list-style:none; margin:0; padding:0}
.dd a{display:block; padding:9px 14px; border-radius:5px; color:var(--charcoal-dark); text-decoration:none; font-size:16px; border:0; white-space:nowrap}
.dd a:hover, .dd a:focus-visible{background:var(--cream); color:var(--emerald)}
.dd a.dd-free{margin-top:6px; border-top:1px solid var(--rule); border-radius:0 0 5px 5px; color:var(--emerald); font-weight:600}
.dd a[href="practice-areas.html"]{color:var(--muted); font-size:15px}
.nav-login{display:inline-flex; align-items:center; gap:6px}
.nav-login .lock{width:15px; height:15px; fill:none; stroke:var(--gold); stroke-width:2; stroke-linecap:round; stroke-linejoin:round}
.nav-login.is-in{color:var(--gold-hi)}
.menu-btn{display:none; background:none; border:1px solid rgba(255,255,255,.4); color:var(--white); font:inherit; font-size:15px; padding:6px 14px; border-radius:3px; cursor:pointer}

/* Contact bar above the header */
.topbar{background:#1E2B38; color:var(--on-dark-muted); font-size:14px; line-height:1.3}
.topbar-in{display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:40px}
.tb-info{display:flex; gap:18px; margin:0}
.tb-info span{display:inline-flex; align-items:center; gap:6px}
.topbar svg{width:15px; height:15px; flex:none; fill:none; stroke:var(--gold); stroke-width:2; stroke-linecap:round; stroke-linejoin:round}
.tb-links{display:flex; align-items:center; gap:20px; list-style:none; margin:0; padding:0}
.tb-links a{display:inline-flex; align-items:center; gap:7px; color:var(--white); text-decoration:none; white-space:nowrap}
.tb-links a:hover{color:var(--rose)}
.tb-l{display:none}
a.tb-enq{background:linear-gradient(135deg, var(--gold-hi), var(--gold) 55%, var(--gold-deep)); color:var(--charcoal-dark); font-weight:600; padding:4px 14px; border-radius:999px}
a.tb-enq:hover{background:var(--gold-hi); color:var(--charcoal-dark)}

/* Home: the three main practice areas, overlapping the bottom of the hero */
.focus{position:relative; z-index:3; margin-top:-96px}
.focus-grid{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:22px}
.focus-card{display:flex; flex-direction:column; min-width:0; background:var(--white); border:1px solid var(--rule); border-top:4px solid var(--gold); border-radius:6px; padding:28px 26px 24px; box-shadow:0 20px 44px rgba(34,37,42,.14)}
.focus-card > svg{width:44px; height:44px; margin-bottom:14px; fill:none; stroke:var(--gold-deep); stroke-width:2; stroke-linecap:round; stroke-linejoin:round}
.focus-eyebrow{margin:0; font-size:13px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--gold-ink)}
.focus-card h2{font-size:clamp(22px, 2vw, 25px); margin:6px 0 12px}
.focus-card ul{margin:0 0 12px; padding-left:1.1em; font-size:16px}
.focus-card li{margin-bottom:4px}
.focus-text{color:var(--muted); font-size:16px; margin:0 0 20px}
.focus-actions{margin-top:auto; display:flex; flex-wrap:wrap; align-items:center; gap:10px 18px}
.focus-more{font-weight:600; font-size:16px}
.also{margin:24px 0 0; color:var(--muted); font-size:16px}
.first-consult{border-top:0}

/* Home hero: a large photograph of the Madras High Court; the text sits on the charcoal side */
.hero{background:var(--charcoal); color:var(--on-dark)}
.hero-photo{position:relative; overflow:hidden; display:flex; align-items:center; min-height:clamp(560px, 82vh, 780px)}
.hero-photo picture{position:absolute; top:0; bottom:0; right:0; width:60%; overflow:hidden}
.hero-img{display:block; width:100%; height:100%; object-fit:cover; object-position:70% 40%}
.hero-shade{position:absolute; inset:0; pointer-events:none;
  background:
    linear-gradient(270deg, rgba(44,62,80,0) 0%, rgba(44,62,80,0) 42%, rgba(44,62,80,.72) 50%, var(--charcoal) 57%),
    linear-gradient(0deg, rgba(34,37,42,.3) 0%, rgba(34,37,42,0) 22%)}
.hero-content{position:relative; z-index:1; width:100%; display:grid; grid-template-columns:minmax(0,480px) minmax(0,1fr); padding-block:56px 132px}
.hero-content > *{grid-column:1}
.hero-logo{margin:0; line-height:0}
.hero-logo img{display:block; width:100%; max-width:250px; height:auto; filter:drop-shadow(0 6px 18px rgba(0,0,0,.35))}
.hero-title{margin:26px 0 0; color:var(--white); font-size:clamp(30px, 3.1vw, 42px); line-height:1.16; letter-spacing:-.005em}
.hero-tag{margin:22px 0 0; font-size:15px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--on-dark-muted)}
.rose-rule{display:block; width:72px; height:3px; border-radius:2px; background:var(--gold-grad); margin:20px 0 22px}
.hero-content .lede{margin:0 0 22px; font-size:19px; line-height:1.6; color:var(--on-dark); max-width:none}
.hero-courts{display:flex; flex-wrap:wrap; align-items:center; gap:10px 12px; margin:0 0 28px}
.hc-label{font-size:13px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--gold-hi)}
.hero-courts ul{display:flex; flex-wrap:wrap; gap:8px; list-style:none; margin:0; padding:0}
.hero-courts li{font-size:15px; font-weight:600; line-height:1.3; color:var(--white); border:1px solid rgba(214,175,90,.8); background:rgba(214,175,90,.1); border-radius:999px; padding:5px 14px}
.photo-credit{position:absolute; right:12px; top:12px; max-width:46%; padding:3px 9px; border-radius:3px; background:rgba(20,28,36,.55); z-index:2; margin:0; font-size:12px; line-height:1.4; color:rgba(255,255,255,.62)}
.photo-credit a{color:inherit}
.photo-credit a:hover{color:var(--white)}

/* Inner page hero */
.page-hero{position:relative; background:radial-gradient(900px 320px at 88% 0%, rgba(214,175,90,.16), rgba(214,175,90,0) 70%), var(--charcoal); color:var(--on-dark); padding-block:56px 52px}
.page-hero::after{content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--gold-grad)}
.crumbs{font-size:15px; color:var(--on-dark-muted); margin:0 0 14px; display:flex; flex-wrap:wrap; gap:8px}
.crumbs a{color:var(--on-dark-muted)}
.crumbs a:hover{color:var(--white)}
.page-hero h1{font-size:clamp(34px, 5vw, 50px); color:var(--white)}
.page-hero h1::after{content:""; display:block; width:64px; height:3px; border-radius:2px; background:var(--rose); margin-top:18px}
.page-hero .intro{max-width:60ch; font-size:20px; color:var(--on-dark-muted); margin:16px 0 0}

/* Sections */
.section{padding-block:84px}
.section + .section{border-top:1px solid var(--rule)}
.section-head{max-width:var(--measure); margin-bottom:40px}
.section-head h2::before{content:""; display:block; width:48px; height:3px; border-radius:2px; background:var(--gold-grad); margin-bottom:14px}
.section-head p{color:var(--muted); margin:12px 0 0}
.split{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.8fr); gap:56px; align-items:start}
.split > *{min-width:0}
.body-copy{max-width:var(--measure)}
.body-copy h3{margin:22px 0 6px}
.body-copy h3:first-child{margin-top:0}

/* Courts the firm's advocates practise in (home) */
.courts{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:24px}
.court-card{min-width:0; background:var(--white); border:1px solid var(--rule); border-top:3px solid var(--gold); border-radius:4px; padding:28px 26px 24px}
.court-card svg{display:block; width:46px; height:46px; margin-bottom:16px; fill:none; stroke:var(--gold-deep); stroke-width:2; stroke-linecap:round; stroke-linejoin:round}
.court-card h3{margin-bottom:8px}
.court-card p{margin:0; color:var(--muted); font-size:17px}

/* Settlement ladder (a real sequence) */
.ladder{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:0; counter-reset:rung; border-top:2px solid var(--gold)}
.ladder li{counter-increment:rung; padding:22px 24px 4px 0; position:relative}
.ladder li + li{padding-left:24px; border-left:1px solid var(--rule)}
.ladder li::before{content:counter(rung); display:block; font-family:var(--font-display); font-size:34px; line-height:1; color:var(--gold-deep); margin-bottom:12px}
.ladder h3{margin-bottom:8px}
.ladder p{color:var(--muted); font-size:17px; margin:0}
.note{margin-top:32px; max-width:var(--measure); color:var(--muted); font-size:17px}

/* Who we help in Coimbatore */
.trio{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:40px}
.trio > div{border-top:2px solid var(--emerald); padding-top:20px; min-width:0}
.trio h3{margin-bottom:8px}
.trio p{color:var(--muted); margin:0}

/* Practice list */
.practice-list{list-style:none; margin:0; padding:0; border-top:1px solid var(--rule); background:var(--white)}
.practice-list li{border-bottom:1px solid var(--rule)}
.practice-list a{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.6fr) auto; gap:32px; align-items:baseline; padding:24px 24px; text-decoration:none; color:var(--charcoal-dark)}
.practice-list a:hover{background:var(--emerald-tint)}
.practice-list a:hover h3{color:var(--emerald)}
.practice-list p{margin:0; color:var(--muted)}
.practice-list .go{font-size:15px; font-weight:600; color:var(--emerald); white-space:nowrap}

/* Insights list */
.posts{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:40px}
.post{border-top:1px solid var(--rule); padding-top:20px; min-width:0}
.post time{font-size:15px; color:var(--muted)}
.post h3{margin:6px 0 10px; font-size:22px}
.post h3 a{color:var(--charcoal); text-decoration:none}
.post h3 a:hover{color:var(--emerald); text-decoration:underline}
.post p{color:var(--muted); margin:0; font-size:17px}
.post-index{display:grid; gap:0; border-top:1px solid var(--rule); max-width:860px}
.post-index article{padding-block:30px; border-bottom:1px solid var(--rule)}
.post-index h2{font-size:clamp(24px, 3vw, 30px); margin:6px 0 10px}
.post-index h2 a{color:var(--charcoal); text-decoration:none}
.post-index h2 a:hover{color:var(--emerald); text-decoration:underline}
.post-index p{color:var(--muted); max-width:var(--measure); margin:0 0 10px}
.post-index time{font-size:15px; color:var(--muted)}

/* Contact band */
.band{background:var(--rose-tint); padding-block:72px; border-top:3px solid var(--rose)}
.ways{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:32px; margin:32px 0 20px}
.ways > div{min-width:0}
.ways h3{font-size:18px; margin-bottom:6px}
.ways p{margin:0}
.muted-line{font-size:15px; opacity:.8}
.urgent{margin:0 0 28px; font-weight:500; color:var(--charcoal)}

/* Team */
.team-strip{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:32px}
.team-card{display:block; min-width:0; text-decoration:none; color:inherit}
.team-card h3{font-size:20px; margin:16px 0 4px}
.team-card p{margin:0; color:var(--muted); font-size:16px}
.team-card:hover h3{color:var(--emerald)}
.team-card:hover .portrait img{transform:scale(1.03)}
.portrait{display:block; overflow:hidden; border-radius:4px; background:#DDE3E9; border-bottom:4px solid var(--gold); box-shadow:0 12px 28px rgba(34,37,42,.14)}
.portrait img{display:block; width:100%; height:auto; aspect-ratio:4/5; object-fit:cover; transition:transform .4s ease}
.roster{border-top:2px solid var(--charcoal)}
.member{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.6fr); gap:48px; padding-block:40px; border-bottom:1px solid var(--rule)}
.member > *{min-width:0}
.member-id{display:flex; flex-direction:column; gap:20px; align-items:flex-start}
.member-photo{flex:none; width:min(240px, 100%)}
.member h2{font-size:clamp(23px, 2.6vw, 28px)}
.member .creds{margin:6px 0 0; color:var(--muted)}
.member .role{margin:8px 0 0; font-weight:600; color:var(--emerald)}
.member-body{max-width:var(--measure)}
.member-body dl{display:grid; grid-template-columns:max-content minmax(0,1fr); gap:8px 24px; margin:20px 0 0; padding-top:18px; border-top:1px solid var(--rule)}
.member-body dt{color:var(--muted); font-size:16px}
.member-body dd{margin:0}

/* Practice page: steps + aside */
.practice{display:grid; grid-template-columns:minmax(0,1.75fr) minmax(0,1fr); gap:64px; align-items:start}
.practice > *{min-width:0}
.who{margin:0 0 48px; max-width:var(--measure)}
.who ul{margin:12px 0 0; padding-left:1.2em}
.who li{margin-bottom:4px}
.steps{list-style:none; margin:28px 0 0; padding:0; counter-reset:step}
.steps li{position:relative; counter-increment:step; padding:0 0 34px 68px}
.steps li::before{content:counter(step); position:absolute; left:0; top:-2px; width:44px; height:44px; border-radius:50%; background:var(--cream); border:2px solid var(--gold); color:var(--gold-ink); font-family:var(--font-display); font-size:20px; display:grid; place-items:center}
.steps li::after{content:""; position:absolute; left:22px; top:46px; bottom:6px; width:1px; background:var(--rule)}
.steps li:last-child{padding-bottom:0}
.steps li:last-child::after{display:none}
.steps h3{margin:6px 0 8px}
.steps p{margin:0}
.steps p + p{margin-top:8px}
.aside{display:grid; gap:24px}
.panel{background:var(--white); border:1px solid var(--rule); border-radius:4px; padding:26px 26px 22px}
.panel h2{font-size:22px; margin-bottom:12px}
.panel ul{margin:0; padding-left:1.1em}
.panel li{margin-bottom:8px; font-size:17px}
.panel p{font-size:17px}
.panel .btn{margin-top:6px}

/* Bare Acts */
.acts-tools{display:flex; flex-wrap:wrap; gap:16px 24px; align-items:end; margin-bottom:32px}
.acts-tools .field{margin:0; flex:1 1 320px; max-width:520px}
.acts-count{color:var(--muted); font-size:16px; margin:0 0 12px}
.acts-group{margin-top:44px}
.acts-group:first-of-type{margin-top:0}
.acts-group h2{font-size:clamp(24px, 3vw, 30px); margin-bottom:14px}
.acts{list-style:none; margin:0; padding:0; background:var(--white); border:1px solid var(--rule); border-radius:4px}
.acts > li{border-top:1px solid var(--rule)}
.acts > li:first-child{border-top:0}
.act-row{display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1.5fr) auto; gap:24px; align-items:baseline; padding:18px 22px}
.act-row h3{font-size:19px}
.act-row p{margin:0; color:var(--muted); font-size:16px}
.act-toggle{font:inherit; font-size:16px; font-weight:600; color:var(--emerald); background:var(--white); border:1px solid var(--emerald); border-radius:3px; padding:7px 14px; cursor:pointer; white-space:nowrap}
.act-toggle:hover{background:var(--emerald-tint)}
.act-toggle[aria-expanded="true"]{background:var(--btn-gold); border-color:#C9973A; color:var(--charcoal-dark)}

/* In-page Act reader */
.reader{border-top:1px solid var(--rule); background:var(--offwhite); padding:0 22px 24px}
.rd-bar{position:sticky; top:env(safe-area-inset-top, 0px); z-index:5; display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px; background:var(--charcoal); color:var(--white); margin:0 -22px; padding:10px 22px}
.rd-title{margin:0; font-family:var(--font-display); font-size:18px; font-weight:600; flex:1 1 220px; min-width:0}
.rd-find{display:flex; align-items:center; gap:6px; flex:1 1 320px; min-width:0}
.rd-find input{flex:1; min-width:0; font:inherit; font-size:15px; padding:7px 10px; border-radius:3px; border:1px solid transparent; color:var(--charcoal-dark); background:var(--white)}
.rd-find input:focus{outline:2px solid var(--white); outline-offset:1px}
.rd-count{font-size:14px; color:var(--on-dark-muted); white-space:nowrap; min-width:0}
.rd-bar button{font:inherit; font-size:14px; font-weight:600; color:var(--white); background:transparent; border:1px solid rgba(255,255,255,.45); border-radius:3px; padding:6px 10px; cursor:pointer}
.rd-bar button:hover{background:rgba(255,255,255,.12)}
.rd-meta{display:flex; flex-wrap:wrap; gap:4px 18px; font-size:15px; color:var(--muted); margin:16px 0 10px}
.rd-toc{background:var(--white); border:1px solid var(--rule); border-radius:3px; margin:0 0 20px}
.rd-toc summary{cursor:pointer; padding:10px 14px; font-weight:600; color:var(--emerald)}
.rd-toc ol{list-style:none; margin:0; padding:4px 14px 14px; max-height:340px; overflow-y:auto; font-size:15px; line-height:1.45}
.rd-toc li{margin:3px 0}
.rd-toc .toc-h1{margin-top:12px; font-weight:600}
.rd-toc .toc-h2{font-weight:600; color:var(--muted)}
.rd-toc .toc-s{padding-left:14px}
.rd-toc a{text-decoration:none}
.rd-toc a:hover{text-decoration:underline}
.rd-body{max-width:76ch; font-family:var(--font-display); font-size:17px; line-height:1.7; color:var(--charcoal-dark)}
.rd-body h3, .rd-body h4{scroll-margin-top:70px; text-align:center}
.rd-h1{font-size:20px; margin:30px 0 4px; color:var(--charcoal)}
.rd-h2{font-size:17px; margin:0 0 14px; color:var(--charcoal); font-weight:600}
.rd-sec{scroll-margin-top:70px; margin:0 0 18px}
.rd-sec h5{font-family:var(--font-display); font-size:17px; font-weight:700; margin:0 0 4px; color:var(--charcoal)}
.rd-num{color:var(--emerald)}
.rd-sec p, .rd-p{margin:0 0 6px}
.rd-notes{margin-top:6px; padding-left:12px; border-left:2px solid var(--rule); font-family:var(--font-body); font-size:14px; color:var(--muted); line-height:1.5}
.rd-notes p{margin:0 0 2px}
.rd-body mark{background:#FFE89A; color:inherit; border-radius:2px}
.rd-body mark.cur{background:var(--yellow); color:var(--charcoal-dark); outline:2px solid var(--gold-deep)}
.rd-end{margin-top:24px}
.rd-mark{color:var(--muted); font-weight:400; margin-right:2px}
.rd-note{background:#FFF7DD; border:1px solid #EBD9A0; color:#5C4A12; border-radius:3px; padding:10px 14px; font-size:15px; margin:0 0 16px; max-width:76ch}
.rd-pdf{border:1px solid var(--rule); border-radius:3px; overflow:hidden; background:var(--white); margin:0 0 16px}
.rd-pdf iframe{display:block; width:100%; height:min(80vh, 900px); border:0}
.rd-loading, .rd-pending{padding:20px 0 4px; margin:0; color:var(--muted)}
.rd-pending p{margin:0 0 6px}
.acts-empty{background:var(--white); border:1px solid var(--rule); border-radius:4px; padding:22px; color:var(--muted)}
.callout{background:var(--rose-tint); border:1px solid var(--rose-line); border-left:3px solid var(--rose-strong); border-radius:3px; padding:18px 22px; max-width:var(--measure); margin-bottom:36px}
.callout p{margin:0; font-size:17px}
.callout p + p{margin-top:8px}

.founder-fig{margin:32px 0 0}
.founder-fig img{display:block; width:100%; height:auto; border-radius:4px; box-shadow:0 14px 34px rgba(34,37,42,.16)}
.founder-fig figcaption{margin-top:12px; padding-left:12px; border-left:3px solid var(--rose); font-size:15px; color:var(--muted); line-height:1.5}

/* Quick contact buttons (contact, enquiry pages) */
.quick-contact{display:grid; grid-template-columns:repeat(auto-fit, minmax(230px, 1fr)); gap:12px; margin:0 0 28px}
.qc-btn{display:flex; align-items:center; gap:12px; min-height:64px; padding:12px 16px; background:var(--white); border:1px solid var(--rule); border-left:4px solid var(--emerald); border-radius:6px; text-decoration:none; color:var(--charcoal-dark); font-size:15px; line-height:1.3; min-width:0}
.qc-btn:hover{border-color:var(--emerald); background:var(--emerald-tint); color:var(--charcoal-dark)}
.qc-btn svg{width:24px; height:24px; flex:none; fill:none; stroke:var(--emerald); stroke-width:2; stroke-linecap:round; stroke-linejoin:round}
.qc-btn span{min-width:0; overflow-wrap:anywhere}
.qc-btn b{display:block; font-size:17px; color:var(--emerald)}
.enquiry-grid{display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:48px; align-items:start}
.enquiry-grid > *{min-width:0}
.enq-info h2{font-size:24px; margin:30px 0 12px}
.enq-list{margin:0; padding-left:1.2em}
.enq-list li{margin-bottom:6px}
.checklist{list-style:none; margin:0; padding:0}
.checklist li{position:relative; padding:6px 0 6px 32px; border-bottom:1px solid var(--rule)}
.checklist li::before{content:""; position:absolute; left:4px; top:12px; width:14px; height:8px; border-left:2px solid var(--emerald); border-bottom:2px solid var(--emerald); transform:rotate(-45deg)}
.steps-compact li{padding-bottom:22px}
.more-links{margin:20px 0 0; font-size:16px}
.enq-heading{font-size:clamp(24px, 2.6vw, 30px); margin:8px 0 16px}
.enq-grid{grid-template-columns:repeat(3, minmax(0,1fr)); margin-bottom:0}
.doc-sets{display:grid; gap:10px}
.doc-set{background:var(--white); border:1px solid var(--rule); border-radius:4px; padding:0 18px}
.doc-set summary{cursor:pointer; padding:14px 0; font-weight:600; color:var(--emerald)}
.doc-set[open] summary{border-bottom:1px solid var(--rule)}
.doc-set .checklist{margin:6px 0 10px}
.doc-set p{font-size:16px; margin:0 0 14px}
.panel-enquire{border-top:3px solid var(--gold)}
.pe-actions{display:flex; flex-wrap:wrap; gap:10px; margin:0 0 6px}
.pe-actions .btn{margin-top:0}

/* Free legal service */
.free-strip{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:20px 36px; margin-top:28px; padding:26px 30px; border-radius:8px; background:linear-gradient(120deg, #FFF8E2 0%, #FBEFC8 60%, #F7E3A8 100%); border:1px solid var(--gold-line); border-left:5px solid var(--gold)}
.free-strip > div:first-child{flex:1 1 420px; min-width:0}
.free-strip h2{font-size:clamp(22px, 2.4vw, 28px); margin:4px 0 8px}
.free-strip p{margin:0}
.free-eyebrow{margin:0; font-size:13px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--gold-ink)}
.free-strip-actions{display:flex; flex-wrap:wrap; align-items:center; gap:12px 18px}
.free-more{font-weight:600}
.free-card{position:sticky; top:24px; background:linear-gradient(160deg, #2C3E50 0%, #22252A 100%); color:var(--on-dark); border-radius:8px; border-top:4px solid var(--gold); padding:28px 26px; box-shadow:0 20px 44px rgba(34,37,42,.2)}
.free-card .free-eyebrow{color:var(--gold-hi)}
.free-card h2{color:var(--white); font-size:24px; margin:6px 0 18px}
.btn-block{display:flex; align-items:center; justify-content:center; width:100%; margin-bottom:12px}
.free-card .btn-line{color:var(--white); border-color:rgba(214,175,90,.8)}
.free-card .btn-line:hover{background:rgba(214,175,90,.12); color:var(--white)}
.free-card .btn svg{flex:none}
.free-hours, .free-addr{font-size:15px; color:var(--on-dark-muted); margin:6px 0 0}
.free-card a:not(.btn){color:var(--gold-hi)}
a.free-link{border-color:var(--gold-line); background:#FFF8E2}
.ext-note{font-size:14px; color:var(--muted)}

/* Client and advocate portal */
.p-userbar{background:#1E2B38; color:var(--on-dark-muted); font-size:15px; border-bottom:1px solid rgba(214,175,90,.35)}
.p-userbar-in{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 20px; min-height:46px}
.p-userbar p{margin:0}
.p-userbar strong{color:var(--white)}
.p-userbar nav{display:flex; flex-wrap:wrap; align-items:center; gap:6px 18px}
.p-userbar a{color:var(--gold-hi)}
.p-userbar form{margin:0}
.p-userbar button{font:inherit; color:var(--white); background:none; border:1px solid rgba(214,175,90,.7); border-radius:999px; padding:3px 14px; cursor:pointer}
.p-userbar button:hover{background:rgba(214,175,90,.15)}
.p-eyebrow{margin:0 0 10px; font-size:13px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--gold-hi)}
.p-section{padding-block:48px 72px}
.p-flash{background:#FBEFC8; border:1px solid var(--gold-line); border-left:4px solid var(--gold); border-radius:4px; padding:12px 16px; margin:24px 0 0}
.p-section .p-flash{margin:0 0 18px}
.p-error{background:#F6E4E1; color:var(--err); border-radius:4px; padding:12px 14px; margin:0 0 18px}
.p-login{display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:44px; align-items:start}
.p-login > *{min-width:0}
.p-card{background:var(--white); border:1px solid var(--rule); border-top:3px solid var(--gold); border-radius:6px; padding:clamp(20px, 3vw, 32px); box-shadow:0 10px 30px rgba(34,37,42,.06)}
.p-narrow{max-width:620px}
.p-side h2{font-size:22px; margin:0 0 10px}
.p-side h2 + p{margin-bottom:12px}
.p-side h2:not(:first-child){margin-top:30px}
.p-roles{border:0; margin:0 0 18px; padding:0; display:flex; flex-wrap:wrap; gap:10px}
.p-roles legend{font-weight:500; font-size:16px; margin-bottom:8px; padding:0}
.p-roles label{position:relative; cursor:pointer}
.p-roles input{position:absolute; opacity:0; width:1px; height:1px}
.p-roles span{display:inline-block; padding:10px 20px; border:1px solid var(--field); border-radius:999px; font-weight:600; background:var(--white)}
.p-roles input:checked + span{background:var(--btn-gold); border-color:#C9973A; color:var(--charcoal-dark)}
.p-roles input:focus-visible + span{outline:3px solid var(--emerald-teal); outline-offset:2px}
.p-code{font-size:28px !important; letter-spacing:.35em; text-align:center; font-variant-numeric:tabular-nums}
.p-alt{display:flex; flex-wrap:wrap; gap:8px 22px; margin-top:18px}
.p-alt form, .p-inline{display:inline; margin:0}
.p-linkbtn{font:inherit; font-size:15px; color:var(--emerald); background:none; border:0; padding:0; text-decoration:underline; text-underline-offset:3px; cursor:pointer}
.p-small{font-size:15px; color:var(--muted)}
.p-note{margin-top:28px}
.p-sub{display:block; font-size:14px; color:var(--muted); font-weight:400}
.p-inline .p-linkbtn, p .p-sub, dd .p-sub{display:inline}
.p-toolbar{display:flex; flex-wrap:wrap; gap:12px; margin-bottom:22px}
.p-filters{display:flex; flex-wrap:wrap; align-items:end; gap:12px 16px; background:var(--white); border:1px solid var(--rule); border-radius:6px; padding:16px 18px; margin-bottom:14px}
.p-filters .field{margin:0; flex:1 1 180px}
.p-filters .field:first-child{flex:2 1 260px}
.p-check{display:flex; align-items:center; gap:8px; font-size:16px; margin:6px 0 14px; cursor:pointer}
.p-check input{width:18px; height:18px; accent-color:var(--gold-deep)}
.p-filters .p-check{margin:0 0 10px}
.p-count{color:var(--muted); font-size:15px; margin:0 0 10px}
.p-tablewrap{overflow-x:auto; border:1px solid var(--rule); border-radius:6px; background:var(--white); margin-bottom:34px}
.p-table{width:100%; border-collapse:collapse; font-size:16px; line-height:1.45}
.p-table th, .p-table td{text-align:left; vertical-align:top; padding:12px 14px; border-bottom:1px solid var(--rule)}
.p-table thead th{background:var(--charcoal); color:var(--white); font-weight:600; font-size:15px; white-space:nowrap}
.p-table tbody tr:hover td{background:#FFFBEF}
.p-table td.p-soon{background:#FBEFC8; font-weight:600}
.p-table .p-actions{white-space:nowrap}
.p-table .p-actions form{margin-right:12px}
.p-table select{font:inherit; font-size:14px; padding:2px 4px; margin-right:6px}
.p-muted td{color:var(--muted)}
.p-log{font-size:14px}
.p-status{display:inline-block; font-size:14px; font-weight:600; color:var(--gold-ink); background:var(--cream); border:1px solid var(--gold-line); border-radius:999px; padding:2px 10px; white-space:nowrap}
.p-empty{max-width:620px}
.p-cases{display:grid; grid-template-columns:repeat(auto-fill, minmax(320px, 1fr)); gap:20px}
.p-casecard{background:var(--white); border:1px solid var(--rule); border-top:3px solid var(--gold); border-radius:6px; padding:22px 24px}
.p-casecard h2{font-size:22px; margin:4px 0 12px}
.p-casecard h2 a{color:var(--charcoal); text-decoration:none}
.p-casecard h2 a:hover{color:var(--emerald); text-decoration:underline}
.p-latest{font-size:15px; background:var(--offwhite); border-radius:4px; padding:10px 12px}
.p-latest span{display:block; font-size:13px; color:var(--muted)}
.p-dl{display:grid; grid-template-columns:max-content minmax(0,1fr); gap:8px 20px; margin:0}
.p-dl dt{color:var(--muted); font-size:15px}
.p-dl dd{margin:0; overflow-wrap:anywhere}
.p-dl-inline{margin-bottom:12px}
.p-casegrid{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); gap:36px; align-items:start}
.p-casegrid > *{min-width:0}
.p-h2{font-size:24px; margin:0 0 14px}
.p-section .p-h2:not(:first-child){margin-top:10px}
.p-internal{margin-top:20px; background:#FFF8E2; border:1px dashed var(--gold); border-radius:6px; padding:16px 18px}
.p-internal h2{font-size:18px; margin:0 0 8px}
.p-timeline{list-style:none; margin:0 0 24px; padding:0; border-left:2px solid var(--gold-line)}
.p-timeline li{position:relative; padding:0 0 16px 20px}
.p-timeline li::before{content:""; position:absolute; left:-7px; top:6px; width:12px; height:12px; border-radius:50%; background:var(--gold)}
.p-timeline p{margin:0 0 4px}
.p-meta{display:flex; flex-wrap:wrap; align-items:center; gap:4px 10px; font-size:14px; color:var(--muted); margin-bottom:4px}
.p-meta .p-tag{margin-left:0}
.p-meta form{margin-left:auto}
.p-tag{display:inline-block; font-size:12px; font-weight:600; border-radius:999px; padding:1px 8px; background:#EEF1F4; color:var(--muted); margin-left:6px}
.p-tag-shared{background:#FBEFC8; color:var(--gold-ink)}
.p-back{margin:0 0 18px; font-size:16px}
.p-clients{border:1px solid var(--rule); border-radius:4px; padding:10px 14px 4px; margin:0 0 18px; max-height:280px; overflow-y:auto}
.p-clients legend{font-weight:500; font-size:16px; padding:0 4px}
.p-clients .p-check{margin:4px 0 8px}
body.portal .dock{display:none}
.p-import h2{font-size:26px; margin:0 0 14px}
.p-enter{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}
.p-opt{font-weight:400; font-size:14px; color:var(--muted)}
.p-caseform .row2{align-items:end}
.p-titlefield{padding-bottom:4px; border-bottom:1px solid var(--rule); margin-bottom:22px}
.p-titlefield input{font-size:19px; font-weight:600}
.p-titlefield input.is-auto{background:var(--cream); border-color:var(--gold-line); color:var(--charcoal-dark); cursor:default}
.p-titlefield .p-check{margin:10px 0 12px; justify-self:start}
.field .p-check input{width:18px; height:18px; padding:0; flex:none}
.p-sides{display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:16px; align-items:start; margin-bottom:22px}
.p-vs{margin:44px 0 0; font-family:var(--font-display); font-weight:600; font-size:18px; color:var(--gold-ink)}
.p-parties{border:1px solid var(--rule); border-top:3px solid var(--gold-line); border-radius:6px; padding:12px 16px 16px; margin:0; min-width:0; background:#FFFDF7}
.p-parties legend{font-weight:600; font-size:18px; padding:0 6px; margin-left:-6px}
.p-parties .hint{font-size:14px; color:var(--muted); margin:0 0 10px}
.p-party{display:grid; grid-template-columns:minmax(0,1fr); gap:4px; margin-bottom:12px}
.p-party label{font-size:15px; font-weight:500}
.p-party-row{display:flex; gap:8px; align-items:center}
.p-party-row input{flex:1 1 auto; min-width:0; width:100%; font:inherit; font-size:17px; color:var(--charcoal-dark); background:var(--white); border:1px solid var(--field); border-radius:3px; padding:10px 12px}
.p-party-row input:focus{outline:2px solid var(--emerald); outline-offset:1px; border-color:var(--emerald)}
.p-party-del{flex:none; font:inherit; font-size:14px; color:var(--err); background:none; border:1px solid #E6C9C4; border-radius:999px; padding:6px 12px; cursor:pointer}
.p-party-del:hover{background:#F6E4E1}
.p-party-add{font-size:15px; padding:8px 16px; margin-top:2px}
.p-plist{margin:0; padding-left:1.3em}
.p-plist li{margin:0 0 2px}
.p-plist li:first-child{font-weight:600}
.p-plist li.p-sub{display:list-item; font-weight:400; list-style:none; margin-left:-1.3em}
.p-dl dd .p-plist{margin:0}
.p-casehead{font-size:15px; color:var(--muted); margin:-6px 0 18px}
.p-import table td:first-child{font-variant-numeric:tabular-nums; white-space:nowrap}
.p-import .p-new{color:var(--gold-ink); font-weight:600}
.p-import .p-chg{font-size:14px; color:var(--charcoal)}
.p-import input[type=file]{font:inherit; font-size:16px; padding:10px; border:1px dashed var(--gold); border-radius:4px; background:#FFFDF7; width:100%}
.p-steps{margin:0 0 18px; padding-left:1.3em}
.p-steps li{margin-bottom:6px}
.p-sum{display:flex; flex-wrap:wrap; gap:10px 22px; margin:0 0 16px; padding:0; list-style:none}
.p-sum li{background:var(--cream); border:1px solid var(--gold-line); border-radius:6px; padding:8px 14px}
.p-sum strong{font-size:22px; margin-right:6px}
.p-filters .p-checks{display:flex; flex-direction:column; gap:0}
.p-two{display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:24px; align-items:start; margin-bottom:34px}
@media (max-width: 860px){
  .p-login, .p-casegrid, .p-two{grid-template-columns:1fr}
  .p-sides{grid-template-columns:1fr; gap:8px}
  .p-vs{margin:0; text-align:center}
}
@media (max-width: 720px){
  .p-dl{grid-template-columns:1fr; gap:2px}
  .p-dl dd{margin-bottom:8px}
  .p-cases{grid-template-columns:1fr}
}

/* Article */
.article{padding-block:64px 84px}
.prose{max-width:var(--measure); font-size:19px; line-height:1.7}
.prose h2{font-size:27px; margin:1.6em 0 .5em}
.prose ul{padding-left:1.2em; margin:0 0 1em}
.prose li{margin-bottom:6px}
.byline{color:var(--muted); font-size:16px; margin:0 0 20px}
.fineprint{margin-top:40px; padding-top:18px; border-top:2px solid var(--rose-line); color:var(--muted); font-size:16px; max-width:var(--measure)}

/* Contact page */
.contact-grid{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); gap:56px; align-items:start}
.contact-grid > *{min-width:0}
.details{display:grid; gap:22px}
.details h2{font-size:20px; margin-bottom:4px}
.details p{margin:0}
.map{position:relative; margin-top:30px; border:1px solid var(--rule); border-radius:4px; overflow:hidden; aspect-ratio:4/3; max-width:100%; background:var(--tint)}
.map .fallback{position:absolute; inset:0; display:grid; place-items:center; text-align:center; padding:24px; color:var(--muted); font-size:16px}
.map iframe{position:relative; width:100%; height:100%; border:0; display:block}
.form{background:var(--white); border:1px solid var(--rule); border-radius:4px; padding:clamp(22px, 4vw, 36px)}
.form h2{font-size:26px; margin-bottom:6px}
.form > p{color:var(--muted); font-size:16px}
.field{display:grid; gap:6px; margin-bottom:18px}
.field label{font-weight:500; font-size:16px}
.field .hint{font-size:14px; color:var(--muted)}
.field input, .field select, .field textarea{font:inherit; font-size:17px; color:var(--charcoal-dark); background:var(--white); border:1px solid var(--field); border-radius:3px; padding:11px 12px; width:100%}
.field textarea{min-height:140px; resize:vertical}
.field input:focus, .field select:focus, .field textarea:focus{outline:2px solid var(--emerald); outline-offset:1px; border-color:var(--emerald)}
.row2{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px}
.consent{display:flex; gap:12px; align-items:flex-start; font-size:15px; color:var(--muted); margin:6px 0 22px}
.consent input{margin-top:5px; width:18px; height:18px; flex:none; accent-color:var(--emerald)}
.hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}
.status{border-radius:3px; padding:12px 14px; font-size:16px; margin-bottom:18px}
.status.ok{background:var(--emerald-tint); color:var(--ok)}
.status.err{background:#F6E4E1; color:var(--err)}

/* Legal pages */
.legal{max-width:var(--measure)}
.legal h2{font-size:24px; margin:1.6em 0 .5em}
.legal ul{padding-left:1.2em}
.legal li{margin-bottom:6px}
.boxed{background:var(--white); border:1px solid var(--rule); border-left:3px solid var(--emerald); padding:24px 26px; border-radius:3px}
.boxed h2{margin-top:0}

/* Footer */
.site-foot{position:relative; background:var(--charcoal-dark); color:var(--on-dark-muted); font-size:16px; padding-block:56px 32px; border-top:3px solid var(--rose)}
.site-foot::before{content:""; position:absolute; left:0; right:0; top:0; height:2px; background:var(--gold-grad)}
.site-foot a{color:var(--white)}
.site-foot a:hover{color:var(--on-dark-muted)}
.foot-grid{display:grid; grid-template-columns:minmax(0,1.4fr) repeat(3, minmax(0,1fr)); gap:36px}
.foot-grid > div{min-width:0}
.foot-grid h2{font-size:17px; color:var(--gold); margin-bottom:10px; font-family:var(--font-body); font-weight:600}
.foot-grid ul{list-style:none; margin:0; padding:0; display:grid; gap:6px}
.foot-contact ul{gap:10px}
.fc-link{display:inline-flex; align-items:flex-start; gap:10px; text-decoration:none}
.fc-link:hover span{text-decoration:underline}
.fc-link svg{width:18px; height:18px; flex:none; margin-top:3px; fill:none; stroke:var(--gold); stroke-width:2; stroke-linecap:round; stroke-linejoin:round}
.fc-hours{margin:14px 0 8px}
.foot-name{margin:0 0 14px; line-height:0}
.foot-name img{display:block; width:190px; height:auto}
.foot-base{display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px 32px; border-top:1px solid rgba(255,255,255,.14); margin-top:40px; padding-top:22px; font-size:14px}
.foot-base p{margin:0}
.foot-base button{background:none; border:0; padding:0; font:inherit; color:var(--white); text-decoration:underline; text-underline-offset:3px; cursor:pointer}

/* Disclaimer dialog */
dialog{max-width:640px; width:calc(100% - 32px); border:0; border-radius:4px; padding:0; color:var(--charcoal-dark); background:var(--white); box-shadow:0 30px 80px rgba(0,0,0,.45)}
dialog::backdrop{background:rgba(34,37,42,.78)}
.dlg{padding:34px clamp(22px, 5vw, 40px) 30px; border-top:5px solid var(--gold)}
.dlg h2{font-size:27px; margin-bottom:14px}
.dlg p, .dlg li{font-size:16px; line-height:1.55}
.dlg ul{padding-left:1.2em; margin:0 0 1em}
.dlg li{margin-bottom:8px}
.dlg .actions{margin-top:22px}

/* Quick questions assistant + WhatsApp */
.dock{position:fixed; right:16px; bottom:calc(16px + env(safe-area-inset-bottom, 0px)); z-index:40; display:flex; flex-direction:column; align-items:flex-end; gap:10px}
.dock-btn{display:inline-flex; align-items:center; gap:8px; font:inherit; font-size:16px; font-weight:600; line-height:1; padding:12px 18px; border-radius:999px; cursor:pointer; text-decoration:none; box-shadow:0 8px 22px rgba(34,37,42,.25)}
.dock-btn svg{width:20px; height:20px; flex:none}
.dock-wa, .dock-call{background:var(--white); color:var(--emerald); border:2px solid var(--emerald)}
.dock-call{display:none}
.dock-wa:hover{background:var(--emerald-tint); color:var(--emerald)}
.dock-ask{background:var(--btn-gold); color:var(--charcoal-dark); border:2px solid #C9973A}
.dock-ask:hover{background:var(--btn-gold-hover); border-color:#E0AE3E}
.qa{position:fixed; right:16px; bottom:calc(16px + env(safe-area-inset-bottom, 0px)); z-index:41; width:min(400px, calc(100vw - 32px)); height:min(620px, calc(100vh - 32px)); display:flex; flex-direction:column; background:var(--white); border-radius:8px; overflow:hidden; box-shadow:0 24px 60px rgba(34,37,42,.35); border:1px solid var(--rule)}
.qa-head{background:var(--charcoal); color:var(--white); border-top:3px solid var(--rose); padding:16px 18px; display:flex; justify-content:space-between; align-items:flex-start; gap:12px}
.qa-head h2{color:var(--white); font-size:20px}
.qa-head p{margin:2px 0 0; font-size:14px; color:var(--on-dark-muted)}
.qa-close{background:none; border:1px solid rgba(255,255,255,.4); color:var(--white); border-radius:3px; font:inherit; font-size:14px; padding:4px 10px; cursor:pointer}
.qa-log{flex:1; overflow-y:auto; padding:16px; display:flex; flex-direction:column; gap:12px; background:var(--offwhite)}
.msg{max-width:88%; font-size:16px; line-height:1.5; padding:10px 14px; border-radius:10px}
.msg p{margin:0}
.msg p + p, .msg ul{margin-top:8px}
.msg ul{padding-left:1.1em; margin-bottom:0}
.msg-bot{align-self:flex-start; background:var(--white); border:1px solid var(--rule); border-top-left-radius:2px}
.msg-user{align-self:flex-end; background:#FBEFC8; color:var(--charcoal-dark); border:1px solid var(--gold-line); border-top-right-radius:2px}
.chips{display:flex; flex-wrap:wrap; gap:8px}
.chip{font:inherit; font-size:15px; line-height:1.3; text-align:left; background:var(--white); color:var(--emerald); border:1px solid var(--emerald); border-radius:999px; padding:6px 12px; cursor:pointer}
.chip:hover{background:var(--emerald-tint)}
.qa-form{display:flex; gap:8px; padding:12px; border-top:1px solid var(--rule); background:var(--white)}
.qa-form input{flex:1; min-width:0; font:inherit; font-size:16px; border:1px solid var(--field); border-radius:4px; padding:10px 12px}
.qa-form input:focus{outline:2px solid var(--emerald); outline-offset:1px}
.qa-form button{font:inherit; font-size:16px; font-weight:600; background:var(--btn-gold); color:var(--charcoal-dark); border:0; border-radius:4px; padding:10px 16px; cursor:pointer}
.qa-foot{padding:0 12px 12px; background:var(--white); display:grid; grid-template-columns:1fr 1fr; gap:8px}
.qa-foot a, .qa-foot button{display:block; text-align:center; font:inherit; font-weight:600; font-size:14px; line-height:1.3; text-decoration:none; border:1px solid var(--emerald); color:var(--emerald); background:var(--white); border-radius:4px; padding:9px 8px; cursor:pointer}
.qa-foot a:hover, .qa-foot button:hover{background:var(--emerald-tint)}
.qlist{display:grid; gap:6px}
.qitem{font:inherit; font-size:15px; line-height:1.35; text-align:left; color:var(--charcoal-dark); background:var(--white); border:1px solid var(--rule); border-left:3px solid var(--emerald); border-radius:4px; padding:9px 12px; cursor:pointer}
.qitem:hover{background:var(--emerald-tint)}
.msg-q{font-weight:600; color:var(--charcoal)}
.msg-more{font-size:14px; color:var(--muted)}
.msg-wa{display:inline-flex; align-items:center; gap:8px; background:var(--btn-gold); color:var(--charcoal-dark); text-decoration:none; font-weight:600; border-radius:999px; padding:8px 14px}
.msg-wa:hover{background:var(--btn-gold-hover); color:var(--charcoal-dark)}
.msg-wa svg{width:18px; height:18px}

/* Instagram */
.ig-link{display:inline-flex; align-items:center; gap:6px}
.ig-link svg{flex:none}
.follow{margin-top:40px}

/* Consumer guides */
.in-short{background:var(--cream); border-left:3px solid var(--gold); border-radius:3px; padding:18px 22px; margin:0 0 8px}
.in-short h2{font-size:20px; margin:0 0 6px}
.in-short p{margin:0}
.prose h3{font-size:21px; margin:1.3em 0 .35em}
.prose ol{padding-left:1.4em; margin:0 0 1em}
.prose ol li{margin-bottom:8px}
.prose table{width:100%; border-collapse:collapse; margin:8px 0 1.2em; font-size:17px; line-height:1.45}
.prose th, .prose td{text-align:left; vertical-align:top; padding:10px 12px; border-bottom:1px solid var(--rule)}
.prose thead th{background:var(--charcoal); color:var(--white); font-weight:600; border-bottom:0}
.prose tbody tr:nth-child(even) td{background:var(--offwhite)}
.notice-format{background:var(--white); border:1px solid var(--rule); border-radius:4px; padding:20px 22px; margin:0 0 1.2em; font-size:17px}
.notice-format p{margin:0 0 12px}
.notice-format ol{margin-bottom:12px}
.faq h3{font-size:19px; margin:1.1em 0 .3em}
.faq p{margin:0}
.related{max-width:var(--measure); margin-top:44px}
.related h2{font-size:22px; margin-bottom:10px}
.related ul{margin:0; padding-left:1.1em}
.related li{margin-bottom:6px}
.guide-grid{list-style:none; margin:16px 0 48px; padding:0; display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:16px}
.guide-grid a{display:flex; flex-direction:column; gap:6px; height:100%; background:var(--white); border:1px solid var(--rule); border-radius:4px; padding:20px 22px; text-decoration:none; color:inherit}
.guide-grid a:hover{border-color:var(--emerald); box-shadow:0 6px 18px rgba(34,37,42,.08)}
.g-title{font-family:var(--font-display); font-weight:600; font-size:21px; line-height:1.2; color:var(--emerald)}
.g-sum{font-size:16px; color:var(--muted)}
.hub-info{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:24px; align-items:start}
.panel .note{margin:12px 0 0; font-size:15px; color:var(--muted)}

.guide-grid.compact{grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px; margin:0}
.guide-grid.compact a{padding:16px 18px; flex-direction:row; align-items:center; justify-content:space-between}
.guide-grid.compact a::after{content:"→"; color:var(--emerald); font-weight:600; margin-left:10px}
.guide-grid.compact .g-title{font-size:19px}
.faq-title{margin-top:48px}

/* Tamil pages and the language switch */
html[lang="ta"]{--font-body:"Mukta Malar", "Nirmala UI", "Latha", "Noto Sans Tamil", system-ui, sans-serif; --font-display:"Noto Serif Tamil", "Nirmala UI", "Latha", serif}
html[lang="ta"] .prose{line-height:1.8}
html[lang="ta"] .page-hero h1{line-height:1.3}
html[lang="ta"] h2, html[lang="ta"] h3{line-height:1.35}
:lang(ta) .g-title{line-height:1.4}
.lang-switch{margin:14px 0 0}
.lang-switch a{display:inline-flex; align-items:center; gap:6px; font-size:16px; font-weight:600; color:var(--white); border:1px solid rgba(255,255,255,.45); border-radius:999px; padding:5px 14px; text-decoration:none}
.lang-switch a::before{content:"அ / A"; font-size:13px; opacity:.8; margin-right:4px}
.lang-switch a:hover{background:rgba(255,255,255,.12)}

/* Search */
.search-btn{display:inline-flex; align-items:center; gap:6px; color:var(--on-dark-muted); text-decoration:none; font-size:16px; order:3}
.search-btn:hover, .search-btn[aria-current="page"]{color:var(--white)}
.nav{order:2}
.site-search{display:flex; gap:10px; max-width:720px}
.site-search input{flex:1; min-width:0; font:inherit; font-size:18px; border:1px solid var(--field); border-radius:4px; padding:12px 14px; background:var(--white)}
.site-search input:focus{outline:2px solid var(--emerald); outline-offset:1px}
.site-search button{font:inherit; font-size:17px; font-weight:600; background:var(--btn-gold); color:var(--charcoal-dark); border:0; border-radius:4px; padding:12px 20px; cursor:pointer}
.search-status{color:var(--muted); margin:16px 0 8px; max-width:720px}
.search-results{list-style:none; margin:0; padding:0; max-width:820px}
.search-results li{padding:20px 0; border-bottom:1px solid var(--rule)}
.search-results h2{font-size:22px; margin:4px 0 6px}
.search-results h2 a{color:var(--charcoal); text-decoration:none}
.search-results h2 a:hover{color:var(--emerald); text-decoration:underline}
.search-results p{margin:0; color:var(--muted); font-size:17px}
.search-results mark{background:var(--emerald-tint); color:inherit; padding:0 2px; border-radius:2px}
.sr-kind{font-size:13px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--emerald)}
.sr-answer{font-size:17px}
.sr-answer p{margin:0 0 8px}

/* Responsive */
@media (max-width: 1180px){
  .tb-info span + span{display:none}
  .nav{gap:22px}
  .search-btn span{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
}
@media (max-width: 900px){
  .menu-btn{display:inline-block; flex:none; order:2}
  .search-btn{order:1; flex:none}
  .bar{flex-wrap:wrap}
  .mark{flex:1 1 200px; min-width:0}
  .nav{order:3; display:none; width:100%; flex-direction:column; align-items:stretch; gap:0}
  .nav.open{display:flex}
  .nav > li{border-top:1px solid rgba(255,255,255,.14)}
  .dd-btn, .nav-link{display:flex; width:100%; justify-content:space-between; padding:14px 0; border-bottom:0}
  .dd-btn.is-current{border-bottom:0}
  .dd{position:static; min-width:0; box-shadow:none; border-radius:0; border-top:0; background:transparent; padding:0 0 10px 12px}
  .dd::before{display:none}
  .dd a{color:var(--on-dark-muted); padding:9px 6px}
  .dd a:hover, .dd a:focus-visible{background:rgba(255,255,255,.06); color:var(--gold-hi)}
  .dd a.dd-free{color:var(--gold-hi); border-top-color:rgba(255,255,255,.14)}
  .dd a[href="practice-areas.html"]{color:var(--on-dark-muted)}
}
@media (max-width: 980px){
  .ways{grid-template-columns:repeat(2, minmax(0,1fr))}
  .foot-grid{grid-template-columns:repeat(2, minmax(0,1fr))}
  .ladder{grid-template-columns:repeat(2, minmax(0,1fr))}
  .ladder li:nth-child(3){padding-left:0; border-left:0}
  .ladder li:nth-child(n+3){border-top:1px solid var(--rule); margin-top:18px}
  .act-row{grid-template-columns:minmax(0,1fr) auto}
  .act-row p{grid-column:1 / -1; grid-row:2}
}
@media (max-width: 860px){
  .focus{margin-top:0; padding-top:36px}
  .focus-grid, .quick-contact, .enquiry-grid, .enq-grid{grid-template-columns:1fr}
  .enquiry-grid{gap:36px}
  .hero-title{font-size:clamp(28px, 7.4vw, 36px); margin-top:20px}
  .courts{grid-template-columns:1fr; gap:16px}
  .hero-photo{display:block; min-height:0}
  .hero-photo picture{position:relative; display:block; width:100%}
  .hero-img{height:auto; aspect-ratio:4/3; object-position:40% 50%}
  .hero-shade{bottom:auto; height:75vw; background:linear-gradient(180deg, rgba(44,62,80,0) 52%, rgba(44,62,80,.85) 86%, var(--charcoal) 100%)}
  .hero-content{display:block; margin-top:-64px; padding-block:0 52px}
  .hero-logo img{max-width:min(230px, 60vw)}
  .photo-credit{position:static; max-width:none; padding:0 var(--gutter) 14px; background:none; border-radius:0}
  .member-id{flex-direction:row; gap:18px}
  .member-photo{width:150px}
  .split, .practice, .contact-grid{grid-template-columns:1fr; gap:36px}
  .trio, .posts{grid-template-columns:1fr; gap:28px}
  .team-strip{grid-template-columns:repeat(2, minmax(0,1fr)); gap:28px 20px}
  .member{grid-template-columns:1fr; gap:20px}
  .guide-grid, .hub-info{grid-template-columns:1fr}
  .guide-grid.compact{grid-template-columns:repeat(2, minmax(0,1fr))}
  .practice-list a{grid-template-columns:1fr; gap:6px}
  .aside{position:static}
}
@media (max-width: 720px){
  .tb-info{display:none}
  .topbar-in{padding-inline:0}
  .tb-links{width:100%; display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:0}
  .tb-links li + li{border-left:1px solid rgba(255,255,255,.12)}
  .tb-links a{flex-direction:column; justify-content:center; gap:3px; width:100%; min-height:52px; font-size:13px; font-weight:600}
  .topbar svg{width:18px; height:18px}
  .tb-v{display:none}
  .tb-l{display:inline}
  a.tb-enq{border-radius:0; padding:0; background:linear-gradient(135deg, var(--gold-hi), var(--gold) 55%, var(--gold-deep))}
  .dock-call{display:inline-flex; width:48px; height:48px; padding:0; justify-content:center}
  .dock-call span{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
  body{font-size:17px}
  .section{padding-block:60px}
  .ladder{grid-template-columns:1fr}
  .ladder li, .ladder li + li{padding-left:0; border-left:0}
  .ladder li + li{border-top:1px solid var(--rule); margin-top:18px}
  .ways, .foot-grid, .row2{grid-template-columns:1fr}
  .member-body dl{grid-template-columns:1fr; gap:2px}
  .member-body dd{margin-bottom:10px}
  .steps li{padding-left:58px}
  .prose{font-size:18px}
  .act-row{grid-template-columns:1fr; gap:8px; padding:16px}
  .act-row p{grid-row:auto}
  .act-toggle{justify-self:start}
  .reader{padding:0 14px 20px}
  .rd-bar{margin:0 -14px; padding:10px 14px}
  .rd-body{font-size:16px}
  .prose table{font-size:15px}
  .guide-grid.compact{grid-template-columns:1fr}
  .prose th, .prose td{padding:8px 8px}
  .prose th, .prose td{overflow-wrap:anywhere}
  html[lang="ta"] .prose table{font-size:14px}
  .bar{gap:12px 16px}
  .mark{gap:8px}
  .mark-logo{height:30px}
  .mark-text{padding-left:8px}
  .mark b{font-size:16px}
  .menu-btn{padding:6px 12px}
  .mark small{display:none}
  .member-photo{width:116px}
  .dock{right:12px; bottom:calc(12px + env(safe-area-inset-bottom, 0px)); flex-direction:row; align-items:center; gap:8px}
  .dock-btn{padding:12px 16px; font-size:15px}
  .dock-wa{width:48px; height:48px; padding:0; justify-content:center}
  .dock-wa span{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
  .qa{right:8px; left:8px; width:auto; bottom:calc(8px + env(safe-area-inset-bottom, 0px)); height:min(560px, calc(100vh - 80px))}
  .site-foot{padding-bottom:84px}
}
/* Motion: an entrance for the top of each page, gentle reveals as sections scroll into view
   (site.js adds .reveal only to content below the first screen), and small hover lifts.
   Everything here is switched off for visitors who ask their device for reduced motion. */
.reveal{opacity:0; transform:translateY(22px); transition:opacity .7s cubic-bezier(.2,.65,.3,1), transform .7s cubic-bezier(.2,.65,.3,1); transition-delay:var(--rd, 0s)}
.reveal.in{opacity:1; transform:none}
@keyframes hero-zoom{from{transform:scale(1.08)} to{transform:scale(1)}}
@keyframes rise{from{opacity:0; transform:translateY(18px)} to{opacity:1; transform:none}}
@keyframes draw{from{width:0; opacity:0} to{width:72px; opacity:1}}
@keyframes draw-64{from{width:0} to{width:64px}}
@keyframes dock-in{from{opacity:0; transform:translateY(16px)} to{opacity:1; transform:none}}
@keyframes pop{from{opacity:0; transform:translateY(14px) scale(.98)} to{opacity:1; transform:none}}
@keyframes fade{from{opacity:0} to{opacity:1}}
@media (prefers-reduced-motion: no-preference){
  .hero-img{animation:hero-zoom 16s cubic-bezier(.2,.65,.3,1) both}
  .hero-content > *{animation:rise .9s cubic-bezier(.2,.65,.3,1) both}
  .hero-content > :nth-child(2){animation-delay:.15s}
  .hero-content > .rose-rule{animation-name:draw; animation-delay:.35s}
  .hero-content > :nth-child(4){animation-delay:.45s}
  .hero-content > :nth-child(5){animation-delay:.6s}
  .hero-content > :nth-child(6){animation-delay:.75s}
  .page-hero .crumbs, .page-hero h1, .page-hero .intro, .page-hero .lang-switch{animation:rise .8s cubic-bezier(.2,.65,.3,1) both}
  .page-hero h1{animation-delay:.08s}
  .page-hero .intro{animation-delay:.2s}
  .page-hero .lang-switch{animation-delay:.3s}
  .page-hero h1::after{animation:draw-64 .9s .45s cubic-bezier(.2,.65,.3,1) both}
  .dock{animation:dock-in .6s 1s cubic-bezier(.2,.65,.3,1) both}
  dialog[open]{animation:pop .35s cubic-bezier(.2,.65,.3,1)}
  dialog[open]::backdrop{animation:fade .35s ease}
  .btn{transition:background-color .2s, color .2s, border-color .2s, transform .2s, box-shadow .2s}
  .btn:hover{transform:translateY(-2px); box-shadow:0 10px 22px rgba(0,0,0,.14)}
  .court-card, .guide-grid a{transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease}
  .court-card:hover{transform:translateY(-4px); box-shadow:0 16px 34px rgba(34,37,42,.10)}
  .guide-grid a:hover{transform:translateY(-3px)}
  .practice-list a{transition:background-color .25s ease}
  .practice-list .go::after{content:" \2192"; display:inline-block; transition:transform .25s ease}
  .practice-list a:hover .go::after{transform:translateX(5px)}
  .ladder li::before{transition:transform .3s ease, color .3s ease}
  .ladder li:hover::before{transform:translateY(-3px); color:var(--rose-strong)}
}
@media print{
  .reveal{opacity:1 !important; transform:none !important}
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1; transform:none; transition:none}
  .portrait img{transition:none}
  .team-card:hover .portrait img{transform:none}
}