/* PPLI.com for advisors — layer three.
 *
 * Four things this sheet dresses, all of them added because the page had a
 * gap rather than because it wanted more ornament:
 *
 *   Professional Access, placed where the adviser has just finished a run and
 *   the run is about to be lost. It is the first place on the site where the
 *   public layer and the professional layer are named as two different things,
 *   so it is drawn as a lockup rather than as another call to action.
 *
 *   The negative cases. A page that only shows wins is read as a brochure, so
 *   the three most common declines get the same typographic weight as the
 *   case library above them — and the colour discipline is inverted: no gold,
 *   a red hairline, because these are not the good news.
 *
 *   Methodology and editorial oversight, with the advisory board named. This
 *   exists to be read by someone deciding whether to trust the arithmetic, so
 *   it is set as a document, not as a marketing band.
 *
 *   The regulatory briefing form. One field that matters, one checkbox that
 *   has to be ticked, and a status line that tells the truth about what
 *   happened when it was submitted.
 *
 * One thing to know before editing: the theme sets -webkit-text-fill-color on
 * every heading, and fill colour beats colour. Any heading on a dark ground
 * has to set both, with !important, or it renders navy on navy and vanishes.
 * That is why the declarations below look heavier than they should.
 */

.pp.adv{
  --ai-reader:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.2 5.4c2.9-.9 5.8-.9 8.8.6 3-1.5 5.9-1.5 8.8-.6v12.8c-2.9-.9-5.8-.9-8.8.6-3-1.5-5.9-1.5-8.8-.6Z'/%3E%3Cpath d='M12 6v12.8'/%3E%3C/svg%3E");
  --ai-lock:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4.6' y='10.4' width='14.8' height='10' rx='1.2'/%3E%3Cpath d='M8.2 10.4V7.6a3.8 3.8 0 0 1 7.6 0v2.8'/%3E%3C/svg%3E");
  --ai-open:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4.6' y='10.4' width='14.8' height='10' rx='1.2'/%3E%3Cpath d='M8.2 10.4V7.6a3.8 3.8 0 0 1 7.3-1.3'/%3E%3C/svg%3E");
}

.pp.adv .advx-li.i-reader:before{-webkit-mask-image:var(--ai-reader);mask-image:var(--ai-reader)}
.pp.adv .advx-li.is-soon:before{opacity:.42}
.pp.adv .advx-soon{display:inline-block;vertical-align:2px;margin-left:8px;
  font-size:7px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;
  padding:2px 6px;border:1px solid rgba(255,255,255,.22);color:rgba(255,255,255,.5)}
.pp.adv .sx.lt .advx-soon,.pp.adv .sx.cr .advx-soon{border-color:var(--a-ln);color:var(--a-mu)}

/* ==========================================================================
   1. Professional Access.

   The band sits between the simulator and the academy, on a navy that is one
   shade off the sections either side of it so it reads as a threshold rather
   than as another chapter. Nothing here is numbered: it is not a step in the
   argument, it is the door.
   ========================================================================== */

.pp.adv .advx-access{position:relative;background:var(--a-nv);color:#fff;
  padding:88px 0 92px;overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(176,149,72,.3),inset 0 -1px 0 rgba(176,149,72,.16)}
.pp.adv .advx-access:before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse at 12% 0%,rgba(176,149,72,.16),transparent 52%)}
.pp.adv .advx-access > .mx-w{position:relative}

.pp.adv .advx-acc-top{display:flex;align-items:flex-end;justify-content:space-between;
  gap:26px;flex-wrap:wrap;padding-bottom:22px;border-bottom:1px solid rgba(255,255,255,.12);
  margin-bottom:38px}
.pp.adv .advx-lock{display:flex;align-items:center;gap:14px}
.pp.adv .advx-lock img{width:104px;height:auto;display:block;opacity:.94}
.pp.adv .advx-lock span{display:block;padding-left:14px;border-left:1px solid rgba(255,255,255,.2);
  font-size:10px;letter-spacing:.3em;text-transform:uppercase;font-weight:700;color:var(--a-gd);
  line-height:1.5}
.pp.adv .advx-acc-kick{font-size:12px;line-height:1.7;color:rgba(255,255,255,.46);
  max-width:380px;margin:0}
.pp.adv .advx-acc-kick b{color:rgba(255,255,255,.8);font-weight:600}

