/* ============================================================
   Inspectra - the document pages in the v2 look (doc-parts.js)
   ------------------------------------------------------------
   Loaded after styles.css and v2.css by every text page: the
   landing pages, the glossary, the help centre, the blog, the law
   pages, about / faq / accessibility. Their markup and words stay
   as they were; this is the frame the homepage and the profession
   pages have: a navy band on top, one calm reading column, v2
   type, lists, tables and questions, the closing band at the end.
   Scoped to body.doc, so the app pages that share styles.css never
   see it.
   ============================================================ */

/* ---------- the band on top ----------
   Navy, with a faint drafting grid (.dhero--plain); if a field photo is
   ever added for the page's topic, it sits under the gradient instead. */
.dhero{position:relative;isolation:isolate;overflow:hidden;background:#0B1530;color:#fff;padding:40px 0 64px}
.dhero__bg{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:left center}
.dhero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(270deg,rgba(9,18,46,.97) 0%,rgba(10,22,58,.93) 38%,rgba(14,34,92,.72) 60%,rgba(14,34,92,.3) 84%,rgba(14,34,92,.12) 100%),
             linear-gradient(0deg,rgba(9,18,46,.6) 0%,rgba(9,18,46,0) 38%)}
.dhero__in>*{max-width:780px}
/* no photo: a drawing sheet - fine lines every 24px, a stronger one every 120px,
   and the brand blue rising from the corner the words start in */
.dhero--plain{background-color:#0F1B3E;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px),
                   linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px);
  background-size:120px 120px,120px 120px,24px 24px,24px 24px;background-position:-1px -1px}
