/* Free tools in the agencies look (step 3, round 2; Ahmed 3 Nov 21:31 "why are we using old design? ... on the rest of
   page"). The calculator keeps its own markup, script and form styles and sits in a white card rising from the clouds;
   every other block uses the shared landing components in pages.css. Loaded only by tool pages, after tools.css. */
.tx2.tool-shell{background:#fff;padding-bottom:0}

/* hero: the shared split sky, the tool's own words, an agent beside the tool's example result */
.tx2-hero .sh-split{padding-bottom:236px}
.tx2-hero .tool-hero__crumb.sh-crumbs{display:block;margin:0 0 20px;font:600 14px/1.3 "Figtree","Helvetica Neue",Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#E6DAFF}
.tx2-hero .tool-hero__crumb a{color:#E6DAFF}
.tx2-hero .tool-hero__crumb a:hover{color:#fff}
.tx2-hero .tool-hero__crumb span{margin:0 10px;opacity:.6}
.tx2-hero .tool-hero__crumb span:last-child{margin:0;opacity:1}
.tx2-hero .tool-hero__title.sh-h1{margin:0;font-family:"Figtree","Helvetica Neue",Arial,sans-serif;font-weight:600;letter-spacing:-.034em;line-height:1.07;color:#fff}
.tx2-hero .tool-hero__title.sh-h1--long{font-size:clamp(36px,3.1vw,44px)}
@media (min-width:761px){.tx2-hero .sh-chip{white-space:nowrap}}  /* the pill never breaks into a two-line box */
@media (max-width:760px){.tx2-hero .tool-hero__title.sh-h1{line-height:1.2}.tx2-hero .sh-chip--long{display:inline;-webkit-backdrop-filter:none;backdrop-filter:none;-webkit-box-decoration-break:clone;box-decoration-break:clone;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.5),0 10px 28px rgba(16,8,64,.2)}.tx2-hero .sh-chip--long::before{display:none}}  /* on a phone a pill too long for one line becomes one pill per line */
.tx2-hero .tool-hero__title .gr.sh-chip{background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.26));-webkit-background-clip:border-box;background-clip:border-box;-webkit-text-fill-color:#fff;color:#fff}
.tx2-hero .tool-hero__sub.sh-sub{margin:20px 0 0;max-width:560px;font:400 19px/1.55 "Inter",sans-serif;color:rgba(255,255,255,.93)}
.tx2-hero .tool-hero__sub strong{color:#fff;font-weight:600}
.tx2-card{position:relative;padding:26px 26px 28px;border-radius:28px;background:#fff;color:#0B1530;box-shadow:0 30px 80px rgba(10,10,48,.35)}
.tx2-card__k{display:flex;align-items:center;gap:10px;margin:0;font:600 15px/1.2 "Inter",sans-serif;color:#0B1530}
.tx2-card__mono{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;background:#F3F6FC}
.tx2-card__mono img{width:20px;height:20px}
.tx2-card__k em{margin-left:auto;padding:7px 11px;border-radius:999px;background:#F3F6FC;font:600 12px/1 "Inter",sans-serif;font-style:normal;color:#5A647A}
.tx2-card__ms{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:20px}
.tx2-m{display:grid;align-content:space-between;gap:18px;min-height:132px;padding:18px 18px 20px;border-radius:20px;background:#F3F6FC}
.tx2-m span{font:500 13.5px/1.25 "Inter",sans-serif;color:#5A647A}
.tx2-m b{font:600 clamp(28px,2.6vw,38px)/1 "Figtree","Helvetica Neue",Arial,sans-serif;letter-spacing:-.025em;color:#0B1530;overflow-wrap:anywhere}
.tx2-m--main{background:linear-gradient(139deg,#3A1E9C 0%,#3133B4 42%,#2A5EC6 78%,#2A7FD0 100%)}
.tx2-m--main span{color:rgba(255,255,255,.86)}
.tx2-m--main b{color:#fff}
.tx2-card__bar{height:8px;margin-top:16px;border-radius:999px;background:#EEF1F8;overflow:hidden}
.tx2-card__bar i{display:block;width:var(--w,72%);height:100%;border-radius:inherit;background:linear-gradient(90deg,#1B2B7B,#5B2D8E);animation:tx2Grow 1.4s cubic-bezier(.23,1,.32,1) .3s both}
@keyframes tx2Grow{from{width:0}}
.tx2-card__step{margin:22px 0 0;font:600 13px/1 "Inter",sans-serif;color:#5A647A}
.tx2-card__bar--step{margin-top:10px}
.tx2-card__q{margin:22px 0 0;font:600 24px/1.25 "Figtree","Helvetica Neue",Arial,sans-serif;letter-spacing:-.015em;color:#0B1530}
.tx2-card__a{display:inline-flex;align-items:center;height:44px;margin:20px 0 0;padding:0 22px;border-radius:999px;background:#1B2B7B;color:#fff;font:600 14px/1 "Inter",sans-serif}

/* the calculator rises out of the clouds, in a clean white card; its own fields and results keep their styles */
.tx2 .tool-calc,.tx2 .tool-stage{position:relative;z-index:2;max-width:1120px;min-height:0;margin:-180px auto 0;padding:0 24px;background:none;display:block}
.tx2 .tool-calc__card,.tx2 .tool-stage__frame{max-width:none;margin:0;padding:52px 56px 48px;border:0;border-radius:30px;background:#fff;box-shadow:0 1px 2px rgba(11,21,48,.06),0 40px 100px rgba(27,43,123,.18)}
.tx2 .tool-stage__frame{padding-bottom:56px}
.tx2 .tool-calc__eyebrow{margin:0 0 14px;font:600 14px/1.2 "Figtree","Helvetica Neue",Arial,sans-serif;letter-spacing:.14em;color:#5B2D8E}
.tx2 .tool-calc__title{margin:0 0 10px;font:600 clamp(28px,2.6vw,38px)/1.1 "Figtree","Helvetica Neue",Arial,sans-serif;letter-spacing:-.025em;color:#0B1530}
.tx2 .tool-calc__sub{margin:0 0 32px;font:400 17px/1.55 "Inter",sans-serif;color:#4F5A70}
.tx2 .tool-stage__frame>.answer-capsule{margin:0 0 36px!important;padding:0!important;border:0!important;background:none!important;font:400 18px/1.6 "Inter",sans-serif!important;color:#2E374C!important}

/* the explainer and the worked example: the agencies accordion beside a picture, one open at a time */
.tx2-sec .lp-h2{max-width:900px}
.tx2-ctl{align-items:start}
.tx2-ctl--solo{grid-template-columns:minmax(0,1fr)}
.tx2-ctl .lp-rules summary b strong,.tx2-line b strong{font-weight:inherit}
.tx2-ctl .lp-rules details>p strong{color:#0B1530;font-weight:600}
.tx2-line{display:flex;align-items:center;gap:16px;padding:20px 0;border-bottom:1px solid var(--nl-line)}
.tx2-line .lp-feat__ic svg{width:22px;height:22px;fill:none;stroke:var(--nl-navy);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tx2-line b{font:600 19px/1.3 var(--nl-fd);color:var(--nl-ink)}
.tx2-eq{display:grid;place-items:center;min-height:360px}
.tx2-eq__card{width:100%;max-width:520px;padding:30px 30px 28px;border-radius:24px;background:#fff;box-shadow:0 1px 2px rgba(11,21,48,.06),0 24px 60px rgba(27,43,123,.14)}
.tx2-eq__k{margin:0;font:600 13px/1 var(--nl-f);letter-spacing:.06em;text-transform:uppercase;color:var(--nl-mut)}
.tx2-eq__f{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:22px 0 0;font:500 17px/1.3 var(--nl-f);color:var(--nl-ink)}
.tx2-eq__f b{font:600 40px/1 var(--nl-fd);letter-spacing:-.025em;background:linear-gradient(100deg,#1B2B7B,#5B2D8E);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.tx2-eq__f i{font:500 26px/1 var(--nl-fd);font-style:normal;color:var(--nl-mut)}
.tx2-eq__f span{padding:10px 14px;border-radius:14px;background:var(--nl-tint)}
.tx2-eq__x{display:flex;align-items:baseline;gap:10px;margin:26px 0 0;padding-top:20px;border-top:1px solid var(--nl-line)}
.tx2-eq__x span{font:600 12px/1 var(--nl-f);letter-spacing:.06em;text-transform:uppercase;color:var(--nl-mut)}
.tx2-eq__x b{font:600 30px/1 var(--nl-fd);letter-spacing:-.02em;color:var(--nl-ink)}
.tx2-eq__x em{font:500 14px/1 var(--nl-f);font-style:normal;color:var(--nl-mut)}
.tx2-excard{display:grid;align-content:start;gap:10px;min-height:320px;padding:40px}
.tx2-excard__face{width:72px;height:72px;margin-bottom:14px;padding:4px;border-radius:50%;background:rgba(236,224,255,.22);box-shadow:inset 0 0 0 1px rgba(255,255,255,.45)}
.tx2-excard__face img{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover;background:linear-gradient(165deg,#FFFFFF 0%,#EEE8FF 55%,#DCE7FF 100%)}
.tx2-excard__k{margin:0;font:600 13px/1 var(--nl-f);letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.78)}
.tx2-excard__t{margin:0;font:600 clamp(24px,2.2vw,30px)/1.15 var(--nl-fd);letter-spacing:-.02em;color:#fff}
.tx2-excard__s{margin:4px 0 0;font:500 16px/1.5 var(--nl-f);color:rgba(255,255,255,.9)}
.tx2-faq{margin-top:40px}

/* the close: the home page's sky, the call, then the other tools as glass cards */
.tx2-close .gr,.tx2-band .gr{background:none;-webkit-background-clip:border-box;background-clip:border-box;-webkit-text-fill-color:currentColor;color:#E6DAFF}
.tx2-close>p,.tx2-band>p{margin:20px auto 0;max-width:680px;font:400 19px/1.55 var(--nl-f);color:rgba(255,255,255,.92)}
.tx2-band h2{margin:0;font:600 clamp(26px,2.6vw,36px)/1.15 var(--nl-fd);letter-spacing:-.02em;color:#fff;text-wrap:balance}
.tx2-rel{max-width:1180px;margin:120px auto 0;text-align:left}
.tx2-rel .nl-label{color:#fff}
.nl-close .tx2-rel h2{margin:0;max-width:none;font:600 clamp(26px,2.4vw,34px)/1.15 var(--nl-fd);letter-spacing:-.02em;color:#fff}
.tx2-rel__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:28px}
.tx2-rel__grid .tool-related__card{display:grid;align-content:start;gap:8px;padding:22px 22px 20px;border:0;border-radius:20px;color:#fff;background:rgba(18,14,64,.42);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.34);transition:transform .2s ease,background-color .2s ease}
.tx2-rel__grid .tool-related__card:hover{transform:translateY(-3px);background:rgba(18,14,64,.56);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.6)}
.tx2-rel__grid .tool-related__card-name{margin:0;font:600 17px/1.25 var(--nl-fd);letter-spacing:-.01em;color:#fff}
.tx2-rel__grid .tool-related__card-sub{margin:0;font:400 14px/1.5 var(--nl-f);color:rgba(255,255,255,.88)}
.tx2-rel__grid .tool-related__card-tag{justify-self:start;margin-top:6px;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.16);font:600 11px/1 var(--nl-f);letter-spacing:.1em;color:#fff;-webkit-text-fill-color:#fff}
.tx2-rel__grid--light{margin-top:44px}
.tx2-rel__grid--light .tool-related__card{border:1px solid var(--nl-line);background:#fff;color:var(--nl-ink)}
.tx2-rel__grid--light .tool-related__card:hover{background:var(--nl-tint)}
.tx2-rel__grid--light .tool-related__card-name{color:var(--nl-ink)}
.tx2-rel__grid--light .tool-related__card-sub{color:var(--nl-mut)}
.tx2-rel__grid--light .tool-related__card-tag{background:var(--nl-tint);color:var(--nl-navy);-webkit-text-fill-color:var(--nl-navy)}
.tx2-bandsec+.lp-sec{padding-top:120px}

@media (max-width:1100px){
  .tx2-rel__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tx2-eq{min-height:0}
}
@media (max-width:760px){
  .tx2-hero .sh-split{padding-bottom:200px}
  .tx2-hero .tool-hero__crumb.sh-crumbs{font-size:12px;letter-spacing:.12em}
  .tx2-hero .tool-hero__sub.sh-sub{font-size:17px}
  .tx2 .tool-calc,.tx2 .tool-stage{margin-top:-150px;padding:0 12px}
  .tx2 .tool-calc__card,.tx2 .tool-stage__frame{padding:30px 20px 28px;border-radius:24px}
  .tx2-m{min-height:112px}
  .tx2-excard{min-height:0;padding:28px 24px}
  .tx2-rel__grid{grid-template-columns:1fr}
  .tx2-rel{margin-top:88px}
}
@media (prefers-reduced-motion:reduce){.tx2-card__bar i{animation:none}}
/* Ahmed 4 Nov: no packed lines (lines.js fails a line past 100 characters) */
.tx2 .tool-calc__sub,.tx2 .lp-rules details>p{max-width:760px;text-wrap:pretty}
.tx2 .tool-stage__frame p.answer-capsule{max-width:860px}