.pp.adv .advx-acc-g{display:grid;grid-template-columns:minmax(0,1.24fr) minmax(0,.86fr);
  gap:52px;align-items:start}
.pp.adv .advx-acc-g h2{font-size:clamp(26px,2.7vw,36px);font-weight:300;line-height:1.1;
  letter-spacing:-.018em;margin:0 0 18px;
  color:#fff!important;-webkit-text-fill-color:#fff}
.pp.adv .advx-acc-g h2 em{font-style:italic;
  color:var(--a-gd)!important;-webkit-text-fill-color:var(--a-gd)}
.pp.adv .advx-acc-g > div > p.lede{font-size:16px;line-height:1.85;color:rgba(255,255,255,.62);
  max-width:640px;margin:0}
.pp.adv .advx-acc-g p.lede b{color:#fff;font-weight:600}

.pp.adv .advx-layers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.12);margin:32px 0 28px}
.pp.adv .advx-layer{background:var(--a-nv);padding:20px 22px 22px}
.pp.adv .advx-layer.pro{background:linear-gradient(180deg,rgba(176,149,72,.11),rgba(176,149,72,.02))}
.pp.adv .advx-layer h3{display:flex;align-items:center;gap:9px;margin:0 0 4px;
  font-family:'DM Sans',sans-serif!important;font-size:11px;letter-spacing:.18em;
  text-transform:uppercase;font-weight:700;
  color:rgba(255,255,255,.62)!important;-webkit-text-fill-color:rgba(255,255,255,.62)}
.pp.adv .advx-layer.pro h3{color:var(--a-gd)!important;-webkit-text-fill-color:var(--a-gd)}
.pp.adv .advx-layer h3:before{content:"";width:14px;height:14px;flex:0 0 14px;
  background-color:currentColor;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-position:center;mask-position:center;-webkit-mask-size:14px 14px;mask-size:14px 14px;
  -webkit-mask-image:var(--ai-open);mask-image:var(--ai-open)}
.pp.adv .advx-layer.pro h3:before{-webkit-mask-image:var(--ai-lock);mask-image:var(--ai-lock)}
.pp.adv .advx-layer .who{font-size:9px;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(255,255,255,.3);font-weight:700;margin:0 0 14px}
.pp.adv .advx-layer ul{margin:0;padding:0;list-style:none}
.pp.adv .advx-layer li{position:relative;padding:7px 0 7px 15px;font-size:12.5px;line-height:1.6;
  color:rgba(255,255,255,.55);border-top:1px solid rgba(255,255,255,.07)}
.pp.adv .advx-layer li:first-child{border-top:none}
.pp.adv .advx-layer li:before{content:"";position:absolute;left:0;top:14px;width:5px;height:1px;
  background:rgba(255,255,255,.3)}
.pp.adv .advx-layer.pro li{color:rgba(255,255,255,.74)}
.pp.adv .advx-layer.pro li:before{background:var(--a-gd)}

.pp.adv .advx-acc-btns{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.pp.adv .advx-acc-fine{margin:20px 0 0;font-size:11px;line-height:1.8;
  color:rgba(255,255,255,.34);max-width:620px}

/* The side panel: what happens to the run they have just made. */
.pp.adv .advx-acc-side{border:1px solid rgba(255,255,255,.13);background:var(--a-nv2);
  box-shadow:0 26px 60px rgba(0,0,0,.4)}
.pp.adv .advx-acc-side > h3{margin:0;padding:14px 20px;
  font-family:'DM Sans',sans-serif!important;font-size:8.5px;letter-spacing:.2em;
  text-transform:uppercase;font-weight:700;
  color:rgba(255,255,255,.46)!important;-webkit-text-fill-color:rgba(255,255,255,.46);
  border-bottom:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.02)}
.pp.adv .advx-steps{margin:0;padding:6px 20px 4px;list-style:none;counter-reset:accstep}
.pp.adv .advx-steps li{counter-increment:accstep;position:relative;padding:15px 0 15px 40px;
  border-top:1px solid rgba(255,255,255,.07);font-size:12.5px;line-height:1.7;
  color:rgba(255,255,255,.55)}