.dhero--plain::before{background:radial-gradient(60% 130% at 92% 0%,rgba(37,99,235,.34),rgba(37,99,235,0) 62%),linear-gradient(0deg,rgba(9,18,46,.6) 0%,rgba(9,18,46,0) 42%)}
body.doc .dhero .crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:6px;color:#B6C3DD;font-size:14px;margin:0 0 30px}
body.doc .dhero .crumbs a{color:#DCE5F5;text-decoration:none}
body.doc .dhero .crumbs a:hover{color:#fff;text-decoration:underline}
body.doc .dhero header{margin:0}
body.doc .dhero .dhero__kicker{display:inline-flex;align-items:center;gap:9px;margin:0 0 16px;font-size:15.5px;font-weight:700;color:#A9C2FF}
body.doc .dhero .dhero__kicker i{width:8px;height:8px;border-radius:50%;background:var(--ix-mark);box-shadow:0 0 0 4px rgba(224,52,47,.25);flex:none}
body.doc .dhero h1{margin:0;color:#fff;font-size:clamp(32px,4.3vw,54px);line-height:1.12;font-weight:900;letter-spacing:-.012em;text-wrap:balance;text-shadow:0 2px 24px rgba(4,10,30,.35)}
body.doc .dhero .gterm__en{display:block;margin-top:12px;color:#B6C3DD;font-size:15px}
body.doc .dhero .dhero__lead{margin:18px 0 0;font-size:clamp(17px,1.5vw,19px);line-height:1.72;color:#D8E1F3;max-width:40em}
body.doc .dhero .bpost__meta{margin:18px 0 0;color:#C8D3EA}
body.doc .dhero .bpost__meta a{color:#fff;text-decoration:underline;text-decoration-color:rgba(255,255,255,.35);text-underline-offset:3px}
/* the short answer, as a pane of glass over the band */
body.doc .dhero .banswer{margin:30px 0 0;padding:20px 24px 22px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-inline-start:3px solid var(--ix-mark);border-radius:18px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
body.doc .dhero .banswer__k{color:#FFB3AE;letter-spacing:.02em}
body.doc .dhero .banswer p{color:#EEF2FA;font-weight:500;font-size:17.5px;line-height:1.75}
body.doc .dhero .banswer a{color:#fff;text-decoration:underline}
body.doc .dhero .banswer b,body.doc .dhero .banswer strong{color:#fff}
.dhero__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.dhero__cta .ix-btn-line{background:rgba(255,255,255,.08);color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.45)}
.dhero__cta .ix-btn-line:hover{background:rgba(255,255,255,.14);box-shadow:inset 0 0 0 1.5px #fff}
/* a post's cover rides up over the band */
.dhero--post{padding-bottom:120px}
@media (max-width:900px){
  .dhero{padding:28px 0 44px}
  .dhero::before{background:linear-gradient(180deg,rgba(9,18,46,.7) 0%,rgba(9,18,46,.9) 55%,rgba(9,18,46,.96) 100%)}
  .dhero--plain::before{background:radial-gradient(90% 70% at 100% 0%,rgba(37,99,235,.3),rgba(37,99,235,0) 70%)}
  .dhero__bg{object-position:28% center}
  body.doc .dhero .crumbs{margin-bottom:20px}
  body.doc .dhero .banswer{padding:16px 18px 18px}
  body.doc .dhero .banswer p{font-size:16.5px}
  .dhero--post{padding-bottom:84px}
}
@media (max-width:560px){.dhero__cta .btn{flex:1 1 100%}}

/* ---------- the reading column, and the app beside it ----------
   The text keeps the band's right edge; on a wide screen the left side
   holds the app (docAside), sticky, so the page reads as one piece. */
body.doc .lpage,body.doc .gterm{padding:60px 0 12px}
body.doc .bpost{padding:0 0 12px}
body.doc .lpage__in,body.doc .gterm__in,body.doc .bpost__in{max-width:800px}
.dside{display:none}
@media (min-width:1100px){
  body.doc .dcols{max-width:var(--container);display:grid;grid-template-columns:minmax(0,1fr) 300px;column-gap:72px;align-items:start}
  body.doc .dcols>*{grid-column:1;min-width:0}
  body.doc .dcols>.dside{display:block;grid-column:2;grid-row:1 / span 40;align-self:stretch}
  .dhero__in>*{max-width:calc(100% - 372px)}
}
.dside__card{position:sticky;top:104px;display:flex;flex-direction:column;align-items:center;text-align:center;padding:30px 24px 24px;border:1px solid var(--ix-line);border-radius:26px;background:linear-gradient(180deg,var(--ix-mist),#fff 58%);box-shadow:var(--ix-sh-1)}
.dside .ix-phone{width:176px;border-radius:34px;padding:7px}
.dside .ix-phone__screen{border-radius:28px}
.dside .ix-phone::after{border-radius:34px}
.dside .ix-phone img{display:block;width:100%;height:100%;object-fit:cover;object-position:top}
.dside__t{margin:22px 0 12px;font-size:21px;line-height:1.3;font-weight:800;color:var(--ix-ink)}
.dside__ticks{list-style:none;margin:0 0 20px;padding:0;display:grid;gap:8px;text-align:start;font-size:15px;color:var(--ix-ink-2)}
.dside__ticks li{position:relative;padding-inline-start:26px;line-height:1.5}
.dside__ticks li::before{content:"";position:absolute;inset-inline-start:0;top:.18em;width:18px;height:18px;border-radius:50%;background:var(--ix-blue-50) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 6 9 17l-5-5' fill='none' stroke='%231D4ED8' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/11px no-repeat}
.dside__btn{width:100%}
.dside__fine{margin:10px 0 0;font-size:13px;color:var(--ix-muted)}
.dside__more{margin-top:14px;font-size:14.5px;font-weight:700;color:var(--ix-blue-600);text-decoration:none}
.dside__more:hover{text-decoration:underline}
body.doc .bpost__hero{position:relative;margin:-88px 0 8px;height:clamp(220px,40vw,440px);border-radius:24px;box-shadow:0 2px 6px -2px rgba(11,21,48,.18),0 30px 60px -28px rgba(11,21,48,.5)}
@media (max-width:900px){body.doc .bpost__hero{margin-top:-60px;border-radius:18px}}
body.doc .bpost__body{margin-top:0;font-size:18px;line-height:1.82;color:var(--ix-ink-2)}
body.doc .bpost .bpost__body{margin-top:40px}
body.doc .bpost__body>:first-child{margin-top:0}
body.doc .bpost__body p{margin:0 0 20px}
body.doc .bpost__body h2{margin:56px 0 16px;font-size:clamp(25px,2.6vw,31px);line-height:1.24;font-weight:800;letter-spacing:-.006em;color:var(--ix-ink);text-wrap:balance}
body.doc .bpost__body h3{margin:34px 0 10px;font-size:21px;line-height:1.35;font-weight:800;color:var(--ix-ink)}
body.doc .bpost__body strong,body.doc .bpost__body b{color:var(--ix-ink)}
body.doc .bpost__body a{color:var(--ix-blue-600);font-weight:700;text-decoration:underline;text-decoration-color:rgba(29,78,216,.3);text-decoration-thickness:1.5px;text-underline-offset:3px}
body.doc .bpost__body a:hover{text-decoration-color:currentColor}
/* bullets: the v2 tick; steps: numbered discs, as the homepage numbers its steps */
body.doc .bpost__body ul{list-style:none;margin:0 0 24px;padding:0;display:grid;gap:12px}
body.doc .bpost__body ul>li{position:relative;padding-inline-start:34px;line-height:1.72}
body.doc .bpost__body ul>li::before{content:"";position:absolute;inset-inline-start:0;top:.36em;width:22px;height:22px;border-radius:50%;background:var(--ix-blue-50) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 6 9 17l-5-5' fill='none' stroke='%231D4ED8' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/13px no-repeat}
body.doc .bpost__body ol{list-style:none;counter-reset:dstep;margin:0 0 26px;padding:0;display:grid;gap:14px}
body.doc .bpost__body ol>li{counter-increment:dstep;position:relative;padding-inline-start:46px;min-height:30px;line-height:1.72}
body.doc .bpost__body ol>li::before{content:counter(dstep);position:absolute;inset-inline-start:0;top:.12em;width:30px;height:30px;border-radius:50%;background:var(--ix-navy);color:#fff;font-size:14.5px;font-weight:800;line-height:30px;text-align:center}
body.doc .bpost__body li>ul,body.doc .bpost__body li>ol{margin:12px 0 0}
body.doc .hsteps{background:var(--ix-mist);border:1px solid var(--ix-line);border-radius:18px;padding:24px 26px 20px}
body.doc .hsteps h2{margin:0 0 16px;font-size:19px}
/* the answer inside an article (blog posts keep it in the text) */
body.doc .bpost__body .banswer{margin:0 0 30px;padding:20px 24px 22px;background:var(--ix-blue-50);border:0;border-inline-start:3px solid var(--ix-mark);border-radius:16px}
body.doc .banswer__k{color:var(--ix-mark);font-weight:900}
body.doc .bpost__body .banswer p{margin:0;color:var(--ix-ink);font-size:17.5px;line-height:1.75;font-weight:600}
/* tables: a card, a quiet header, the first column as the row's name */
body.doc .btable-wrap{margin:8px 0 30px;border:1px solid var(--ix-line);border-radius:16px;overflow-x:auto;background:#fff;box-shadow:var(--ix-sh-1)}
body.doc .btable-wrap table{border:0;border-radius:0;box-shadow:none;margin:0}
body.doc .bpost__body table{min-width:480px;font-size:16px;line-height:1.6}
body.doc .bpost__body th{background:var(--ix-mist);color:var(--ix-ink);font-weight:800;font-size:15px;padding:14px 16px;border-bottom:1px solid var(--ix-line)}
body.doc .bpost__body td{padding:13px 16px;border-bottom:1px solid var(--ix-line);color:var(--ix-ink-2)}
body.doc .bpost__body tbody tr:nth-child(even) td{background:#FAFBFD}
body.doc .bpost__body tbody td:first-child{color:var(--ix-ink);font-weight:700}
body.doc .bpost__body caption{padding:12px 16px 0;color:var(--ix-muted);font-size:13.5px}
body.doc .bpost__body img{max-width:100%;height:auto;border-radius:14px}
body.doc .bpost__body blockquote{margin:0 0 24px;padding:18px 22px;border-inline-start:3px solid var(--ix-blue);background:var(--ix-mist);border-radius:14px;color:var(--ix-ink)}

/* ---------- questions: the homepage's list ---------- */
body.doc .bfaq{margin:60px 0 0}
body.doc .bfaq h2{margin:0 0 10px;font-size:clamp(25px,2.6vw,31px);font-weight:800;color:var(--ix-ink)}
body.doc .bfaq__i{margin:0;background:none;border:0;border-bottom:1px solid var(--ix-line);border-radius:0;overflow:visible}
body.doc .bfaq h2+.bfaq__i{border-top:1px solid var(--ix-line)}
body.doc .bfaq__i summary{min-height:0;padding:20px 0;font-size:18px;font-weight:700;line-height:1.45;color:var(--ix-ink)}
body.doc .bfaq__i summary::after{content:"";width:22px;height:22px;background:linear-gradient(currentColor,currentColor) center/14px 2px no-repeat,linear-gradient(currentColor,currentColor) center/2px 14px no-repeat;color:var(--ix-blue);transition:transform .2s}
body.doc .bfaq__i[open] summary::after{content:"";transform:rotate(45deg)}
body.doc .bfaq__i summary:focus-visible{outline:3px solid var(--ix-blue);outline-offset:4px;border-radius:6px}
body.doc .bfaq__i>div{padding:0 0 22px;font-size:17px;line-height:1.75;color:var(--ix-ink-2)}
body.doc .bsources{margin-top:44px;border-top:1px solid var(--ix-line);padding-top:22px}

/* ---------- a CTA inside an article, next / related ---------- */
body.doc .bpost__cta{position:relative;overflow:hidden;isolation:isolate;margin:56px 0 0;padding:30px 32px;border-radius:24px;background:var(--ix-navy-2);box-shadow:var(--ix-sh-2)}
body.doc .bpost__cta::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(70% 120% at 100% 0%,rgba(37,99,235,.45),rgba(37,99,235,0) 60%)}
body.doc .bpost__cta b{font-size:21px;font-weight:800;line-height:1.35}
body.doc .bpost__cta p{color:#C8D3EA;font-size:15.5px}
body.doc .bpost__next{margin:44px 0 0;border:1px solid var(--ix-line);border-inline-start:3px solid var(--ix-mark);border-radius:18px;box-shadow:var(--ix-sh-1)}
body.doc .bpost__next-k{color:var(--ix-mark)}
body.doc .bpost__related{margin-top:56px}
body.doc .bpost__related h2,body.doc .gterm__rel h2{margin:0 0 18px;font-size:clamp(22px,2.2vw,26px);font-weight:800;color:var(--ix-ink)}
/* related links: cards with an arrow, two to a row */
body.doc .gterm__rel{margin-top:60px}
body.doc .glinks{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
body.doc .glinks li{margin:0}
body.doc .glinks a{display:flex;align-items:center;justify-content:space-between;gap:14px;height:100%;padding:16px 18px;border:1px solid var(--ix-line);border-radius:14px;background:#fff;color:var(--ix-ink);font-weight:700;line-height:1.45;text-decoration:none;transition:border-color .2s,box-shadow .2s,transform .2s}
body.doc .glinks a::after{content:"";flex:none;width:18px;height:18px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 12H5m6-6-6 6 6 6' fill='none' stroke='%232563EB' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;transition:translate .2s}
body.doc .glinks a:hover{border-color:var(--ix-blue);box-shadow:var(--ix-sh-1);transform:translateY(-2px);text-decoration:none}
body.doc .glinks a:hover::after{translate:-3px 0}
@media (max-width:640px){body.doc .glinks{grid-template-columns:1fr}}

/* ---------- cards: blog, glossary, help ---------- */
body.doc .bcard,body.doc .gcard{border-color:var(--ix-line);border-radius:18px;box-shadow:var(--ix-sh-1)}
body.doc .bcard:hover,body.doc .gcard:hover{border-color:var(--ix-blue-100);box-shadow:var(--ix-sh-2)}
body.doc .bcard h3,body.doc .gcard b{color:var(--ix-ink)}
body.doc .bchip{background:var(--ix-blue-50);color:var(--ix-blue-600)}
body.doc .bindex,body.doc .gsec{padding:44px 0 12px}
body.doc .bsearch input{border-color:var(--ix-line-2);border-radius:14px;padding-block:14px}
body.doc .bfilter{border-color:var(--ix-line-2);border-radius:999px;color:var(--ix-ink)}
body.doc .bfilter.is-active{background:var(--ix-navy);border-color:var(--ix-navy);color:#fff}
body.doc .gcat h2{color:var(--ix-ink);font-size:22px;font-weight:800}

/* ---------- law pages ---------- */
body.doc .law-src,body.doc .law-disc{border-radius:16px;border-color:var(--ix-line)}

/* ---------- the end: the closing band follows the text ---------- */
body.doc #download{margin-top:72px}
@media (max-width:900px){body.doc #download{margin-top:56px}}

/* ---------- /about/ (build-static.js aboutShell) ----------
   Built from the homepage's sections; these are the few it adds: the story
   beside the film, what's in the box on navy, and the founder's card. */
.dabout__story{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center}
.dabout__story .ix-loop{width:100%;max-width:520px;justify-self:center}
.dabout__punch{margin:24px 0 0;padding-inline-start:16px;border-inline-start:3px solid var(--ix-mark);font-size:clamp(19px,1.7vw,22px);line-height:1.5;font-weight:800;color:var(--ix-ink)}
.dcaps__grid{list-style:none;margin:48px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.dcaps__item{padding:24px 22px 22px;border-radius:20px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);transition:background .25s,border-color .25s,transform .25s}
.dcaps__item:hover{background:rgba(255,255,255,.08);border-color:rgba(157,183,255,.4);transform:translateY(-3px)}
.dcaps__ic{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:rgba(37,99,235,.24);color:#A9C2FF}
.dcaps__item h3{margin:18px 0 8px;font-size:19px;font-weight:800;color:#fff}
.dcaps__item p{margin:0;font-size:15.5px;line-height:1.65;color:#C8D3EA}
.dabout__where{display:grid;grid-template-columns:1.15fr .85fr;gap:64px;align-items:center}
.dabout__link{color:var(--ix-blue-600);font-weight:700;text-decoration:underline;text-decoration-color:rgba(29,78,216,.3);text-underline-offset:3px}
.dabout__link:hover{text-decoration-color:currentColor}
/* the founder's card: what brand-data.js AUTHOR holds, and the two ways to reach him */
.dabout__card{position:relative;overflow:hidden;padding:30px 28px 22px;border-radius:26px;background:#fff;border:1px solid var(--ix-line);box-shadow:var(--ix-sh-2)}
.dabout__card::before{content:"";position:absolute;inset:0 0 auto;height:5px;background:linear-gradient(90deg,var(--ix-blue),var(--ix-navy))}
.dabout__logo{display:block;width:56px;height:56px;border-radius:16px;overflow:hidden;box-shadow:var(--ix-sh-1)}
.dabout__logo img{display:block;width:100%;height:100%}
.dabout__card-k{margin:20px 0 4px;font-size:14px;font-weight:700;color:var(--ix-blue-600)}
.dabout__name{margin:0;font-size:clamp(24px,2.4vw,28px);line-height:1.2;font-weight:900;color:var(--ix-ink)}
.dabout__role{margin:6px 0 18px;font-size:16px;color:var(--ix-muted)}
.dabout__row{display:flex;align-items:center;gap:12px;padding:14px 0;border-top:1px solid var(--ix-line);color:var(--ix-ink);text-decoration:none}
.dabout__row .ix-ic{width:22px;height:22px;color:var(--ix-blue)}
.dabout__row span{font-weight:600;color:var(--ix-muted)}
.dabout__row b{margin-inline-start:auto;font-weight:800}
.dabout__row:hover b{color:var(--ix-blue-600)}
@media (max-width:1000px){
  .dabout__story,.dabout__where{grid-template-columns:1fr;gap:40px}
  .dcaps__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:560px){.dcaps__grid{grid-template-columns:1fr}}

/* ---------- /pricing/ (hand-kept page, same frame) ---------- */
body.doc .dhero .dhero__fine{margin:12px 0 0;font-size:14.5px;font-weight:700;color:#A9C2FF}
body.doc .apage-section{padding:64px 0}
body.doc .apage-section--alt{background:var(--ix-mist)}
body.doc .plan{border-radius:24px;border-color:var(--ix-line);box-shadow:var(--ix-sh-1)}
body.doc .plan--popular{box-shadow:var(--ix-sh-2)}
body.doc .plan:not(.plan--popular) .plan__name{color:var(--ix-ink)}
body.doc .acc__item{background:none;border:0;border-bottom:1px solid var(--ix-line);border-radius:0;box-shadow:none;margin:0}
body.doc .acc__item:first-child{border-top:1px solid var(--ix-line)}
body.doc .acc__item summary{padding:20px 0;font-size:18px;font-weight:700;color:var(--ix-ink)}
body.doc .acc__body{padding:0 0 22px;font-size:17px;line-height:1.75;color:var(--ix-ink-2)}

/* ---------- /about/: the four principles, numbered in the red pen ---------- */
.dprinciples{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;counter-reset:dpr}
.dprinciples__item{position:relative;padding:26px 26px 24px;border:1px solid var(--ix-line);border-radius:var(--ix-r-lg);background:#fff}
.dprinciples__item::before{counter-increment:dpr;content:counter(dpr);position:absolute;top:16px;inset-inline-end:24px;font:500 40px/1 var(--ix-hand);color:var(--ix-mark)}
.dprinciples__ic{display:block;color:var(--ix-navy);margin-bottom:14px}
.dprinciples__ic .ix-ic{width:30px;height:30px;stroke-width:1.7}
.dprinciples__item h3{font-size:19px;font-weight:800;line-height:1.35;padding-inline-end:36px}
.dprinciples__item p{margin-top:6px;font-size:16px;line-height:1.65;color:var(--ix-ink-2)}
@media (max-width:760px){.dprinciples{grid-template-columns:1fr}}