/* Alternate art direction based on the user's Canva director portfolio. */
:root{--green:#355361;--copper:#536674;--ink:#252727;--muted:#62696c;--line:#ccd0d1;--serif:'Aileron',Arial,sans-serif}
body.cinematic{background:#eef0f1;color:var(--ink)}
body.cinematic::before{display:none}
.cinematic .shell{width:min(1200px,calc(100% - 96px))}
.cinematic header{padding:25px 0;display:flex;flex-wrap:nowrap;align-items:center;margin:auto;gap:25px}
.wordmark{font-size:12px;font-weight:700;letter-spacing:.17em;text-decoration:none;white-space:nowrap}
.cinematic header nav{gap:22px;margin:0}
.cinematic header nav button,.cinematic header nav a,.cinematic header nav a:last-child{border:0;border-radius:0;background:transparent;color:var(--ink);padding:5px 0;font-size:12px;font-weight:400}
.cinematic header nav a:last-child{border-bottom:1px solid var(--ink)}
.cinema-hero{background:radial-gradient(ellipse at 28% 100%,#21495e 0,#0c283b 48%,#041925 100%);color:#f1f3f5;overflow:hidden}
.cinema-inner{position:relative;display:grid;grid-template-columns:1fr 1fr;min-height:640px;align-items:stretch}
.cinema-portrait{position:relative;align-self:end;height:610px;overflow:hidden}
.cinema-portrait img{height:100%;width:auto;max-width:none;aspect-ratio:860/1278;margin:0 auto;object-fit:fill;mask-image:url('assets/portrait-mask.png');mask-mode:luminance;mask-size:100% 100%;filter:grayscale(1);opacity:.93}
.cinema-title{position:relative;align-self:stretch;margin:42px 0 36px;padding:32px 0 28px 40px;border:1px solid #e0ebf326;border-right:0;display:flex;flex-direction:column;justify-content:center}
.cinema-title .eyebrow{color:#bdced7;font-size:10px;letter-spacing:.16em;margin-bottom:25px}
.cinema-title h1{font:400 clamp(48px,6.6vw,92px)/.99 'Aileron',Arial,sans-serif;letter-spacing:-.065em;color:#f2f4f5}
.cinema-title h1 strong{font-weight:700}
.cinema-role{font:400 clamp(18px,2vw,28px)/1.3 'Aileron',Arial,sans-serif;margin-top:22px;color:#bdced7;letter-spacing:-.035em}
.cinema-scroll{margin-top:auto;padding-top:55px;display:flex;justify-content:space-between;align-items:center;color:#e1e7ec;text-decoration:none;font-size:10px;letter-spacing:.13em}
.cinema-scroll>span:last-child{font-size:50px;line-height:1;margin-right:22px;font-weight:400}
.cinematic h2{font-family:'Aileron',Arial,sans-serif;font-weight:700;font-size:clamp(30px,3.5vw,48px);line-height:1.08;letter-spacing:-.05em}
.cinematic .eyebrow{font-size:10px;letter-spacing:.17em;color:#687379;margin-bottom:18px}
.perspective{display:grid;grid-template-columns:.85fr 1.15fr;gap:85px;padding:85px 0}
.perspective-heading h2{max-width:390px}
.perspective .arc-statements{display:grid;grid-template-columns:1fr 1fr;gap:35px 30px;margin:0;padding:0;min-height:0}
.perspective .arc-statements::before{display:none}
.perspective .arc-statement{display:block;grid-area:auto;margin:0;padding:18px 0 0;border-top:1px solid #9ca7ac;text-align:left;align-self:start}
.perspective .arc-statement::before{display:none}
.perspective .arc-statement h2{font:700 17px/1.3 'Aileron',Arial,sans-serif;letter-spacing:-.02em;margin-bottom:12px;color:var(--ink)}
.perspective .arc-statement p{font:400 14px/1.65 'Aileron',Arial,sans-serif;color:#62696c}
.cinematic .profile-depth{display:block;padding:0}
.cinematic .profile-depth .personality{padding:60px 0 75px;border-top:1px solid #c6ced1}
.cinematic .personality h2,.cinematic .capabilities h2{font:700 clamp(30px,3.5vw,48px)/1.08 'Aileron',Arial,sans-serif;letter-spacing:-.05em;color:var(--ink);margin-bottom:35px}
.cinematic .trait-list{max-width:850px}
.cinematic .atlas,.cinematic .science{position:relative;padding:75px 0;color:#eef0f1;background:#262828;box-shadow:0 0 0 100vmax #262828;clip-path:inset(0 -100vmax)}
.cinematic .atlas .eyebrow,.cinematic .science .eyebrow{color:#adb8be}
.cinematic .story-caption,.cinematic .author-note{color:#b9c1c5;font-size:13px;line-height:1.6;margin-top:16px}
.cinematic .science{padding-top:30px;padding-bottom:85px}
.cinematic .science .section-heading{padding-top:40px;border-top:1px solid #535959}
.cinematic .section-heading{margin-bottom:36px}
.cinematic .story-tools{gap:28px}
.cinematic .story-tool,.cinematic .paper-image{border-radius:8px;border:1px solid #616767;box-shadow:0 8px 20px #0002}
.cinematic .paper-card:hover .paper-image,.cinematic .story-tool:hover{box-shadow:0 12px 28px #0005}
.cinematic .profile-depth .capabilities{padding:85px 0}
.cinematic .skill-bubbles{display:grid;grid-template-columns:repeat(4,1fr);gap:30px}
.cinematic .skill-bubbles li{display:flex;align-items:center;gap:15px;text-align:left;font-size:13px;line-height:1.5;max-width:none}
.cinematic .skill-dot{width:54px;height:54px;min-width:54px;background:#dde2e4;color:#3f5059;box-shadow:none}
.cinematic .skill-dot svg{width:29px;height:29px}
.cinematic .life{padding:65px 0 85px;border-top:1px solid #c6ced1}
.cinematic .photos img{border-radius:0;filter:grayscale(1);transition:filter .3s;height:265px}
.cinematic .photos a:hover img{filter:none}
.cinematic .photos figcaption{font-size:13px}
.cinematic footer{padding:50px 0 65px;border-top:1px solid #c6ced1;gap:25px;flex-wrap:wrap}
.cinematic footer p{font-size:clamp(28px,3.5vw,46px);font-weight:700;letter-spacing:-.045em}
.cinematic footer a{font-size:13px;text-decoration:none}
.cinematic footer .compare-link{margin-left:auto;color:#62696c;font-size:11px}
.cinematic dialog{border-radius:10px;background:#eef0f1}
.cinematic .dialog-top{background:#eef0f1}
@media(max-width:1000px){.cinematic .shell{width:calc(100% - 56px)}.cinematic header nav{gap:14px}.cinema-inner{min-height:540px}.cinema-portrait{height:500px}.cinema-title{padding-left:26px}.perspective{gap:45px}.cinematic .skill-bubbles{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){.cinematic .shell{width:calc(100% - 40px)}.cinematic header{display:block;padding:20px 0}.cinematic header nav{margin-top:16px;justify-content:space-between;gap:12px;flex-wrap:wrap}.cinema-inner{display:block;min-height:640px}.cinema-title{position:relative;margin:0;padding:35px 0 0;border:0;min-height:230px;z-index:1}.cinema-title h1{font-size:58px}.cinema-role{font-size:19px;margin-top:14px}.cinema-title .eyebrow{margin-bottom:18px}.cinema-scroll{position:absolute;top:520px;left:0;right:0;padding:0}.cinema-portrait{position:absolute;bottom:0;right:-20px;width:320px;height:430px;opacity:.8}.perspective{display:block;padding:50px 0}.perspective-heading{margin-bottom:30px}.perspective .arc-statements{gap:25px 22px}.cinematic .atlas,.cinematic .science{padding:50px 0}.cinematic .science{padding-top:0}.cinematic .profile-depth .capabilities{padding:50px 0}.cinematic .skill-bubbles{grid-template-columns:1fr 1fr;gap:24px 18px}.cinematic .skill-bubbles li{flex-direction:column;align-items:flex-start;font-size:12px}.cinematic .photos img{height:auto;max-height:none}.cinematic footer .compare-link{margin-left:0}.cinematic footer{align-items:flex-start;flex-direction:column}.cinematic .life{padding:50px 0}}
