:root{--green:#12352b;--green-2:#1c4a3c;--sage:#e7ede7;--moss:#6b8f7d;--gold:#c0a15b;--gold-ink:#7a6122;--paper:#fbfaf6;--ink:#1c2420;--muted:#5d675f;--line:#e2e0d6}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Figtree',sans-serif;color:var(--ink);background:var(--paper);line-height:1.7;-webkit-font-smoothing:antialiased}
h1,h2,h3,.disp{font-family:'Libre Caslon Display',serif;font-weight:400}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:1180px;margin:0 auto;padding:0 40px}
.kick{font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-ink);font-weight:600}

/* header */
header.site{position:sticky;top:0;z-index:50;background:rgba(251,250,246,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
nav{display:flex;align-items:center;justify-content:space-between;height:80px}
.brand{display:flex;align-items:center;gap:12px;font-family:'Libre Caslon Display',Georgia,serif;font-size:1.3rem;color:var(--ink)}
.leaf{width:38px;height:38px;background:var(--green);color:var(--sage);display:grid;place-items:center;border-radius:50%;font-family:'Libre Caslon Display',Georgia,serif;font-size:.95rem}
.navtools{display:flex;align-items:center;gap:20px}
.navlinks{display:flex;gap:30px;font-size:.85rem;color:var(--muted)}
.navlinks a:hover{color:var(--green)}
.lang{display:flex;gap:6px;font-size:.72rem;letter-spacing:.08em}
.lang a{color:var(--muted)}.lang a.active{color:var(--green);font-weight:700}
.btn{display:inline-block;padding:12px 26px;border-radius:40px;font-size:.82rem;font-weight:600;transition:.26s;cursor:pointer}
.btn-green{background:var(--green);color:#fff;border:none}.btn-green:hover{background:var(--green-2)}
.btn-out{border:1px solid var(--green);color:var(--green);background:transparent}.btn-out:hover{background:var(--green);color:#fff}
.btn-gold{background:var(--gold);color:#20180a;border:none}.btn-gold:hover{filter:brightness(1.06)}
.nav-toggle{display:none;background:none;border:none;cursor:pointer;width:42px;height:42px;padding:9px;flex-direction:column;justify-content:space-between}
.nav-toggle span{display:block;height:2px;width:100%;background:var(--green);border-radius:2px;transition:.25s}
.nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle.open span:nth-child(2){opacity:0}
.nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(max-width:900px){
  header.site .wrap{position:relative}
  .nav-toggle{display:flex}
  .navtools{position:absolute;top:80px;left:0;right:0;background:var(--paper);border-bottom:1px solid var(--line);flex-direction:column;align-items:flex-start;gap:18px;padding:22px 40px;display:none;box-shadow:0 22px 34px -22px rgba(0,0,0,.3)}
  .navtools.open{display:flex}
  .navlinks{flex-direction:column;gap:16px;width:100%}
  .navlinks a{display:block;font-size:1rem;color:var(--ink)}
  .btn.btn-out{align-self:stretch;text-align:center}
}

/* hero */
.hero{background:var(--green);color:#f2f5f1;position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;right:-120px;top:-120px;width:460px;height:460px;border:1px solid rgba(192,161,91,.25);border-radius:50%}
.hero::after{content:"";position:absolute;right:-40px;top:-40px;width:300px;height:300px;border:1px solid rgba(192,161,91,.18);border-radius:50%}
.hero .wrap{position:relative;display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center;padding:100px 40px}
.hero h1{font-size:clamp(2.9rem,6vw,5rem);line-height:1.05;margin:22px 0;color:#fff}
.hero h1 em,.hero h1 span{font-style:italic;color:var(--gold)}
.hero p.lead{color:#bccabf;font-size:1.12rem;max-width:34ch}
.hero .kick{color:var(--gold)}
.hero .cta{display:flex;gap:14px;margin-top:34px;flex-wrap:wrap}
.hero .btn-out{border-color:rgba(255,255,255,.4);color:#fff}.hero .btn-out:hover{background:#fff;color:var(--green)}
.hero .btn-green{background:var(--gold);color:#20180a}.hero .btn-green:hover{filter:brightness(1.08)}
.p-card{position:relative;justify-self:center}
.p-card .pic{width:290px;aspect-ratio:4/5;background:var(--sage);border-radius:16px;overflow:hidden;box-shadow:0 30px 60px -30px rgba(0,0,0,.5)}
.p-card .pic img{width:100%;height:100%;object-fit:cover}
.p-card .chip{position:absolute;bottom:20px;left:-18px;background:#fff;color:var(--green);padding:12px 22px;border-radius:12px;font-family:'Libre Caslon Display',Georgia,serif;font-size:1.05rem;box-shadow:0 14px 30px -14px rgba(0,0,0,.4)}
@media(max-width:900px){.hero .wrap{grid-template-columns:1fr;text-align:center;padding:66px 40px}.hero .cta{justify-content:center}.p-card{margin-top:12px}.p-card .chip{left:6px}}

/* trust strip */
.trust{background:var(--green-2);color:#cdd8cf}
.trust .wrap{display:flex;justify-content:space-between;gap:20px;padding:24px 40px;flex-wrap:wrap;align-items:center}
.trust .item{display:flex;align-items:baseline;gap:10px;font-size:.9rem}
.trust b{font-family:'Libre Caslon Display',Georgia,serif;color:var(--gold);font-size:1.7rem}

section{padding:100px 0}
.sec-head{text-align:center;max-width:640px;margin:0 auto 54px}
.sec-head h2{font-size:2.9rem;line-height:1.12;margin-top:12px}
.sec-head p{color:var(--muted);margin-top:14px}
.rule{width:54px;height:2px;background:var(--gold);margin:16px 0 0}
.sec-head .rule{margin:16px auto 0}

/* about */
.about .wrap{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.about .imgcol{aspect-ratio:5/4;background:var(--sage);border-radius:18px;overflow:hidden}
.about .imgcol img{width:100%;height:100%;object-fit:cover}
.about h2{font-size:2.7rem;line-height:1.12;margin-top:12px}
.about p{color:var(--muted);margin:16px 0}
.about .sign{font-family:'Libre Caslon Display',Georgia,serif;font-style:italic;font-size:1.3rem;color:var(--green);margin-top:8px}
@media(max-width:900px){.about .wrap{grid-template-columns:1fr;gap:32px}}

/* expertise */
.exp{background:var(--sage)}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.ecard{background:#fff;border-radius:16px;padding:34px 28px;transition:.3s;border:1px solid transparent}
.ecard:hover{transform:translateY(-6px);box-shadow:0 26px 50px -30px rgba(18,53,43,.5);border-color:var(--line)}
.ecard .ic{width:50px;height:50px;background:var(--green);border-radius:12px;display:grid;place-items:center;margin-bottom:18px}
.ecard .ic svg{width:24px;height:24px;stroke:var(--gold);fill:none;stroke-width:1.6}
.ecard h3{font-size:1.4rem;margin-bottom:8px}
.ecard p{color:var(--muted);font-size:.94rem}
@media(max-width:900px){.grid4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.grid4{grid-template-columns:1fr}}

/* why */
.why .sec-head{margin-bottom:44px}
.why .grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.why .item .n{font-family:'Libre Caslon Display',Georgia,serif;font-size:2.2rem;color:var(--gold-ink)}
.why .item h3{font-size:1.4rem;margin:6px 0 8px}
.why .item p{color:var(--muted);font-size:.95rem}
@media(max-width:900px){.why .grid3{grid-template-columns:1fr;gap:26px}}

/* articles */
.articles{background:var(--paper)}
.artgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.artcard{background:#fff;border:1px solid var(--line);border-radius:16px;padding:30px 28px;display:flex;flex-direction:column;transition:.28s}
.artcard:hover{transform:translateY(-4px);box-shadow:0 24px 44px -28px rgba(18,53,43,.45)}
.artcard .date{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-ink);font-weight:600}
.artcard h3,.artcard .card-t{font-family:'Libre Caslon Display',Georgia,serif;font-weight:400;font-size:1.4rem;margin:10px 0 12px;line-height:1.22}
.artcard p{color:var(--muted);font-size:.94rem;flex:1}
.artcard .more{margin-top:16px;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--green);font-weight:700}
@media(max-width:900px){.artgrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.artgrid{grid-template-columns:1fr}}
.muted-note{color:var(--muted)}

/* cta band */
.bandsec{padding:0 0 100px}
.band{background:var(--green);color:#fff;text-align:center;border-radius:24px;padding:70px 40px;max-width:1100px;margin:0 auto}
.band h2{font-size:2.7rem;line-height:1.1}
.band p{color:#bccabf;margin:14px auto 28px;max-width:44ch}
.band .btn-green{background:var(--gold);color:#20180a}

/* contact */
.contact .wrap{display:grid;grid-template-columns:1fr 1fr;gap:60px}
.contact h2{font-size:2.7rem;line-height:1.12;margin-top:12px}
.cinfo{margin-top:24px}
.cinfo .r{display:flex;gap:14px;padding:16px 0;border-bottom:1px solid var(--line);align-items:center}
.cinfo .r .lb{width:100px;color:var(--gold-ink);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600}
form.contactf{background:var(--sage);border-radius:18px;padding:38px}
form.contactf label{display:block;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:7px;font-weight:600}
form.contactf input,form.contactf textarea{width:100%;padding:13px 15px;border:1px solid var(--line);border-radius:10px;background:#fff;font-family:inherit;font-size:.95rem;margin-bottom:18px;color:var(--ink)}
form.contactf input:focus-visible,form.contactf textarea:focus-visible{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(18,53,43,.22)}
.form-err{background:#fbe1da;border:1px solid #e6b3a3;color:#a3411a;padding:10px 14px;border-radius:10px;margin-bottom:16px;font-size:.9rem}
.captcha-row{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.captcha-img{border:1px solid var(--line);border-radius:8px;background:#fff;display:block}
.captcha-reload{width:38px;height:38px;border:1px solid var(--line);background:#fff;border-radius:8px;cursor:pointer;font-size:1.1rem;color:var(--green);line-height:1}
.captcha-reload:hover{background:var(--green);color:#fff;border-color:var(--green)}

/* cookie consent banner */
.cookie-banner{position:fixed;left:16px;right:16px;bottom:16px;z-index:200;background:var(--green);color:#e8eee9;border-radius:14px;box-shadow:0 18px 44px -18px rgba(0,0,0,.5)}
.cookie-banner .cw{max-width:1180px;margin:0 auto;padding:18px 22px;display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap}
.cookie-banner p{font-size:.9rem;margin:0;max-width:70ch;color:#d3ddd6}
.cookie-banner a{color:var(--gold);text-decoration:underline}
.cookie-banner .cb-actions{display:flex;gap:10px;flex-wrap:wrap}
.cookie-banner .btn{padding:10px 22px}
.cookie-banner .btn-out{border-color:rgba(255,255,255,.5);color:#fff}
.cookie-banner .btn-out:hover{background:#fff;color:var(--green)}
.cookie-banner .btn-green{background:var(--gold);color:#20180a}
@media(max-width:640px){.cookie-banner .cw{flex-direction:column;align-items:stretch}.cookie-banner .cb-actions .btn{flex:1;text-align:center}}
@media(max-width:900px){.contact .wrap{grid-template-columns:1fr;gap:30px}}

/* article page */
.article-hero{background:var(--green);color:#fff;padding:84px 0 64px}
.article-hero .date{color:var(--gold);font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600}
.article-hero h1{font-size:clamp(2.2rem,5vw,3.1rem);line-height:1.12;margin-top:14px;max-width:24ch}
.article-body{padding:64px 0 90px}
.article-body .inner{max-width:760px;margin:0 auto;font-size:1.08rem;color:#2b332d}
.article-body .inner p{margin-bottom:20px}
.article-body .inner h2{font-size:1.9rem;margin:34px 0 12px}
.article-body .inner h3{font-size:1.4rem;margin:26px 0 10px}
.article-body .inner ul,.article-body .inner ol{margin:0 0 20px 1.3em}
.article-body .inner li{margin-bottom:8px}
.article-body .inner blockquote{border-left:3px solid var(--gold);padding-left:18px;color:var(--muted);font-style:italic;margin:20px 0}
.article-body .inner img{border-radius:12px;margin:22px 0}
.article-body .inner a{color:var(--green);text-decoration:underline}
.back{display:inline-block;margin-bottom:24px;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-ink);font-weight:700}
.cookie-table{width:100%;border-collapse:collapse;margin-top:24px;font-size:.92rem}
.cookie-table th,.cookie-table td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--line)}
.cookie-table th{color:var(--muted);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}

footer.site{background:var(--green);color:#a9bbaf;text-align:center;padding:44px 0;font-size:.86rem}
footer.site .brand{justify-content:center;color:#fff;margin-bottom:12px}
footer.site a{color:#cdd8cf}

/* ---- Responsive ---- */
@media(max-width:600px){
  .wrap{padding:0 22px}
  section{padding:64px 0}
  .hero .wrap{padding:52px 22px;gap:34px}
  .hero h1{font-size:2.4rem}
  .p-card .pic{width:min(260px,80vw)}
  .p-card .chip{left:50%;transform:translateX(-50%)}
  .sec-head h2,.about h2,.contact h2{font-size:2rem}
  .about .sign{font-size:1.15rem}
  .trust .wrap{gap:12px 22px;padding:20px 22px}
  .trust b{font-size:1.4rem}
  .band{padding:48px 26px;border-radius:18px}
  .band h2{font-size:1.85rem}
  .bandsec{padding-bottom:64px}
  form.contactf{padding:26px}
  .article-hero{padding:60px 0 44px}
  .article-body{padding:44px 0 64px}
  .article-body .inner{font-size:1rem}
}
@media(max-width:400px){
  .hero h1{font-size:2.05rem}
  .sec-head h2{font-size:1.75rem}
}

/* ---------------------------------------------------------------
   Accessibility, robustness and print (added in the full review)
   --------------------------------------------------------------- */

/* Skip link - first tab stop, visible only when focused */
.skip-link{position:absolute;left:-9999px;top:0;z-index:100;background:var(--green);color:#fff;padding:12px 18px;border-radius:0 0 8px 0;font-weight:600}
.skip-link:focus{left:0}

/* Visible focus for every interactive element (keyboard users) */
a:focus-visible,button:focus-visible,.btn:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{
  outline:2px solid var(--green);outline-offset:2px}
.hero a:focus-visible,.band a:focus-visible,footer.site a:focus-visible,.cookie-banner button:focus-visible{
  outline:2px solid var(--gold);outline-offset:2px}

/* A <button> that has to look like a text link (cookie settings in the footer) */
.linklike{background:none;border:none;padding:0;font:inherit;color:inherit;cursor:pointer;text-decoration:underline}

/* Long case numbers, URLs and e-mail addresses must not force sideways scrolling */
.article-body .inner{overflow-wrap:anywhere}
.article-body .inner a{word-break:break-word}
.cinfo .r span{overflow-wrap:anywhere}
/* The global rule strips underlines from every <a>, so the phone and email need
   their own affordance to read as tappable rather than as plain text. */
.cinfo .r a{border-bottom:1px solid rgba(28,36,32,.22);transition:color .15s,border-color .15s}
.cinfo .r a:hover,.cinfo .r a:focus-visible{color:var(--gold-ink);border-bottom-color:currentColor}
/* 44x44 is the smallest reliable touch target (Apple HIG), so the padded box is
   much larger than the 24px glyph. The negative vertical margins stop that box
   from stretching the contact row, and the left margin is the visible gap on
   top of the box's own 10px of padding. */
.cinfo .r a.wa{border-bottom:0;color:#128c7e;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;width:44px;height:44px;margin:-10px 0 -10px 8px}
.cinfo .r a.wa:hover,.cinfo .r a.wa:focus-visible{color:#25d366}

/* Reserve space for images inserted from the media library (avoids layout shift) */
.article-body .inner img{height:auto}

/* Wide tables (cookie policy) scroll instead of breaking the page */
.tw{overflow-x:auto;-webkit-overflow-scrolling:touch}
.cookie-table td,.cookie-table th{overflow-wrap:anywhere}

/* Captcha row: wrap and scale instead of squashing the image on narrow phones */
.captcha-row{flex-wrap:wrap}
.captcha-img{max-width:100%;height:auto;min-width:0}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms !important;animation-duration:.01ms !important;animation-iteration-count:1 !important}
  .ecard:hover,.artcard:hover,.tile:hover{transform:none}
}

@media print{
  header.site,.nav-toggle,.cookie-banner,.back,.navtools,.skip-link{display:none !important}
  body{background:#fff;color:#000}
  .article-hero{background:none !important;color:#000;padding:0 0 18px}
  .article-hero h1,.article-hero .date{color:#000}
  footer.site{background:none;color:#000;border-top:1px solid #ccc}
  .wrap{max-width:100%;padding:0}
  .article-body .inner a[href^="http"]::after{content:" (" attr(href) ")";font-size:.85em;word-break:break-all}
  a{text-decoration:underline}
}

/* ---------------------------------------------------------------
   Utility / page classes - replace the inline style="" attributes
   that used to be scattered through the templates.
   --------------------------------------------------------------- */
.sep{opacity:.4}                                   /* decorative | and · separators */
.btn.wide{width:100%}
.hp{position:absolute;left:-9999px}                /* honeypot field */
.w-cap{max-width:220px}                            /* captcha code input */
.w-alt{max-width:160px}                            /* arithmetic-answer input */
.cap-alt{font-size:.86rem;margin:-2px 0 6px}       /* "can't read the image?" note */
.article-body.tight{padding-top:70px}              /* listing/legal pages: less top space */
.sec-head.left{text-align:left;margin-left:0}
.page-h1{font-size:clamp(2.1rem,4vw,2.6rem);margin:12px 0 18px}
.sec-head .page-h1{margin-bottom:0}                /* the gold .rule sits right below */
.more-row{margin-top:34px}
.more-row.center{text-align:center}
.inner .contactf{margin-top:22px}
.status-sec{padding:120px 0;text-align:center}     /* 404 / thank-you pages */
.status-sec h1{font-size:3rem;margin:16px 0 12px}
.status-sec .muted-note{max-width:44ch;margin:0 auto 28px}
.foot-links{margin-top:14px;font-size:.8rem}
@media(max-width:600px){
  .status-sec{padding:80px 0}
  .status-sec h1{font-size:2.3rem}
}

/* Practice-area bullet lists (editable per area in the admin) */
.ecard .elist{list-style:none;margin:14px 0 0;padding:0;border-top:1px solid var(--line);padding-top:12px}
.ecard .elist li{position:relative;padding-left:16px;font-size:.88rem;color:var(--muted);line-height:1.65}
.ecard .elist li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;border-radius:50%;background:var(--gold)}