/* ==========================================================================
   MBM Valkyrie Advisory — upgrade layer (September 2026)
   New components only. The base design system lives in mbm-site.css and is
   left untouched so that nothing already published can regress.
   ========================================================================== */

/* --- the 3D roundel replaces the flat SVG lockup ------------------------- */
.roundel--3d{display:block;border-radius:50%;object-fit:contain}
.brand-mark .roundel--3d{width:38px;height:38px;filter:drop-shadow(0 2px 10px rgba(201,167,102,.30))}
.page-hero__roundel.roundel--3d{width:clamp(104px,17vw,196px);height:auto;
  filter:drop-shadow(0 18px 42px rgba(4,10,18,.45))}
.advisor-launch__mark.roundel--3d{width:26px;height:26px}

/* --- published fee table ------------------------------------------------ */
.fee-wrap{border:1px solid var(--line);background:#fff;overflow-x:auto;
  -webkit-overflow-scrolling:touch}
table.fee-table{width:100%;min-width:660px;border-collapse:collapse;font-size:14px}
.fee-table caption{text-align:left;padding:20px 22px 0;color:var(--slate);font-size:13px}
.fee-table thead th{background:var(--ink-900);color:var(--cream);text-align:left;
  font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:800;padding:14px 18px}
.fee-table th[scope="row"]{text-align:left;font-weight:700}
.fee-table td,.fee-table th[scope="row"]{padding:15px 18px;border-top:1px solid var(--line);
  vertical-align:top;color:var(--slate)}
.fee-table tbody tr:target{background:#fdf6e6;box-shadow:inset 3px 0 0 var(--brass)}
.fee-table tbody tr:hover{background:var(--paper)}
.fee-table .svc{color:var(--ink);font-family:var(--serif);font-size:16.5px;line-height:1.25;
  font-weight:600;display:block}
.fee-table .svc a{text-decoration:none;border-bottom:1px solid rgba(176,138,79,.45)}
.fee-table .svc a:hover{color:var(--brass)}
.fee-table .fee{color:var(--ink-900);font-family:var(--serif);font-size:17px;font-weight:700;
  white-space:nowrap}
.fee-table .anchor{display:block;margin-top:6px;font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--brass);text-decoration:none}
.fee-table .anchor:hover{color:var(--ink)}
.fee-group th{background:var(--cream);color:var(--ink-900);font-family:var(--serif);
  font-size:14px;letter-spacing:.02em;padding:12px 18px;border-top:1px solid var(--line)}

/* --- instrument / policy library entries -------------------------------- */
.group-intro{color:var(--slate);font-size:16px;margin:0 0 26px;max-width:62ch}
.instrument{border-top:1px solid var(--line);padding:24px 0 4px;scroll-margin-top:120px}
.instrument:first-of-type{border-top:2px solid var(--brass)}
.instrument h3{font-family:var(--serif);font-size:clamp(20px,2.4vw,25px);line-height:1.2;
  font-weight:600;margin:0 0 10px;color:var(--ink-900)}
