@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800;900&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{--black:#0a0e11;--ink:#12171b;--gold:#d4ab63;--pale:#f5e9ce;--paper:#e9e2d5;--red:#b3352a;--body:'DM Sans',Arial,sans-serif;--head:'Barlow Condensed',Impact,'Arial Narrow',sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--black);color:var(--pale);font-family:var(--body)}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}figure,h1,h2,h3,p{margin:0}button{font:inherit}.skip{position:absolute;left:10px;top:-100px;z-index:99;background:white;color:black;padding:15px}.skip:focus{top:10px}.topbar{height:82px;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:12px clamp(20px,4.5vw,80px);background:#080c0e;border-bottom:1px solid #8f754a66}.brand{display:flex;flex-direction:column;line-height:.9}.brand b{font:900 31px var(--head);letter-spacing:-.04em;color:#f4e4c3}.brand b span{color:var(--gold)}.brand small{font:700 8px var(--body);letter-spacing:.1em;margin-top:9px}.topbar nav{display:flex;gap:32px}.topbar nav a{font:700 10px var(--body);letter-spacing:.12em}.topbar nav a:hover{color:var(--gold)}.hero{background:#090d10;position:relative;overflow:hidden}.hero-geometry{position:absolute;inset:0;pointer-events:none}.hero-geometry i{display:block;position:absolute;border:1px solid #c6a35e16;border-radius:50%;aspect-ratio:1;width:min(900px,70vw);right:-12%;top:-39%}.hero-geometry i:nth-child(2){width:min(650px,60vw);right:-4%;top:-25%}.hero-geometry i:nth-child(3){width:min(410px,40vw);right:4%;top:-6%}.hero-inner{max-width:1800px;margin:auto;padding:48px clamp(20px,5vw,85px) 50px;position:relative}.eyebrow,.kicker,.micro,.hero-bottom,.hero-banner figcaption,.screen-head,.screen-foot,.factgrid span,.frame-grid figcaption,.credit,.minor{font:700 10px/1.5 var(--body);letter-spacing:.12em}.eyebrow{color:#cabd9a}.eyebrow span{color:var(--gold)}.eyebrow i{font-style:normal;color:#8d7253;margin:0 5px}.hero-heading{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(180px,.45fr);align-items:end;gap:15px;margin:42px 0 30px}.hero .micro{color:var(--gold);margin-bottom:10px}.hero h1{font:900 clamp(72px,11.3vw,210px)/.76 var(--head);letter-spacing:-.055em;color:var(--pale)}.hero h1 em{font-style:normal;color:var(--gold)}.hero-right{text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:23px}.circle{width:118px;height:118px;border:5px solid #ccad6e;border-radius:50%;display:flex;align-items:center;justify-content:center;position:relative;font:italic 900 77px Georgia,serif;color:var(--gold)}.circle span{position:absolute;font:italic 800 58px Georgia,serif;color:#e6e6e6;right:19px;top:30px}.hero-right p{font:700 11px/1.5 var(--body);letter-spacing:.12em;color:#c6b28b}.hero-banner{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:12px;background:#14191e;padding:13px;border:1px solid #a8894f88;box-shadow:18px 18px 0 #050708}.hero-banner figure{position:relative;min-height:220px;overflow:hidden;background:#080b0e}.hero-banner img{width:100%;height:100%;max-height:360px;object-fit:cover;filter:contrast(1.1);transform:scale(1.015)}.hero-banner figcaption{position:absolute;bottom:15px;left:20px;background:#0b1015dd;padding:8px 13px;color:#e3c690;font-size:9px}.hero-mark{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-7deg);background:#d4a760;color:#101319;padding:19px 20px;text-align:center;font:900 46px/.78 var(--head);box-shadow:7px 7px 0 #000a;border:3px solid #14171a;white-space:nowrap}.hero-mark span{display:inline-block;font:800 10px var(--body);letter-spacing:.1em}.hero-bottom{margin:48px 0 0;display:flex;align-items:end;justify-content:space-between;gap:20px;color:#c2b69d}.hero-bottom a{color:var(--gold);font-size:11px}.hero-bottom a strong{font-size:24px;margin-left:14px}.track{background:#d2a456;color:#0d1519;padding:14px 0;white-space:nowrap;overflow:hidden;font:900 27px var(--head);letter-spacing:.09em}.track div{width:max-content;animation:scroll 24s linear infinite}.track span{padding:0 20px}@keyframes scroll{to{transform:translateX(-33.3%)}}.pad{padding:clamp(67px,7vw,120px) clamp(22px,5vw,88px)}.kicker{display:flex;justify-content:space-between;gap:15px;color:var(--gold);padding-bottom:19px;border-bottom:1px solid #a58a6063;margin-bottom:58px}.kicker span{color:#baa88a;text-align:right}.intro{background:var(--paper);color:#10171c}.intro .kicker{color:#7b602f;border-color:#a99d86}.intro .kicker span{color:#6d706c}.introgrid{display:grid;grid-template-columns:1.08fr 1fr;gap:7vw;max-width:1600px;margin:auto}.intro h2,.films h2,.design h2,.archive h2,.closing h2{font:900 clamp(73px,9.7vw,175px)/.79 var(--head);letter-spacing:-.045em}.intro h2 em{color:#9f6825;font-style:normal}.introcopy{padding-top:10px}.introcopy .lede{font:700 clamp(22px,2.2vw,34px)/1.3 var(--body);letter-spacing:-.045em;margin:0 0 35px}.introcopy>p:not(.lede){max-width:680px;font:16px/1.8 var(--body);margin-bottom:20px;color:#394247}.factgrid{margin-top:35px;display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #aab0ae;border-left:1px solid #aab0ae}.factgrid div{padding:16px;border-bottom:1px solid #aab0ae;border-right:1px solid #aab0ae}.factgrid span{display:block;color:#8d753f}.factgrid strong{display:block;font:700 15px var(--body);margin-top:5px}.films{background:#0a0d11}.films-head{display:grid;grid-template-columns:1.15fr .75fr;align-items:end;gap:5vw;margin-bottom:60px}.films h2 em{font-style:normal;color:var(--gold)}.films-head p{max-width:400px;font:18px/1.6 var(--body);color:#cecece;padding-bottom:9px}.screen{max-width:1500px;margin:0 auto 58px;background:#141a1f;border:1px solid #ab875348;box-shadow:12px 12px 0 #000a}.screen-head{background:#1c2328;border-bottom:1px solid #625541;display:flex;justify-content:space-between;align-items:center;gap:15px;padding:14px 23px;color:#e7ca8e}.red-dot{display:inline-block;width:9px;height:9px;background:#d34d34;border-radius:50%;margin-right:8px;box-shadow:0 0 8px #d34d34aa}.screen-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:0;align-items:center}.screen-film{padding:clamp(12px,2.5vw,40px);min-width:0}.screen video{width:100%;max-height:530px;aspect-ratio:4/3;object-fit:contain;display:block;background:#050505;border:4px solid #b18e53;box-shadow:0 0 0 10px #050608}.screen-text{padding:45px clamp(20px,3vw,65px);align-self:stretch;display:flex;flex-direction:column;justify-content:center;background:#161f26}.screen-text .number{font:900 120px/.7 var(--head);color:#d5ae6544;margin-bottom:18px}.screen h3{font:900 clamp(60px,6vw,110px)/.78 var(--head);letter-spacing:-.05em;color:#f2e9d8}.screen h3 span{color:var(--gold)}.screen-text p{font:16px/1.7 var(--body);color:#d4d0c9;max-width:370px;margin:24px 0 30px}.screen-foot{color:var(--gold);font-size:9px;border-top:1px solid #a38d5d66;padding-top:16px}.second .screen-grid{grid-template-columns:1.25fr .75fr}.design{background:#e5d6b9;color:#121719}.design .kicker{color:#6e5428;border-color:#9d8b6a}.design .kicker span{color:#6a5f4c}.design-head{display:grid;grid-template-columns:1.2fr .65fr;gap:6vw;align-items:end;margin-bottom:50px}.design h2 em{font-style:normal;color:#8c581e}.design-head p{font:19px/1.7 var(--body);padding-bottom:5px}.frame-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.frame-grid figure{background:#080c0e;padding:7px 7px 12px;box-shadow:8px 9px 0 #9e906f}.frame-grid img{width:100%;aspect-ratio:4/3;object-fit:cover}.frame-grid figcaption{color:#edd6a3;padding:10px 7px 0;font-size:8px}.design-notes{display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid #887658;margin-top:65px}.design-notes p{padding:22px;border-right:1px solid #887658}.design-notes p:last-child{border:0}.design-notes b{display:block;font:900 24px var(--head);letter-spacing:.07em;margin-bottom:10px;color:#875c27}.design-notes span{font:15px/1.65 var(--body)}.archive{background:#17222a}.archive-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:6vw;align-items:center}.archive h2 em{font-style:normal;color:var(--gold)}.archive-grid p{max-width:540px;font:17px/1.65 var(--body);color:#d6d5d1;margin:30px 0 20px}.archive-grid .minor{font-size:11px;line-height:1.7;color:#a9a9a4}.btn-outline{display:inline-block;border:1px solid var(--gold);padding:17px 18px;font:800 11px var(--body);color:var(--gold);margin-top:15px;letter-spacing:.08em}.btn-outline:hover{background:var(--gold);color:var(--black)}.archive-art{position:relative;transform:rotate(-2deg);box-shadow:13px 15px 0 #070b0f;border:7px solid #d5b16e}.archive-art img{width:100%}.archive-art span{position:absolute;bottom:0;left:0;background:#0a1012d9;padding:12px;font:800 9px/1.6 var(--body);letter-spacing:.1em}.closing{background:#080d12;overflow:hidden}.closing-grid{display:grid;grid-template-columns:1.1fr .62fr;gap:6vw;align-items:end}.closing h2 em{font-style:normal;color:var(--gold)}.closing-grid>div p:not(.credit){font:19px/1.7 var(--body);margin-bottom:32px;color:#e2d8c5}.closing .credit{color:#ae966c;font-size:9px;border-top:1px solid #93794c;padding-top:20px;margin:20px 0 32px}.closing a{display:inline-flex;padding:12px 0;border-bottom:1px solid #ae966c;margin-right:20px;font:800 11px var(--body);color:#ddc497}footer{display:flex;justify-content:space-between;gap:25px;padding:20px clamp(22px,5vw,88px);border-top:1px solid #776341;background:#0b1015;font:800 9px var(--body);letter-spacing:.08em;color:#c1aa7c}@media(max-width:1000px){.hero h1{font-size:clamp(70px,11vw,132px)}.introgrid,.films-head,.design-head,.archive-grid,.closing-grid{grid-template-columns:1fr}.intro h2,.films h2,.design h2,.archive h2,.closing h2{font-size:clamp(76px,11vw,145px)}.hero-right .circle{width:90px;height:90px;font-size:59px}.hero-right .circle span{font-size:45px;right:16px;top:23px}.screen h3{font-size:clamp(60px,8vw,94px)}.archive-art{max-width:800px}}
@media(max-width:700px){.topbar{height:auto;min-height:74px}.topbar nav{gap:14px}.topbar nav a{font-size:9px}.topbar nav a:last-child{display:none}.hero-inner{padding-top:38px}.hero-heading{grid-template-columns:1fr;margin-top:42px}.hero h1{font-size:clamp(58px,13.5vw,99px)}.hero-right{display:none}.hero-banner{gap:5px;padding:5px}.hero-banner figure{min-height:125px}.hero-banner figcaption{font-size:7px;left:6px;bottom:6px;padding:6px}.hero-mark{font-size:28px;padding:9px;box-shadow:3px 4px 0 #000a}.hero-mark span{font-size:6px}.hero-bottom{margin-top:25px;align-items:center}.hero-bottom p{font-size:8px}.hero-bottom a{font-size:9px}.pad{padding:65px 21px}.kicker{margin-bottom:35px;font-size:9px}.kicker span{font-size:8px;max-width:160px}.intro h2,.films h2,.design h2,.archive h2,.closing h2{font-size:clamp(70px,16vw,104px)}.introcopy .lede{font-size:23px}.introcopy>p:not(.lede){font-size:15px}.films-head{gap:20px}.films-head p{font-size:16px}.screen{margin-bottom:40px;box-shadow:5px 6px 0 #000a}.screen-head{font-size:8px;padding:9px 11px;gap:8px}.screen-grid,.second .screen-grid{grid-template-columns:1fr}.screen-film{padding:16px}.screen video{box-shadow:0 0 0 3px #050608;border-width:2px;max-height:none}.screen-text{padding:18px 25px 35px}.screen-text .number{font-size:75px}.screen h3{font-size:clamp(60px,13vw,85px)}.screen-text p{margin:15px 0 23px;font-size:15px}.frame-grid{grid-template-columns:1fr 1fr;gap:16px}.design-notes{grid-template-columns:1fr}.design-notes p{border-right:0;border-bottom:1px solid #887658}.design-notes p:last-child{border-bottom:0}.archive-grid{gap:45px}.archive-art{transform:rotate(-1deg)}.closing-grid{gap:35px}.closing-grid a{display:block;width:max-content;margin:0 0 20px}.factgrid strong{font-size:12px}.topbar .brand b{font-size:26px}}@media(max-width:390px){.hero h1{font-size:clamp(49px,12.8vw,65px)}.hero-banner figcaption{font-size:6px}.hero-mark{font-size:24px}.factgrid{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.track div{animation:none}}/* FINAL MOBILE PROOF: long service names should never force the film grid beyond the viewport. */
.screen-grid > *,.screen-grid,.screen{min-width:0;max-width:100%}
.screen h3{overflow-wrap:anywhere}
@media(max-width:700px){.screen h3{font-size:clamp(49px,11.2vw,70px)}.screen-text{min-width:0}.screen-film{min-width:0}}

/* Keep the product name whole at every size. */
.screen.first h3 .longword{display:block;font-size:.58em;line-height:1.08;color:var(--gold);white-space:nowrap;letter-spacing:-.045em}

.circle{border:0;background:transparent}.circle img{width:100%;height:100%;object-fit:contain;filter:contrast(1.15)}


/* V11 — Progressive Bank ORIGINAL concept sheet: photographed artwork, unaltered */
.origins{background:#cbb99d;color:#11191d;position:relative;overflow:hidden}
.origins:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.13;background:repeating-linear-gradient(0deg,transparent 0 5px,#382d1b 6px 6.5px)}
.origins>*{position:relative}
.origins .kicker{color:#735425;border-color:#675a47}.origins .kicker span{color:#594b35}
.origins-head{display:grid;grid-template-columns:1fr .71fr;gap:clamp(24px,7vw,110px);align-items:end;max-width:1550px;margin:0 auto 53px}
.origins-label{font:800 10px/1.5 var(--body);letter-spacing:.17em;color:#79582d;margin-bottom:19px}
.origins h2{font:900 clamp(78px,9.5vw,164px)/.79 var(--head);letter-spacing:-.047em}
.origins h2 em{font-style:normal;color:#8f5e26}
.origins-copy{max-width:610px}
.origins-copy .origins-lede{font:700 clamp(22px,2.2vw,32px)/1.25 var(--body);margin-bottom:22px;letter-spacing:-.045em}
.origins-copy p:not(.origins-lede){font:16px/1.68 var(--body);color:#2e3434;margin-bottom:15px}
.origins-jump{display:inline-flex;align-items:center;gap:12px;border-bottom:2px solid #875b23;padding:10px 0;margin-top:7px;font:800 10px/1.4 var(--body);letter-spacing:.11em;color:#412e1d}
.origins-jump span{font-size:18px}
.origins-sheet{max-width:1540px;margin:0 auto;background:#eee7d8;border:1px solid #7b694f;padding:clamp(9px,2vw,28px);box-shadow:17px 19px 0 #7b633e6b}
.origins-sheet>a{display:block;background:#f6f1e7;outline-offset:5px}
.origins-sheet>a:focus-visible{outline:3px solid #4c321e}
.origins-sheet img{width:100%;height:auto;display:block;filter:contrast(1.02)}
.origins-sheet figcaption{display:flex;justify-content:space-between;gap:18px;padding:18px 2px 0;color:#51442f;font:800 10px/1.5 var(--body);letter-spacing:.11em}
.origins-foot{max-width:1540px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 22px;margin:43px auto 0;padding-top:18px;border-top:1px solid #887357;color:#59442a;font:800 10px/1.5 var(--body);letter-spacing:.09em}
.intro .intro-process{font-weight:700!important;color:#8b622c!important;margin:22px 0 7px!important}
@media(max-width:1000px){.origins-head{grid-template-columns:1fr}.origins h2{font-size:clamp(78px,12vw,138px)}.origins-copy{max-width:780px}}
@media(max-width:700px){.origins h2{font-size:clamp(69px,17vw,112px)}.origins-head{gap:27px;margin-bottom:33px}.origins-copy .origins-lede{font-size:23px}.origins-copy p:not(.origins-lede){font-size:15px}.origins-sheet{box-shadow:7px 9px 0 #7b633e6b}.origins-sheet figcaption{font-size:8px;gap:8px;letter-spacing:.05em}.origins-foot{margin-top:35px;justify-content:flex-start;font-size:9px;gap:12px 16px}}
