/* Standards, Privacy, Terms and For professionals share the landing's header, navy hero and quiet light
   sections (cinematic-story.css). This sheet adds the long-form reading column and the professionals' cards. */
/* A gold underline marks the current page in the footer, whatever colour the footer is. */
.film-footer nav a[aria-current=page]{font-weight:620;text-decoration:underline;text-decoration-color:#d9ae5f;text-decoration-thickness:2px;text-underline-offset:5px}
.legal-page .page-hero h1,.pros-page .page-hero h1{max-width:900px;font-size:clamp(40px,5vw,72px);line-height:1.02}
.page-note{margin-top:22px;font-size:13px;font-weight:560;letter-spacing:.04em;color:#adbed4}

/* The reading column sits under the hero text; the section list keeps pace beside it on wide screens. */
.legal-section{display:grid;grid-template-columns:minmax(0,700px) 230px;justify-content:space-between;column-gap:64px;padding-top:72px}
.page-toc{grid-column:2;grid-row:1;position:sticky;top:32px;align-self:start}
.page-toc ol{display:grid;gap:2px;margin:14px 0 0;padding:0;list-style:none}
.page-toc a{display:block;padding:7px 12px;border-radius:8px;font-size:13px;line-height:1.45;color:#5f7289;transition:background .15s,color .15s}
.page-toc a:hover{background:#eef3fa;color:#10263f}
.legal-wrap{grid-column:1;grid-row:1;font-size:17px;line-height:1.75;color:#3f5169}
.legal-wrap h2{margin:52px 0 14px;font:400 clamp(26px,2.4vw,32px)/1.2 Georgia,"Times New Roman",serif;letter-spacing:-.025em;color:#10263f;scroll-margin-top:32px}
.legal-wrap>:first-child{margin-top:0}
.legal-wrap p+p{margin-top:18px}
.legal-wrap a{color:#345e8e;text-decoration:underline;text-underline-offset:3px}
.legal-wrap strong{color:#10263f;font-weight:620}
.legal-wrap ul{display:grid;gap:12px;margin:18px 0 0;padding:0;list-style:none}
.legal-wrap li{position:relative;padding-left:24px}
.legal-wrap li::before{content:"";position:absolute;left:0;top:.62em;width:9px;height:9px;border-radius:50%;background:#d9ae5f;box-shadow:0 0 0 3px rgba(217,174,95,.2)}
.legal-wrap .callout{position:relative;overflow:hidden;margin-bottom:40px;padding:20px 24px 20px 28px;border-radius:16px;background:#f4f7fb;box-shadow:inset 0 0 0 1px #e3e9f2;font-size:15px;line-height:1.65}
.legal-wrap .callout::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:#d9ae5f}
.legal-wrap .button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;margin-top:44px;padding:12px 24px;border-radius:50px;background:#142d47;color:#fff;font-size:14px;font-weight:610;text-decoration:none}

/* For professionals: two cards rise into the hero like the pricing card, and the key moves down each card's steps. */
.pros-page .page-hero{padding-bottom:110px}
.pros-grid{position:relative;z-index:2;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:-56px;padding-top:0}
.pros-card{padding:34px 36px 36px;border-radius:20px;background:#fff;box-shadow:0 30px 70px -40px rgba(16,38,63,.5),inset 0 0 0 1px #e3e9f2}
.pros-card .eyebrow{color:#385f91}
.pros-card h2{margin-top:14px;font-size:clamp(27px,2.5vw,34px);line-height:1.1}
.pros-card>p{margin-top:14px;font-size:16px;line-height:1.65;color:#5f7289}
.pros-steps{display:grid;gap:14px;margin:24px 0 0;padding:0;list-style:none}
.pros-steps li{position:relative;padding-left:28px;font-size:15px;line-height:1.55;color:#5f7289;animation:pros-step-copy 9s ease-in-out infinite;animation-delay:calc(var(--i)*3s)}
.pros-steps li::before{content:"";position:absolute;left:0;top:.42em;width:11px;height:11px;border-radius:50%;background:#d9ae5f;box-shadow:0 0 0 3px rgba(217,174,95,.2);animation:pros-step-key 9s ease-in-out infinite;animation-delay:calc(var(--i)*3s)}
.pros-steps strong{color:#10263f;font-weight:620}
@keyframes pros-step-key{0%,5%{transform:none;box-shadow:0 0 0 3px rgba(217,174,95,.2)}10%,30%{transform:scale(1.3);box-shadow:0 0 0 4px rgba(217,174,95,.3),0 0 18px rgba(217,174,95,.75)}36%,100%{transform:none;box-shadow:0 0 0 3px rgba(217,174,95,.2)}}
@keyframes pros-step-copy{0%,5%{color:#5f7289}10%,30%{color:#10263f}36%,100%{color:#5f7289}}
.pros-specialists{background:#f4f7fb}
.pros-specialists h2,.pros-sharing h2{max-width:760px}
.pros-lead{max-width:720px;margin-top:16px;font-size:17px;line-height:1.7;color:#5f7289}
.pros-roles{display:flex;flex-wrap:wrap;gap:12px;margin:26px 0 0;padding:0;list-style:none}
.pros-roles li{display:inline-flex;align-items:center;gap:12px;padding:6px 20px 6px 6px;border-radius:50px;background:#fff;box-shadow:inset 0 0 0 1px #e3e9f2}
.pros-roles i{width:40px;height:40px;border-radius:50%;background:#1a2f4b url("/story/team.jpg") calc(var(--face,0)*25%) 0/500% 100% no-repeat;box-shadow:0 0 0 2px #fff,0 0 0 3px rgba(217,174,95,.4)}
.pros-roles a{font-size:14px;font-weight:600;color:#10263f}
.pros-links{margin-top:18px;font-size:15px}
.pros-links a{color:#345e8e;text-decoration:underline;text-underline-offset:4px}
.pros-sharing details{max-width:720px;margin-top:30px;box-shadow:0 1px 0 #e3e9f2,0 -1px 0 #e3e9f2}
.pros-sharing summary{cursor:pointer;padding:18px 0;font-size:17px;font-weight:600;color:#10263f;list-style:none}
.pros-sharing summary::-webkit-details-marker{display:none}
.pros-sharing summary::after{content:"+";float:right;color:#385f91}
.pros-sharing details[open] summary::after{content:"–"}
.pros-sharing details p{padding-bottom:4px;font-size:15px;line-height:1.7;color:#5f7289}
.previous-links{display:flex;flex-wrap:wrap;gap:10px;padding:12px 0 22px}
.previous-links a{display:inline-flex;align-items:center;min-height:40px;padding:8px 16px;border-radius:50px;background:#eef3fa;color:#142d47;font-size:14px;font-weight:600}

@media (max-width:1100px){.legal-section{grid-template-columns:minmax(0,1fr) 210px;column-gap:40px}}
@media (max-width:900px){.legal-section{grid-template-columns:minmax(0,1fr);row-gap:32px;padding-top:56px}.page-toc{grid-column:1;grid-row:1;position:static}.legal-wrap{grid-column:1;grid-row:2}.page-toc ol{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.page-toc a{padding:7px 13px;border-radius:50px;background:#eef3fa;font-size:12px;font-weight:580;color:#385f91}.page-toc a:hover{background:#dfe8f5;color:#10263f}}
@media (max-width:760px){.film-footer nav{flex-wrap:wrap;gap:10px 20px}.legal-section{padding-top:44px}.legal-wrap{font-size:16px;line-height:1.7}.legal-wrap h2{margin-top:40px}.legal-wrap .callout{padding:16px 18px 16px 22px}.pros-page .page-hero{padding-bottom:96px}.pros-grid{grid-template-columns:minmax(0,1fr);margin-top:-44px}.pros-card{padding:26px 22px 28px}.pros-roles li{width:100%}}