.instrument__does{color:var(--ink);font-size:15.5px;margin:0 0 14px;max-width:66ch}
.instrument__detail{border-left:2px solid var(--line);padding-left:20px;margin-bottom:18px}
.instrument__detail p{color:var(--slate);font-size:14.4px;line-height:1.66;margin:0 0 12px;max-width:70ch}
.instrument__detail .watch{color:#3c4a5c}
.lbl{display:block;font-size:10px;letter-spacing:.2em;text-transform:uppercase;font-weight:800;
  color:var(--brass);margin-bottom:5px}
.lbl--watch{color:#8f2f2f}
.instrument__detail .watch{border-left:0}
@media (min-width:900px){.instrument__detail .watch{background:var(--cream);padding:14px 16px;
  margin-left:-16px;border-left:2px solid #8f2f2f}}

/* --- universal points / method list ------------------------------------- */
.points{list-style:none;margin:0;padding:0;display:grid;gap:1px;background:var(--line);
  border:1px solid var(--line)}
.points li{background:#fff;padding:20px 22px}
.points strong{display:block;font-family:var(--serif);font-size:17px;font-weight:600;
  color:var(--ink-900);margin-bottom:6px}
.points span{color:var(--slate);font-size:14px;line-height:1.6}
@media (min-width:860px){.points{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* --- credentials table -------------------------------------------------- */
.cred-table{width:100%;border-collapse:collapse;border:1px solid var(--line);background:#fff}
.cred-table th[scope="row"]{text-align:left;width:34%;background:var(--cream);color:var(--ink-900);
  font-weight:750;font-size:13.5px;padding:14px 18px;border-top:1px solid var(--line);vertical-align:top}
.cred-table td{padding:14px 18px;border-top:1px solid var(--line);color:var(--slate);font-size:14px;
  vertical-align:top}
.cred-table tr:first-child th,.cred-table tr:first-child td{border-top:0}
@media (max-width:640px){
  .cred-table,.cred-table tbody,.cred-table tr,.cred-table th,.cred-table td{display:block;width:100%}
  .cred-table th[scope="row"]{border-top:1px solid var(--line)}
  .cred-table td{border-top:0;padding-top:0}
}

/* --- download cards ----------------------------------------------------- */
.dl-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.dl{display:flex;flex-direction:column;gap:6px;border:1px solid var(--line);background:#fff;
  padding:22px 24px;text-decoration:none;transition:transform .18s,border-color .18s}
.dl:hover{transform:translateY(-2px);border-color:var(--brass)}
.dl .dl-kind{font-size:10px;letter-spacing:.18em;text-transform:uppercase;font-weight:800;
  color:var(--brass)}
.dl h3{font-family:var(--serif);font-size:19px;font-weight:600;line-height:1.2;margin:2px 0 4px;
  color:var(--ink-900)}
.dl p{color:var(--slate);font-size:13.6px;line-height:1.55;margin:0}
.dl .dl-go{margin-top:auto;padding-top:12px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:800;color:var(--brass)}

/* --- proof / trust strip ------------------------------------------------ */
.trust{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
.trust div{background:#fff;padding:26px 24px}
.trust .k{display:block;font-size:10px;letter-spacing:.2em;text-transform:uppercase;font-weight:800;
  color:var(--brass);margin-bottom:9px}
.trust strong{display:block;font-family:var(--serif);font-size:19px;font-weight:600;color:var(--ink-900);
  line-height:1.25;margin-bottom:7px}
.trust span:not(.k){color:var(--slate);font-size:14px;line-height:1.6}
@media (min-width:820px){.trust{grid-template-columns:repeat(3,1fr)}}

/* --- booking form ------------------------------------------------------- */
.book-grid{display:grid;gap:clamp(28px,5vw,64px);align-items:start}
@media (min-width:900px){.book-grid{grid-template-columns:1.15fr .85fr}}
.book-form{border:1px solid var(--line);background:#fff;padding:clamp(24px,4vw,38px)}
.book-form .row{display:grid;gap:16px}
@media (min-width:620px){.book-form .row.two{grid-template-columns:1fr 1fr}}
.book-form label{display:grid;gap:6px;font-size:12px;font-weight:750;color:var(--ink);margin-bottom:16px}
.book-form input,.book-form select,.book-form textarea{border:1px solid var(--line);
  background:var(--paper);width:100%;color:var(--ink);border-radius:0;padding:12px 13px;font-size:15px}
.book-form textarea{min-height:120px;resize:vertical}
.book-form input:focus,.book-form select:focus,.book-form textarea:focus{outline:2px solid var(--brass-300);
  outline-offset:1px;background:#fff}
.book-form .hp{position:absolute;left:-9999px}
.book-form .consent{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;font-weight:500;
  color:var(--slate);line-height:1.55}
.book-form .consent input{width:auto;margin-top:3px}
.book-aside .step{border-top:1px solid var(--line);padding:18px 0}
.book-aside .step:first-child{border-top:2px solid var(--brass)}
.book-aside .step strong{display:block;font-family:var(--serif);font-size:18px;color:var(--ink-900);
  margin-bottom:5px}
.book-aside .step span{color:var(--slate);font-size:14px;line-height:1.6}
.book-aside .step em{display:block;font-style:normal;font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;font-weight:800;color:var(--brass);margin-bottom:6px}

/* --- timeline / bio on the about page ----------------------------------- */
.seat-grid{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
@media (min-width:820px){.seat-grid{grid-template-columns:repeat(3,1fr)}}
.seat{background:#fff;padding:28px 26px}
.seat .no{font-family:var(--serif);font-size:34px;color:var(--brass);line-height:1;display:block;
  margin-bottom:12px}
.seat h3{font-family:var(--serif);font-size:20px;font-weight:600;margin:0 0 4px;color:var(--ink-900)}
.seat .role{display:block;font-size:10px;letter-spacing:.18em;text-transform:uppercase;font-weight:800;
  color:var(--brass);margin-bottom:10px}
.seat p{color:var(--slate);font-size:14px;line-height:1.62;margin:0}

/* --- "what we do not do" panel ------------------------------------------ */
.notdo{border:1px solid var(--line);border-left:3px solid #8f2f2f;background:#fff;
  padding:clamp(22px,3.5vw,32px)}
.notdo h3{font-family:var(--serif);font-size:22px;font-weight:600;margin:0 0 12px;color:var(--ink-900)}
.notdo ul{margin:0;padding-left:20px;color:var(--slate);font-size:14.5px;line-height:1.65}
.notdo li{margin:8px 0}
.notdo p{color:var(--slate);font-size:14px;margin:16px 0 0}

/* --- misc --------------------------------------------------------------- */
.lead-note{color:var(--slate);font-size:15.5px;line-height:1.7;max-width:70ch}
.lead-note strong{color:var(--ink-900)}
.anchor-target{scroll-margin-top:110px}
.pill{display:inline-block;border:1px solid var(--brass);color:var(--brass);font-size:10px;
  letter-spacing:.16em;text-transform:uppercase;font-weight:800;padding:5px 10px;margin:0 6px 6px 0}
.section--white .instrument__detail .watch{background:var(--cream)}
.vat-note{border-left:3px solid var(--brass);background:var(--cream);color:var(--slate);
  padding:20px 22px;font-size:14px;line-height:1.65;margin-top:22px}
.vat-note strong{color:var(--ink-900)}
.print-only{display:none}
@media print{
  .site-header,.site-footer,.advisor,.page-hero__dial,.button-row,.menu-toggle{display:none!important}
  .print-only{display:block}
  body{background:#fff}
  .section{padding:12px 0}
}

/* --- nested library index ----------------------------------------------- */
.service-detail__index{max-height:calc(100vh - 150px);overflow-y:auto;scrollbar-width:thin}
.service-detail__index>a{font-weight:700;color:var(--ink)}
.idx-sub{border-bottom:1px solid var(--line);padding:2px 0 8px}
.idx-sub a.sub{display:block;border:0;padding:4px 0 4px 12px;font-size:11.6px;line-height:1.35;
  color:var(--slate);text-decoration:none}
.idx-sub a.sub:hover{color:var(--brass)}
.service-detail__index a.idx-cta{color:var(--brass);font-weight:800;font-size:12px;
  letter-spacing:.08em;text-transform:uppercase}

/* ==========================================================================
   Legacy-template pages (insight articles and interactive tools)
   Brings their navigation, roundel and call to action into line with the
   rest of the site without re-authoring their content.
   ========================================================================== */
.nav__mark.roundel--3d,.roundel.mark.roundel--3d{width:34px;height:34px;vertical-align:middle;
  margin-right:10px;display:inline-block;border-radius:50%}
.nav__brand,.brand{display:inline-flex;align-items:center;gap:0;min-width:0}
.nav__brand{max-width:100%}
.nav-cta{border:1px solid #b08a4f;background:#c9a766;color:#0a1b2b!important;font-weight:800;
  padding:7px 14px;border-radius:0;text-decoration:none!important;white-space:nowrap}
.nav-cta:hover{background:#b08a4f;color:#fff!important}

.legacy-cta{background:#0a1b2b;color:#f5f1e8;padding:clamp(44px,6vw,72px) 0;margin-top:8px}
.legacy-cta .wrap{max-width:1180px;margin:0 auto;padding:0 20px}
.legacy-cta__kicker{color:#c9a766;letter-spacing:.22em;text-transform:uppercase;font-size:11px;
  font-weight:800;margin:0 0 14px}
.legacy-cta h2{font-family:Georgia,"Times New Roman",serif;font-size:clamp(26px,3.6vw,40px);
  line-height:1.12;font-weight:600;margin:0 0 14px;color:#fdf8ee;max-width:20ch}
.legacy-cta p{color:#c6ceda;font-size:16px;line-height:1.65;margin:0 0 22px;max-width:62ch}
.legacy-cta__row{display:flex;flex-wrap:wrap;gap:12px}
.legacy-btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;
  border:1px solid #b08a4f;background:#c9a766;color:#0a1b2b;padding:11px 21px;font-size:13.5px;
  font-weight:800;text-decoration:none;transition:transform .18s,background .18s}
.legacy-btn:hover{background:#b08a4f;color:#fff;transform:translateY(-2px)}
.legacy-btn--ghost{background:transparent;color:#f5f1e8}
.legacy-btn--ghost:hover{background:#c9a766;color:#0a1b2b}

@media (max-width:640px){
  .nav__brand,.brand{font-size:14px;line-height:1.15}
  .brand .name{font-size:14px}
  .brand .sub{font-size:10px}
  .nav__links,.nav-links{flex-wrap:wrap}
  .legacy-cta h2{max-width:none}
}

/* legacy brand lockup must not force horizontal scroll on a phone */
.brand>span,.nav__brand>span{min-width:0;flex:1 1 auto;white-space:normal;overflow-wrap:anywhere}
.brand .sub,.nav__brand .sub{white-space:normal}
@media (max-width:560px){
  .brand,.nav__brand{max-width:calc(100vw - 92px)}
  .brand .name{font-size:13px;line-height:1.2}
  .brand .sub{font-size:9.5px;letter-spacing:.06em}
}
.book-form label .lt{display:block;font-size:12px;font-weight:750;color:var(--ink)}
.book-form label .lt b{color:#8f2f2f;font-weight:800}
.book-form .consent b{color:#8f2f2f}

/* ==========================================================================
   Tree navigation — added 13 September 2026
   The site is a tree: hub → category → sub-service. These are the parts
   that make that readable.
   ========================================================================== */

/* --- breadcrumb + back bar ---------------------------------------------- */
.backbar{background:var(--cream);border-bottom:1px solid var(--line);position:sticky;top:76px;z-index:60;
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.backbar__in{display:flex;align-items:center;gap:18px;min-height:46px;flex-wrap:wrap;
  padding-block:8px}
.backbar__back{display:inline-flex;align-items:center;gap:8px;flex:none;
  border:1px solid var(--brass);color:var(--ink-900);background:#fff;
  font-size:11.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  padding:7px 13px;text-decoration:none;transition:background .18s,transform .18s}
.backbar__back:hover{background:var(--brass-300);transform:translateX(-2px)}
.backbar__trail{color:var(--slate);font-size:12.5px;line-height:1.5;min-width:0}
.backbar__trail a{color:var(--slate);text-decoration:none;border-bottom:1px solid transparent}
.backbar__trail a:hover{color:var(--brass);border-bottom-color:var(--brass)}
.backbar__trail i{color:var(--brass);font-style:normal;margin:0 2px}
.backbar__trail [aria-current]{color:var(--ink-900);font-weight:700}
@media (max-width:700px){
  .backbar{position:static}
  .backbar__trail{font-size:11.5px;width:100%}
}

/* --- navigation cards (category → sub-service) --------------------------- */
.navcards{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(290px,1fr))}
.navcard{display:flex;flex-direction:column;border:1px solid var(--line);background:#fff;
  padding:clamp(22px,3vw,30px);text-decoration:none;position:relative;overflow:hidden;
  transition:transform .2s cubic-bezier(.2,.7,.2,1),border-color .2s,box-shadow .2s}
.navcard:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--brass);
  transform:scaleY(0);transform-origin:top;transition:transform .28s cubic-bezier(.2,.7,.2,1)}
.navcard:hover{transform:translateY(-3px);border-color:var(--brass);
  box-shadow:0 18px 44px rgba(10,27,43,.10)}
.navcard:hover:before{transform:scaleY(1)}
.navcard__k{font-size:10px;letter-spacing:.2em;text-transform:uppercase;font-weight:800;
  color:var(--brass);margin-bottom:10px}
.navcard h3{font-family:var(--serif);font-size:clamp(19px,2.2vw,23px);line-height:1.18;
  font-weight:600;margin:0 0 10px;color:var(--ink-900)}
.navcard p{color:var(--slate);font-size:14.2px;line-height:1.6;margin:0}
.navcard__meta{color:var(--ink);font-size:12.5px;font-weight:700;margin-top:10px}
.navcard__go{margin-top:auto;padding-top:16px;font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;font-weight:800;color:var(--brass)}
.navcard__go i{font-style:normal;display:inline-block;transition:transform .18s}
.navcard:hover .navcard__go i{transform:translateX(4px)}
.section--ink .navcard{background:#0e2136;border-color:rgba(201,167,102,.22)}
.section--ink .navcard h3{color:var(--cream)}
.section--ink .navcard p{color:var(--muted)}

/* --- resource / self-check tabs ----------------------------------------- */
.rtabs{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.rtab{display:flex;flex-direction:column;gap:5px;border:1px solid var(--brass);background:#fff;
  padding:18px 20px;text-decoration:none;transition:background .18s,transform .18s}
.rtab:hover{background:var(--brass-300);transform:translateY(-2px)}
.rtab__k{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;font-weight:800;color:var(--brass)}
.rtab:hover .rtab__k{color:var(--ink-900)}
.rtab__t{font-family:var(--serif);font-size:17px;line-height:1.25;font-weight:600;color:var(--ink-900)}
.rtab__go{margin-top:6px;font-size:10px;letter-spacing:.16em;text-transform:uppercase;font-weight:800;
  color:var(--slate)}
.rtab:hover .rtab__go{color:var(--ink-900)}
.rtab__go i{font-style:normal;display:inline-block;transition:transform .18s}
.rtab:hover .rtab__go i{transform:translateX(4px)}

/* --- home tab grid ------------------------------------------------------- */
.hometabs{display:grid;gap:1px;background:rgba(201,167,102,.22);border:1px solid rgba(201,167,102,.22);
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.hometab{display:flex;flex-direction:column;background:#0a1b2b;padding:24px 22px;text-decoration:none;
  position:relative;transition:background .2s}
.hometab:hover{background:#122c46}
.hometab__k{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;font-weight:800;
  color:var(--brass-300);margin-bottom:9px}
.hometab strong{font-family:var(--serif);font-size:22px;font-weight:600;color:#fdf8ee;line-height:1.15;
  margin-bottom:7px}
.hometab__d{color:var(--muted);font-size:13.4px;line-height:1.55}
.hometab__go{position:absolute;top:22px;right:20px;color:var(--brass);font-size:17px;
  transition:transform .2s}
.hometab:hover .hometab__go{transform:translateX(4px)}

/* --- fee bar on a sub-service page --------------------------------------- */
.feebar{display:grid;gap:6px;border:1px solid var(--line);border-left:3px solid var(--brass);
  background:var(--cream);padding:22px 26px;margin-bottom:30px}
.feebar__k{font-size:10px;letter-spacing:.2em;text-transform:uppercase;font-weight:800;color:var(--brass)}
.feebar strong{font-family:var(--serif);font-size:clamp(23px,3vw,30px);font-weight:700;
  color:var(--ink-900);line-height:1.15}
.feebar__n{color:var(--slate);font-size:13.4px;line-height:1.6;margin-top:4px}
.feebar__n a{color:var(--brass);font-weight:700}

/* --- the what / how / watch briefs --------------------------------------- */
.briefs{display:grid;gap:20px}
.brief{border-left:2px solid var(--line);padding-left:22px}
.brief p{color:var(--slate);font-size:15.4px;line-height:1.72;margin:0;max-width:72ch}
.brief--watch{border-left-color:#8f2f2f;background:var(--cream);padding:20px 24px;margin-left:-2px}
.brief--watch p{color:#35424f}
@media (min-width:900px){.briefs{gap:26px}}

/* --- previous / next sibling navigation ---------------------------------- */
.pnav{display:grid;gap:14px;grid-template-columns:1fr;margin-top:6px}
@media (min-width:720px){.pnav{grid-template-columns:1fr 1fr}}
.pnav__a{display:flex;flex-direction:column;gap:5px;border:1px solid var(--line);background:#fff;
  padding:18px 22px;text-decoration:none;transition:border-color .18s,transform .18s}
.pnav__a:hover{border-color:var(--brass);transform:translateY(-2px)}
.pnav__empty{border:0;background:0 0;padding:0}
.pnav__a span{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;font-weight:800;
  color:var(--brass)}
.pnav__a strong{font-family:var(--serif);font-size:17px;font-weight:600;color:var(--ink-900);
  line-height:1.25}
.pnav__next{text-align:right}

/* --- library index: highlight the section in view ------------------------ */
.service-detail__index a.is-here{color:var(--brass);font-weight:700}

/* backbar works on every template, with or without mbm-site.css */
.backbar__in{width:min(1180px,calc(100% - 40px));margin-inline:auto}

/* ==========================================================================
   .dialhero — the motion dial for pages that do not load mbm-site.css
   (insight articles, self-checks, working documents, the register).
   Entirely self-contained: colours, layout, SVG classes and animation.
   ========================================================================== */
.dialhero{position:relative;overflow:hidden;isolation:isolate;
  --dh-x:76%;--dh-size:clamp(500px,58vw,880px);--dh-roundel:clamp(112px,12vw,178px);
  padding:clamp(52px,8vw,96px) 0 clamp(48px,7vw,84px)}
.dialhero__in{position:relative;z-index:2;width:min(1180px,calc(100% - 40px));margin-inline:auto;
  max-width:1180px}
@media (min-width:1000px){.dialhero__in{padding-right:32%}}
.dialhero__dial{position:absolute;z-index:0;pointer-events:none;
  left:calc(var(--dh-x) - var(--dh-size)/2);top:calc(50% - var(--dh-size)/2);
  width:var(--dh-size);height:var(--dh-size)}
.dialhero__dial .dial{display:block;width:100%;height:100%;overflow:visible}
.dialhero .dial__orbit{transform-box:view-box;transform-origin:500px 500px;
  animation:dhSpin var(--spin,160s) linear infinite;animation-direction:var(--dir,normal)}
@keyframes dhSpin{to{transform:rotate(1turn)}}
.dialhero .dial__ring,.dialhero .dial__hi{fill:none;stroke-width:.85;vector-effect:non-scaling-stroke}
.dialhero .dial__ring{stroke:var(--dh-line)}
.dialhero .dial__hi{display:none;stroke:var(--dh-hi)}
.dialhero .dial__ticks{fill:none;stroke:var(--dh-tick);stroke-width:1;
  vector-effect:non-scaling-stroke;stroke-linecap:butt}
.dialhero .dial__orbit--a{opacity:1}
.dialhero .dial__orbit--b{opacity:.82}
.dialhero .dial__orbit--c{opacity:.56}
.dialhero .dial__orbit--d{opacity:.34}
.dialhero .dial__glint{fill:var(--dh-glint);filter:drop-shadow(0 0 6px var(--dh-glow))}
.dialhero__roundel{position:absolute;left:50%;top:50%;z-index:3;display:block;border-radius:50%;
  width:var(--dh-roundel);height:var(--dh-roundel);transform:translate(-50%,-50%);
  pointer-events:auto;filter:var(--dh-shadow);
  transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.dialhero__roundel:hover{transform:translate(-50%,-50%) scale(1.045)}
.dialhero__roundel img{width:100%;height:100%;display:block;border-radius:50%}
.dialhero__kicker{margin:0 0 16px;font-family:Inter,-apple-system,"Segoe UI",Arial,sans-serif;
  font-size:11px;font-weight:800;letter-spacing:.22em;text-transform:uppercase;color:var(--dh-kicker)}
.dialhero h1{font-family:Georgia,"Times New Roman",serif;font-weight:600;margin:0 0 18px;
  font-size:clamp(30px,4.4vw,50px);line-height:1.08;letter-spacing:-.02em;color:var(--dh-h1);
  max-width:18ch;text-wrap:balance}
.dialhero h1 em{font-style:italic;color:var(--dh-em)}
.dialhero__lede{margin:0;max-width:60ch;font-size:clamp(15.5px,1.6vw,18px);line-height:1.62;
  color:var(--dh-lede);font-family:Inter,-apple-system,"Segoe UI",Arial,sans-serif}
.dialhero__btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.dialhero__btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;
  padding:11px 21px;font-family:Inter,-apple-system,"Segoe UI",Arial,sans-serif;font-size:13.5px;
  font-weight:800;text-decoration:none;border:1px solid #b08a4f;background:#c9a766;color:#0a1b2b;
  transition:transform .18s,background .18s}
.dialhero__btn:hover{background:#b08a4f;color:#fff;transform:translateY(-2px)}
.dialhero__btn--ghost{background:0 0;color:var(--dh-h1)}
.dialhero__btn--ghost:hover{background:#c9a766;color:#0a1b2b}
.dialhero__meta{margin:16px 0 0;font-size:12.5px;letter-spacing:.02em;color:var(--dh-meta);
  font-family:Inter,-apple-system,"Segoe UI",Arial,sans-serif}

/* grain, as on the wallpapers */
.dialhero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .5 0 0 0 0 .5 0 0 0 0 .5 0 0 0 .95 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");
  background-size:200px 200px;opacity:.14;mix-blend-mode:soft-light}
.dialhero::before{content:"";position:absolute;inset:0;z-index:-1}

/* --- navy (blue) variant -------------------------------------------------- */
.dialhero--navy{background:#0a1728;
  --dh-line:rgba(201,164,102,.40);--dh-tick:rgba(201,164,102,.62);--dh-hi:rgba(255,247,230,.30);
  --dh-glint:#e8c983;--dh-glow:rgba(232,201,131,.75);
  --dh-shadow:drop-shadow(0 20px 34px rgba(2,8,16,.62)) drop-shadow(0 3px 6px rgba(2,8,16,.5));
  --dh-kicker:#c9a766;--dh-h1:#fdf8ee;--dh-em:#d8b877;--dh-lede:#c3cdda;--dh-meta:#8b9bb0}
.dialhero--navy::before{background:radial-gradient(circle 62vw at var(--dh-x) 50%,
  #13293f 0%,#102338 18%,#0d1d30 42%,#0a1728 72%,#081321 100%)}
.dialhero--navy .dial__hi{display:block}

/* --- ivory (gold) variant ------------------------------------------------- */
.dialhero--ivory{background:#f2eadf;border-bottom:1px solid #e0d6c6;
  --dh-line:#d3c9bb;--dh-tick:#a59d90;--dh-hi:#fffbf2;
  --dh-glint:#9c7639;--dh-glow:rgba(156,118,57,.7);
  --dh-shadow:drop-shadow(0 16px 26px rgba(28,36,50,.30)) drop-shadow(0 2px 4px rgba(28,36,50,.18));
  --dh-kicker:#86622a;--dh-h1:#0b1626;--dh-em:#9a7434;--dh-lede:#3f4c5e;--dh-meta:#77838f}
.dialhero--ivory::before{background:radial-gradient(circle 62vw at var(--dh-x) 50%,
  #e8dfd2 0%,#ebe3d7 16%,#efe7dc 38%,#f2eadf 68%,#f4ede3 100%)}
.dialhero--ivory::after{opacity:.09;mix-blend-mode:multiply}
.dialhero--ivory .dial__hi{display:block}

@media (max-width:820px){
  .dialhero{--dh-x:50%;--dh-size:min(120vw,620px);padding-top:clamp(150px,42vw,240px)}
  .dialhero__dial{top:auto;bottom:auto;top:-6%}
  .dialhero__roundel{top:14%}
  .dialhero h1{max-width:none}
}
@media (prefers-reduced-motion:reduce){.dialhero .dial__orbit{animation:none}}

/* --- forthcoming pieces list (insights page only) ------------------------ */
.soon{list-style:none;counter-reset:s;margin:0;padding:0;display:grid;gap:1px;
  background:var(--line);border:1px solid var(--line)}
.soon li{counter-increment:s;background:#fff;padding:24px 26px 24px 68px;position:relative}
.soon li:before{content:counter(s,decimal-leading-zero);position:absolute;left:24px;top:24px;
  font-family:var(--serif);font-size:26px;color:var(--brass);line-height:1}
.soon__when{display:block;font-size:10px;letter-spacing:.2em;text-transform:uppercase;font-weight:800;
  color:var(--brass);margin-bottom:8px}
.soon strong{display:block;font-family:var(--serif);font-size:21px;font-weight:600;color:var(--ink-900);
  line-height:1.2;margin-bottom:8px}
.soon p{color:var(--slate);font-size:14.4px;line-height:1.62;margin:0;max-width:70ch}

/* --- the closer at the foot of every insight article --------------------- */
.insight-closer{background:#f5f1e8;border-top:1px solid #e6dfd1;padding:clamp(40px,6vw,68px) 0}
.insight-closer .wrap{width:min(1180px,calc(100% - 40px));margin-inline:auto;max-width:860px}
.insight-closer .ic-k{margin:0 0 12px;font-family:Inter,-apple-system,"Segoe UI",Arial,sans-serif;
  font-size:10.5px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:#b08a4f}
.insight-closer h2{font-family:Georgia,serif;font-size:clamp(24px,3.2vw,34px);line-height:1.15;
  font-weight:600;margin:0 0 12px;color:#0a1b2b}
.insight-closer p{color:#46566c;font-size:16px;line-height:1.65;margin:0 0 20px;max-width:64ch;
  font-family:Inter,-apple-system,"Segoe UI",Arial,sans-serif}
.insight-closer .ic-row{display:flex;flex-wrap:wrap;gap:12px;margin:0}
.mi-all{margin:14px 0 0;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:800}
.mi-all a{color:#b08a4f;text-decoration:none}

/* --- tables inside a dark or cream band ---------------------------------- */
.cred-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.section--ink .cred-table{border-color:rgba(201,167,102,.25);background:#0e2136}
.section--ink .cred-table th[scope="row"]{background:#0a1b2b;color:var(--cream);
  border-top-color:rgba(201,167,102,.22)}
.section--ink .cred-table td{color:var(--muted);border-top-color:rgba(201,167,102,.22)}
.section--ink .points li{background:#0e2136}
.section--ink .points strong{color:var(--cream)}
.section--ink .points span{color:var(--muted)}
.section--ink .points{background:rgba(201,167,102,.22);border-color:rgba(201,167,102,.22)}
.section--ink .steps-list li{border-color:rgba(201,167,102,.22)}
.fee-table tbody th[scope="row"]{font-weight:600;color:var(--slate)}

/* the back control must wrap on a phone, however long the parent's name is */
.backbar__back{max-width:100%;white-space:normal;text-align:left;line-height:1.35;
  overflow-wrap:anywhere}
@media (max-width:640px){
  .backbar__in{gap:10px}
  .backbar__back{font-size:10.5px;letter-spacing:.08em;padding:7px 11px}
}
/* the dial never creates horizontal scroll */
.dialhero,.page-hero--dial{overflow:hidden}
.dialhero__dial,.page-hero__dial{max-width:none}

/* ==================================================================
   CHROME PROTECTION
   The retrofitted article and tool pages carry their own inline
   stylesheet with bare element selectors (a, p, strong, h1 …). Those
   rules would otherwise reach into the framework header, back bar,
   footer and assistant that are now injected onto those pages. Every
   selector below is deliberately more specific than a bare element
   selector, and this sheet loads last, so the site chrome renders
   identically on every page regardless of what the page itself sets.
   ================================================================== */
.site-header .brand-mark span strong{color:var(--cream);font-family:var(--serif);font-size:17px;
  font-weight:700;letter-spacing:.01em;line-height:1.05;display:block;background:none}
.site-header .brand-mark span small{color:var(--brass-300);font-size:10.5px;font-weight:600;
  letter-spacing:.22em;text-transform:uppercase;display:block}
.site-header .primary-nav a{color:var(--cream);font-family:var(--sans);font-size:14.5px;
  font-weight:500;text-decoration:none;background:none}
.site-header .primary-nav a:hover,
.site-header .primary-nav a:focus-visible{color:var(--brass-300);text-decoration:none}
.site-header .primary-nav a.nav-enquire{border:1px solid var(--brass);
  background:var(--brass-300);color:var(--ink-900);font-weight:600;padding:9px 18px;
  border-radius:2px}
.site-header .primary-nav a.nav-enquire:hover,
.site-header .primary-nav a.nav-enquire:focus-visible{background:var(--brass);color:#fff}
.site-header .primary-nav a.nav-whatsapp{color:var(--cream)}
.site-header .primary-nav a.nav-whatsapp .wa-icon{width:18px;height:18px;flex:none;color:#25d366}
.site-header p,.site-header span,.site-header small{margin:0}

.backbar .backbar__back,.backbar .backbar__trail a{text-decoration:none}
.backbar .backbar__trail span[aria-current]{color:var(--ink-900)}

.site-footer,.site-footer p,.site-footer span,.site-footer li{color:var(--muted)}
.site-footer a{color:var(--muted);text-decoration:none}
.site-footer a:hover,.site-footer a:focus-visible{color:var(--brass-300)}
.site-footer strong,.site-footer .footer-brand strong,.site-footer h2,.site-footer h3{
  color:var(--cream);background:none}
.site-footer .brand-mark span strong{color:var(--cream)}
.site-footer .brand-mark span small{color:var(--brass-300)}
.site-footer .footer-head,.site-footer .foot-h{color:var(--brass-300)}
.site-footer ul,.site-footer ol{margin:0;padding:0;list-style:none}
.site-footer li{margin:0}

.advisor-launch,.advisor-launch strong,.advisor-launch span,
.advisor-panel,.advisor-panel p,.advisor-panel strong,.advisor-panel a{font-family:var(--sans)}
.advisor-launch{text-decoration:none}

/* ==========================================================================
   3D TAB SYSTEM
   One raised surface, used by every tab on the site: the home row, the
   category cards, the resource tabs, the back control and the previous /
   next pair. It borrows the roundel's construction — a brass rim, a lit top
   edge, a shadow pooled beneath — so a tab reads as the same object as the
   mark it sits under. Two grounds: dark for the ink bands, light for cream
   and white. Appended last, so it takes precedence over the flat versions.
   ========================================================================== */

.hometabs > .hometab,
.navcards > .navcard,
.rtabs > .rtab,
.backbar .backbar__back,
.pnav > .pnav__a{
  position:relative; isolation:isolate; text-decoration:none; border-radius:7px;
  transition:transform .17s cubic-bezier(.2,.7,.2,1), box-shadow .17s ease,
             border-color .17s ease, background .2s ease;
}
.hometabs > .hometab:active,
.navcards > .navcard:active,
.rtabs > .rtab:active,
.backbar .backbar__back:active,
.pnav > .pnav__a:active{transform:translateY(2px)}

/* ---------------------------------------------------- dark ground (ink) -- */
.hometabs > .hometab{
  background:linear-gradient(180deg,#1c3c5d 0%,#122a41 44%,#091827 100%);
  border:1px solid rgba(201,167,102,.34);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.17),
    inset 0 0 0 1px rgba(201,167,102,.10),
    inset 0 -12px 20px -14px rgba(0,0,0,.9),
    0 2px 2px rgba(4,12,20,.42),
    0 14px 24px -15px rgba(4,12,20,.8);
}
.hometabs > .hometab:hover,
.hometabs > .hometab:focus-visible{
  transform:translateY(-3px);
  border-color:rgba(201,167,102,.78);
  background:linear-gradient(180deg,#24496e 0%,#163351 44%,#0b1d2f 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.26),
    inset 0 0 0 1px rgba(201,167,102,.24),
    inset 0 -12px 20px -14px rgba(0,0,0,.85),
    0 3px 3px rgba(4,12,20,.44),
    0 22px 34px -18px rgba(4,12,20,.9);
}

/* ------------------------------------------- light ground (cream, white) -- */
.navcards > .navcard,
.rtabs > .rtab,
.backbar .backbar__back,
.pnav > .pnav__a{
  background:linear-gradient(180deg,#fffdf9 0%,#fbf7ef 55%,#f2ebdd 100%);
  border:1px solid rgba(176,138,79,.32);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.95),
    inset 0 0 0 1px rgba(201,167,102,.07),
    inset 0 -10px 18px -14px rgba(116,92,54,.34),
    0 2px 2px rgba(58,46,28,.07),
    0 14px 24px -16px rgba(58,46,28,.3);
}
.navcards > .navcard:hover, .navcards > .navcard:focus-visible,
.rtabs > .rtab:hover, .rtabs > .rtab:focus-visible,
.backbar .backbar__back:hover, .backbar .backbar__back:focus-visible,
.pnav > .pnav__a:hover, .pnav > .pnav__a:focus-visible{
  transform:translateY(-3px);
  border-color:rgba(176,138,79,.72);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,1),
    inset 0 0 0 1px rgba(201,167,102,.2),
    inset 0 -10px 18px -14px rgba(116,92,54,.3),
    0 3px 3px rgba(58,46,28,.08),
    0 22px 34px -20px rgba(58,46,28,.4);
}
.pnav > .pnav__empty{background:none;border:0;box-shadow:none}

/* --------------------------------------------------- the home page row -- */
.hometabs{
  display:flex; flex-wrap:wrap; gap:14px; justify-content:center;
  background:none; border:0; padding:0;
}
.hometabs > .hometab{
  flex:0 1 auto; min-width:170px;
  display:inline-flex; align-items:center; justify-content:center;
  padding:19px 28px; text-align:center;
}
.hometabs > .hometab span{
  font-family:var(--serif); font-size:17.5px; font-weight:600; line-height:1.1;
  color:#f5eddd; letter-spacing:.012em;
}
.hometabs > .hometab:hover span{color:#fff}
@media (max-width:560px){
  .hometabs{gap:11px}
  .hometabs > .hometab{min-width:0; flex:1 1 44%; padding:16px 14px}
  .hometabs > .hometab span{font-size:15.5px}
}

/* ------------------------------------------------------ the back control -- */
.backbar .backbar__in{gap:16px}
.backbar .backbar__back{
  display:inline-flex; align-items:center; gap:9px; flex:none;
  padding:9px 17px 9px 13px; color:var(--ink-900);
  font-family:var(--serif); font-size:14px; font-weight:600;
  letter-spacing:0; text-transform:none;
}
.backbar .backbar__back:hover{background:linear-gradient(180deg,#fffdf9,#fdf9f2 55%,#f5eee1)}
.backbar .backbar__arrow{
  font-style:normal; font-size:15px; line-height:1; color:var(--brass);
  transition:transform .17s cubic-bezier(.2,.7,.2,1);
}
.backbar .backbar__back:hover .backbar__arrow{transform:translateX(-3px)}

/* ------------------------------------------------------- resource tabs -- */
.rtabs > .rtab{padding:17px 19px}
.pnav > .pnav__a{padding:16px 19px}

/* ---------------------------------------------------------------- motion -- */
@media (prefers-reduced-motion:reduce){
  .hometabs > .hometab, .navcards > .navcard, .rtabs > .rtab,
  .backbar .backbar__back, .pnav > .pnav__a, .backbar .backbar__arrow{
    transition:none
  }
  .hometabs > .hometab:hover, .navcards > .navcard:hover, .rtabs > .rtab:hover,
  .backbar .backbar__back:hover, .pnav > .pnav__a:hover{transform:none}
}

/* --------- the legacy-page dial, matched to the framework hero exactly --- */
.dialhero{--dh-size:clamp(520px,60vw,880px);--dh-roundel:clamp(116px,13vw,187px)}

/* ---- home tab row: smaller, so the row reads as navigation, not as buttons */
.hometabs > .hometab{min-width:132px;padding:12px 20px}
.hometabs > .hometab span{font-size:15px}
@media (max-width:560px){
  .hometabs > .hometab{min-width:0;flex:1 1 44%;padding:11px 12px}
  .hometabs > .hometab span{font-size:14px}
}

/* ---- previous / next: no placeholder tile where there is no sibling ----- */
.pnav--prev-only{grid-template-columns:1fr;justify-items:start}
.pnav--next-only{grid-template-columns:1fr;justify-items:end}
.pnav--next-only .pnav__next{text-align:right}
@media (min-width:720px){
  .pnav--prev-only,.pnav--next-only{grid-template-columns:minmax(0,1fr)}
}

/* ---- the statutory anchor block on a sub-service page ------------------- */
.lawblock{max-width:72ch;border-left:3px solid var(--brass);padding:4px 0 4px 22px}
.lawblock p{font-size:16.5px;line-height:1.72;color:var(--ink-900);margin:0}
.lawblock em{font-style:italic}
@media (max-width:600px){.lawblock{padding-left:16px}.lawblock p{font-size:15.5px}}