/* Faithful responsive reconstruction of the user-approved Privacy composition. */
.system-page .privacy-approved{margin:0;background:#0e1a16;color:#e9e6de;overflow:hidden}
.privacy-approved-inner{width:min(100%,1448px);margin-inline:auto;padding:0 0 clamp(54px,6vw,86px)}
.privacy-approved-lead{display:grid;grid-template-columns:minmax(0,928px) minmax(360px,1fr);align-items:center}
.privacy-approved-hero{position:relative;align-self:center;min-width:0;margin:0;background:#181a19;overflow:hidden}
.privacy-approved-hero>img{display:block;width:100%;height:auto;object-fit:cover;object-position:center;aspect-ratio:928/633}
.privacy-approved-intro{display:flex;flex-direction:column;justify-content:center;padding:clamp(42px,4vw,64px) clamp(34px,4.5vw,70px);background:#0e1a16}
.privacy-approved h2{margin:0 0 34px;color:#f0ede7;font:400 66px/1.06 var(--serif);letter-spacing:0;text-wrap:balance}
/* Two lines, as in the approved composition: each line holds together and the size follows the column. */
.privacy-approved h2 span{display:block;white-space:nowrap}
@media(min-width:801px){
  .privacy-approved-intro{container-type:inline-size}
  .privacy-approved-lead .privacy-approved-intro h2{font-size:clamp(32px,14.6cqi,62px)}
}
.privacy-approved-intro p{max-width:35ch;margin:0;color:#d1d2d1;font:400 17px/1.65 var(--sans);letter-spacing:0}
.privacy-approved-intro p+p{margin-top:21px;font-size:15px}
.privacy-approved-intro .privacy-approved-lede{max-width:30ch;text-wrap:balance}
.privacy-approved-steps{list-style:none;width:min(calc(100% - 64px),1370px);margin:0 auto;padding:0;display:grid;grid-template-columns:minmax(0,423px) minmax(0,378px) minmax(0,421px);justify-content:space-between;gap:36px}
.privacy-approved-step{min-width:0}
.privacy-example{position:relative;margin:0;overflow:hidden;border:1px solid #b29f826e;background:#171915;aspect-ratio:1.75}
.privacy-example>img{display:block;width:100%;height:100%;object-fit:cover}
.privacy-example figcaption{position:absolute;color:#f1e9dd;font-family:var(--sans);letter-spacing:0}
.privacy-example-access .access-overlay{inset:0 42% 0 0;padding:14px 12px;background:#151713d9;backdrop-filter:blur(8px)}
.access-overlay>strong{font:500 11px/1.2 var(--sans)}
.access-overlay ul{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:6px}
.access-overlay li{display:flex;align-items:center;justify-content:space-between;gap:8px;font:500 8px/1.2 var(--sans)}
.access-overlay small{display:block;margin-top:2px;color:#bdb6ab;font:400 6px/1.2 var(--sans)}
.access-overlay i{width:18px;height:9px;border-radius:9px;background:#3f8a7f;box-shadow:inset 0 0 0 1px #dce5d84d}
.access-overlay li:nth-child(2) i,.access-overlay li:nth-child(4) i{background:#746e65}
.privacy-example-view figcaption{left:0;right:0;top:0;width:auto;min-height:36%;padding:16px 18px 24px;background:linear-gradient(90deg,#171815fa 0 58%,#171815e8 72%,#1718157f 91%,transparent)}
.privacy-example-view strong{display:block;font:400 18px/1.15 var(--serif)}
.privacy-example-view span{display:block;margin-top:5px;color:#d7cbb9;font:400 10px/1.2 var(--sans)}
.privacy-example-private figcaption{left:27%;right:27%;top:19%;min-height:40%;display:grid;place-content:center;justify-items:center;gap:8px;background:#111614bd;border:1px solid #c6ac805e;box-shadow:0 12px 30px #0005,inset 0 1px #ffffff12;backdrop-filter:blur(11px)}
.privacy-example-private svg{width:22px;height:22px;stroke-width:1.4;color:#e5d0ae}
.privacy-example-private strong{font:500 10px/1 var(--sans);text-transform:uppercase}
.privacy-approved-step-number{display:flex;align-items:center;gap:12px;margin:18px 0 7px;color:#c3b097;font:400 13px/1.5 var(--sans)}
.privacy-approved-step-number::after{content:"";width:52px;border-top:1px solid #a9988170}
.privacy-approved h3{margin:0 0 10px;color:#efede7;font:400 36px/1.12 var(--serif);letter-spacing:0}
.privacy-approved-step>p{max-width:36ch;margin:0;color:#cfd1d0;font:400 14px/1.65 var(--sans);letter-spacing:0}
@media(max-width:1100px){
  .privacy-approved-lead{grid-template-columns:minmax(0,65%) minmax(0,35%)}
  .privacy-approved-intro{padding:44px 30px}
  .privacy-approved h2{font-size:43px}
  .privacy-approved-intro p{font-size:15px}
  .privacy-approved-intro p+p{font-size:13px}
  .privacy-approved-steps{width:calc(100% - 44px);gap:22px}
  .privacy-approved-steps{grid-template-columns:repeat(3,minmax(0,1fr));}
  .privacy-approved h3{font-size:28px}
  .privacy-example-access .access-overlay{right:38%;padding:10px 8px}
  .access-overlay ul{gap:4px;margin-top:7px}
}
@media(max-width:800px){
  .privacy-approved-inner{padding-bottom:52px}
  .privacy-approved-lead{grid-template-columns:1fr}
  .privacy-approved-hero{order:2}
  .privacy-approved-intro{order:1;padding:46px var(--gutter) 40px}
  .privacy-approved h2{font-size:48px}
  .privacy-approved-intro p{font-size:16px}
  .privacy-approved-intro p+p{font-size:14px}
  .privacy-approved-steps{width:auto;margin:0;padding:38px var(--gutter) 0;grid-template-columns:1fr;gap:44px}
  .privacy-approved-step{width:100%;margin-inline:auto}
  .privacy-approved-step:nth-child(1){max-width:423px}
  .privacy-approved-step:nth-child(2){max-width:378px}
  .privacy-approved-step:nth-child(3){max-width:421px}
  .privacy-example{width:100%;aspect-ratio:1.75}
  .privacy-approved h3{font-size:32px}
  .privacy-approved-step>p{font-size:14px}
  .access-overlay>strong{font-size:13px}
  .access-overlay li{font-size:10px}
  .access-overlay small{font-size:8px}
  .privacy-example-view strong{font-size:23px}
  .privacy-example-view span{font-size:11px}
}
@media(max-width:480px){
  .privacy-approved-intro{padding-block:38px 34px}
  .privacy-approved h2{font-size:40px}
  .privacy-approved-steps{padding-top:30px}
  .privacy-example-access .access-overlay{right:38%;padding:8px 7px}
  .access-overlay>strong{font-size:10px}
  .access-overlay ul{gap:4px;margin-top:6px}
  .access-overlay li{font-size:9px}
  .access-overlay small{display:none}
  .access-overlay i{width:14px;height:7px}
  .privacy-example-view figcaption{padding:12px 13px 18px}
  .privacy-example-view strong{font-size:18px}
  .privacy-example-view span{font-size:9px}
}
/* Phones: keep the Team Access names readable. */
@media(max-width:480px){
  .privacy-example-access .access-overlay{right:36%;padding:10px 9px}
  .access-overlay>strong{font-size:11px}
  .access-overlay li{font-size:10.5px}
}