.pp.adv .advx-steps li:first-child{border-top:none}
.pp.adv .advx-steps li:before{content:counter(accstep);position:absolute;left:0;top:13px;
  width:24px;height:24px;display:grid;place-items:center;
  font-family:'Cormorant Garamond',Georgia,serif;font-size:14px;color:var(--a-gd);
  border:1px solid rgba(176,149,72,.4);line-height:1}
.pp.adv .advx-steps b{display:block;color:#fff;font-weight:600;font-size:12.5px;margin-bottom:3px}
.pp.adv .advx-acc-note{margin:0;padding:14px 20px 16px;border-top:1px solid rgba(255,255,255,.1);
  font-size:10.5px;line-height:1.75;color:rgba(255,255,255,.3)}

/* ==========================================================================
   2. Negative cases.

   Same grid as the case library, opposite colour discipline. Gold is reserved
   for the argument; a decline is marked in a muted red and nothing else on the
   page uses it, so the eye reads the block as a different kind of statement
   before it has read a word.
   ========================================================================== */

.pp.adv .advx-neg{margin-top:52px;padding-top:36px;border-top:1px solid var(--a-ln)}
.pp.adv .sx.dk .advx-neg{border-top-color:rgba(255,255,255,.12)}
.pp.adv .advx-neg-h{max-width:760px;margin-bottom:28px}
.pp.adv .advx-neg-h .tg span{color:#9A4A3C}
.pp.adv .advx-neg-h h3{font-family:'Cormorant Garamond',Georgia,serif;font-weight:300;
  font-size:clamp(22px,2.3vw,29px);line-height:1.14;letter-spacing:-.012em;
  color:var(--a-nv)!important;-webkit-text-fill-color:var(--a-nv);margin:10px 0 12px}
.pp.adv .advx-neg-h p{margin:0;font-size:14.5px;line-height:1.8;color:var(--a-mu)}

.pp.adv .advx-neg-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;
  background:var(--a-ln);border:1px solid var(--a-ln)}
.pp.adv .advx-neg-c{background:#fff;padding:24px 24px 26px;position:relative;
  display:flex;flex-direction:column}
.pp.adv .advx-neg-c:before{content:"";position:absolute;top:-1px;left:-1px;right:-1px;height:2px;
  background:#9A4A3C;opacity:.75}
/* Two lines of facts on every card, so the three case titles start on the
   same baseline whether the fact line wraps or not. */
.pp.adv .advx-neg-c .facts{font-size:9px;letter-spacing:.14em;text-transform:uppercase;
  font-weight:700;color:#9A4A3C;margin-bottom:10px;line-height:1.6;min-height:29px}
.pp.adv .advx-neg-c h4{font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;
  font-size:20px;line-height:1.2;margin:0 0 12px;letter-spacing:-.008em;
  color:var(--a-nv)!important;-webkit-text-fill-color:var(--a-nv)}
.pp.adv .advx-neg-c p{margin:0 0 12px;font-size:13px;line-height:1.78;color:var(--a-tx)}
.pp.adv .advx-neg-c p:last-of-type{margin-bottom:18px}
.pp.adv .advx-neg-c cite{display:block;font-style:normal;font-size:11px;line-height:1.7;
  color:var(--a-tx);margin-top:auto;padding-top:14px;border-top:1px solid var(--a-cr2)}
.pp.adv .advx-neg-c cite b{display:block;font-size:9px;letter-spacing:.14em;text-transform:uppercase;
  color:#9A4A3C;font-weight:700;margin-bottom:5px}
.pp.adv .advx-neg-foot{margin:26px 0 0;padding:16px 20px;background:var(--a-cr);
  border-left:2px solid #9A4A3C;font-size:12.5px;line-height:1.8;color:var(--a-tx)}

/* ==========================================================================
   3. Methodology and editorial oversight.
   ========================================================================== */

.pp.adv .advx-meth-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;
  background:var(--a-ln);border:1px solid var(--a-ln)}
.pp.adv .advx-meth-c{background:#fff;padding:26px 28px 28px}
.pp.adv .advx-meth-c h3{font-family:'DM Sans',sans-serif!important;font-size:9px;
  letter-spacing:.18em;text-transform:uppercase;font-weight:700;margin:0 0 12px;
  color:var(--a-gd-deep)!important;-webkit-text-fill-color:var(--a-gd-deep)}
.pp.adv .advx-meth-c p{margin:0;font-size:13.5px;line-height:1.82;color:var(--a-tx)}
.pp.adv .advx-meth-c p + p{margin-top:10px}

.pp.adv .advx-board{margin-top:44px;border:1px solid var(--a-ln);background:#fff}
.pp.adv .advx-board-h{display:flex;align-items:baseline;justify-content:space-between;gap:20px;
  flex-wrap:wrap;padding:16px 26px;border-bottom:1px solid var(--a-ln);background:var(--a-cr)}
.pp.adv .advx-board-h b{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;
  font-weight:700;color:var(--a-nv)}
.pp.adv .advx-board-h a{font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;
  font-weight:700;color:var(--a-gd-deep);text-decoration:none;border-bottom:1px solid rgba(176,149,72,.4)}
.pp.adv .advx-board-h a:hover{color:var(--a-nv);border-bottom-color:var(--a-nv)}
.pp.adv .advx-board-g{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;
  background:var(--a-ln);counter-reset:advbm}
.pp.adv .advx-bm{background:#fff;padding:20px 20px 22px;counter-increment:advbm}
.pp.adv .advx-bm .no{font-family:'Cormorant Garamond',Georgia,serif;font-size:15px;
  color:var(--a-gd);line-height:1;margin-bottom:12px;font-variant-numeric:lining-nums}
.pp.adv .advx-bm b{display:block;font-size:13px;line-height:1.35;color:var(--a-nv);font-weight:600}
.pp.adv .advx-bm .cr{display:block;font-size:9px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--a-gd-deep);font-weight:700;margin-top:5px;line-height:1.55;min-height:28px}
.pp.adv .advx-bm .af{display:block;font-size:11.5px;line-height:1.6;color:var(--a-mu);margin-top:4px}
.pp.adv .advx-board-note{margin:0;padding:16px 26px;border-top:1px solid var(--a-ln);
  background:var(--a-cr);font-size:11.5px;line-height:1.8;color:var(--a-mu)}

/* ==========================================================================
   4. The regulatory briefing.
   ========================================================================== */

.pp.adv .advx-brief{background:var(--a-nv2);color:#fff;padding:78px 0 82px;
  box-shadow:inset 0 1px 0 rgba(176,149,72,.22)}
.pp.adv .advx-brief-g{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
  gap:56px;align-items:start}
.pp.adv .advx-brief-g h2{font-size:clamp(25px,2.6vw,34px);font-weight:300;line-height:1.12;
  letter-spacing:-.018em;margin:12px 0 16px;
  color:#fff!important;-webkit-text-fill-color:#fff}
.pp.adv .advx-brief-g h2 em{font-style:italic;
  color:var(--a-gd)!important;-webkit-text-fill-color:var(--a-gd)}
.pp.adv .advx-brief-g > div > p{font-size:15.5px;line-height:1.85;color:rgba(255,255,255,.6);
  margin:0 0 24px;max-width:600px}
.pp.adv .advx-brief-what{margin:0;padding:0;list-style:none;border-top:1px solid rgba(255,255,255,.1)}
.pp.adv .advx-brief-what li{padding:14px 0;border-bottom:1px solid rgba(255,255,255,.1);
  font-size:12.5px;line-height:1.75;color:rgba(255,255,255,.52)}
.pp.adv .advx-brief-what b{display:block;font-size:8.5px;letter-spacing:.2em;text-transform:uppercase;
  font-weight:700;color:var(--a-gd);margin-bottom:5px}

.pp.adv .advx-form{border:1px solid rgba(255,255,255,.14);background:var(--a-nv);
  padding:26px 28px 28px;box-shadow:0 26px 60px rgba(0,0,0,.36)}
.pp.adv .advx-form h3{margin:0;font-family:'DM Sans',sans-serif!important;font-size:9px;
  letter-spacing:.2em;text-transform:uppercase;font-weight:700;
  color:var(--a-gd)!important;-webkit-text-fill-color:var(--a-gd)}
.pp.adv .advx-form .fl{display:block;font-size:9px;letter-spacing:.14em;text-transform:uppercase;
  font-weight:700;color:rgba(255,255,255,.42);margin:18px 0 6px}
.pp.adv .advx-form input[type=email],
.pp.adv .advx-form input[type=text]{width:100%;box-sizing:border-box;background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.16);color:#fff;font-family:'DM Sans',sans-serif;
  font-size:14px;padding:11px 13px;border-radius:0;-webkit-appearance:none;appearance:none;
  transition:border-color .2s,background .2s}
.pp.adv .advx-form input::placeholder{color:rgba(255,255,255,.24)}
.pp.adv .advx-form input:focus{outline:none;border-color:var(--a-gd);background:rgba(176,149,72,.07)}
.pp.adv .advx-form .fr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.pp.adv .advx-consent{display:flex;gap:11px;align-items:flex-start;margin:20px 0 0;
  padding-top:18px;border-top:1px solid rgba(255,255,255,.1);cursor:pointer}
.pp.adv .advx-consent input{flex:0 0 15px;width:15px;height:15px;margin:2px 0 0;
  accent-color:#B09548}
.pp.adv .advx-consent span{font-size:11.5px;line-height:1.7;color:rgba(255,255,255,.5)}
.pp.adv .advx-form button{margin-top:20px;width:100%;cursor:pointer;border:1px solid var(--a-gd);
  background:var(--a-gd);color:#0A0F17;font-family:'DM Sans',sans-serif;font-size:9px;
  letter-spacing:.18em;text-transform:uppercase;font-weight:700;padding:14px 20px;
  transition:background .2s,color .2s,opacity .2s}
.pp.adv .advx-form button:hover{background:transparent;color:var(--a-gd)}
.pp.adv .advx-form button[disabled]{opacity:.45;cursor:default}
.pp.adv .advx-form button[disabled]:hover{background:var(--a-gd);color:#0A0F17}
.pp.adv .advx-msg{margin:14px 0 0;font-size:12px;line-height:1.7;min-height:1px;
  color:rgba(255,255,255,.5)}
.pp.adv .advx-msg.ok{color:var(--a-gd)}
.pp.adv .advx-msg.bad{color:#D98A7C}
.pp.adv .advx-form .fine{margin:16px 0 0;padding-top:14px;border-top:1px solid rgba(255,255,255,.1);
  font-size:10.5px;line-height:1.75;color:rgba(255,255,255,.3)}
.pp.adv .advx-form .fine a{color:rgba(255,255,255,.5)}

/* ==========================================================================
   5. Narrow.
   ========================================================================== */

@media(max-width:1080px){
  .pp.adv .advx-acc-g,.pp.adv .advx-brief-g{grid-template-columns:minmax(0,1fr);gap:38px}
  .pp.adv .advx-neg-g{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pp.adv .advx-board-g{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pp.adv .advx-bm .cr{min-height:0}
}
@media(max-width:860px){
  .pp.adv .advx-meth-g{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:720px){
  .pp.adv .advx-access,.pp.adv .advx-brief{padding:60px 0 62px}
  .pp.adv .advx-layers{grid-template-columns:minmax(0,1fr)}
  .pp.adv .advx-neg-g{grid-template-columns:minmax(0,1fr)}
  .pp.adv .advx-neg-c .facts{min-height:0}
  .pp.adv .advx-board-g{grid-template-columns:minmax(0,1fr)}
  .pp.adv .advx-form .fr{grid-template-columns:minmax(0,1fr)}
  .pp.adv .advx-acc-top{align-items:flex-start}
  .pp.adv .advx-form{padding:22px 20px 24px}
}

/* ==========================================================================
   6. A correction that belongs to the hero, found while checking this layer.

   Section 7 of adv.css re-declares .advx-hero outside any media query, and it
   sits after the max-width:1080 block that collapses the hero to one column.
   Later rule, same specificity, so the collapse never happened: the hero stayed
   two columns down to a phone, and the interface panel beside it was squeezed
   until the revenue figure and the calendar rows spilled out of their boxes.
   These rules come after that sheet, so they win.
   ========================================================================== */

@media(max-width:1080px){
  .pp.adv .advx-hero{grid-template-columns:minmax(0,1fr);gap:38px}
}
@media(max-width:720px){
  .pp.adv .advx-hero-v .advx-ui-b{grid-template-columns:minmax(0,1fr)}
  .pp.adv .advx-hero-v .advx-ui-tiles{grid-template-columns:minmax(0,1fr)}
  .pp.adv .advx-hero-v .advx-ui-tiles b{font-size:22px}
}
