/* Delinquent Films site, v2 (2026-10-01): DF's evidence-board identity.
   Fonts: Poppins Black (OFL) for titles; Not My Type (typewriter) and Peter Marker (marker) are
   Envato Elements fonts embedded as web fonts under a paid subscription (allowed as long as the
   site never lets visitors type with them or download them, so form fields use Inter). */
@font-face{font-family:"DF Title";src:url(fonts/poppins-black.woff2) format("woff2");font-weight:900;font-display:swap;}
@font-face{font-family:"DF Type";src:url(fonts/not-my-type.woff2) format("woff2");font-display:swap;}
@font-face{font-family:"DF Marker";src:url(fonts/peter-marker.woff2) format("woff2");font-display:swap;}

:root{
  --bg:#0e0d10; --bg2:#17151a; --line:#2b2830;
  --ink:#f3efe6; --body:#cfc9bf; --muted:#918b84;
  --red:#e5484d; --red-deep:#b8323a;
  --paper:#ebe5d8; --manila:#e0d0aa; --paper-ink:#1d1a16; --paper-mute:#544d43;
  --sticky-ink:#2b2410;
  --bar:#1d2329; /* the full-color D logo's own background, so its faded edge disappears into the header */
  --max:1360px; --pad:clamp(16px,4vw,56px);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;overflow-x:clip;}
body{margin:0;background:var(--bg);color:var(--body);font-family:"Inter",-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;font-size:16.5px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
body::before{content:"";position:fixed;inset:0;background:url(img/grain.png);opacity:.5;pointer-events:none;z-index:60;mix-blend-mode:screen;}
img{max-width:100%;display:block;}
a{color:var(--ink);}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--pad);}

/* type system */
.title{font-family:"DF Title","Inter",sans-serif;font-weight:900;text-transform:uppercase;color:var(--ink);letter-spacing:-.005em;line-height:.95;margin:0;}
.type{font-family:"DF Type","Courier New",monospace;}
.marker{font-family:"DF Marker","Comic Sans MS",cursive;}
.ink{} /* 2026-10-02: no worn-ink texture on any title, kept as a hook (the rubber stamps keep their ink) */
.label{font-size:15px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0 0 16px;}
.slash{color:var(--red);margin:0 6px;}
.big{font-size:21px;color:var(--ink);line-height:1.45;margin:0 0 14px;font-weight:500;}

/* buttons */
.btn{display:inline-block;font-family:"DF Title",sans-serif;font-weight:900;text-transform:uppercase;letter-spacing:.06em;font-size:14px;text-decoration:none;border-radius:3px;padding:13px 20px 12px;border:2px solid transparent;cursor:pointer;transition:transform .15s ease,background .15s ease;}
.btn:hover{transform:translateY(-1px);}
.btn-red{background:var(--red);color:#fff;}
.btn-red:hover{background:var(--red-deep);}
.btn-red[disabled]{opacity:.5;cursor:not-allowed;transform:none;}
.btn-ghost{border-color:#4a4550;color:var(--ink);background:transparent;}
.btn-ghost:hover{border-color:var(--ink);}
.btn-light{background:var(--ink);color:var(--paper-ink);}
.btn-sm{padding:8px 13px 7px;font-size:12px;}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px;}

/* draft-only: sticky notes */
.draft-bar{background:#f2d264;color:var(--sticky-ink);font-size:14px;text-align:center;padding:8px 16px;position:relative;z-index:70;}
.draft-bar .type{font-size:14px;margin-right:8px;}
.draft-bar a{color:var(--sticky-ink);font-weight:600;}
.sticky{position:relative;display:block;max-width:380px;margin:26px 0 0;padding:16px 18px 14px;background:linear-gradient(170deg,#f6dc78,#efcb55);color:var(--sticky-ink);font-size:14.5px;line-height:1.5;transform:rotate(var(--r,0deg));box-shadow:0 10px 22px rgba(0,0,0,.45);}
.sticky a{color:#7a1a1d;font-weight:600;}
.sticky-label{display:block;font-family:"DF Marker",cursive;font-size:21px;line-height:1.1;color:#9b2124;margin-bottom:6px;}

/* paper, tape, pins */
.paper{background:var(--paper) url(img/paper.jpg);color:var(--paper-ink);box-shadow:0 18px 40px rgba(0,0,0,.5);}
.tape{position:absolute;top:-13px;left:50%;width:118px;height:28px;margin-left:-59px;background:rgba(232,222,190,.62);transform:rotate(-3deg);clip-path:polygon(2% 8%, 6% 0%, 10% 10%, 95% 4%, 100% 14%, 97% 52%, 100% 90%, 93% 100%, 6% 94%, 0% 100%, 3% 55%, 0% 18%);z-index:3;}
.pin{position:absolute;top:-8px;left:50%;width:16px;height:16px;margin-left:-8px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ff8a8d,#d42a30 55%,#7a1013);box-shadow:0 3px 6px rgba(0,0,0,.6);z-index:5;}

/* header */
.site-header{position:sticky;top:0;z-index:40;background:var(--bar);border-bottom:1px solid #2c333a;}
.brand img{width:52px;height:52px;margin:-6px -4px -6px -8px;}
.nav{display:flex;align-items:center;justify-content:space-between;height:66px;gap:16px;}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;}
.brand span{font-family:"DF Title",sans-serif;font-weight:900;text-transform:uppercase;letter-spacing:.04em;font-size:18px;color:var(--ink);}
.nav nav{display:flex;align-items:center;gap:28px;}
.nav nav a:not(.btn){font-family:"DF Type",monospace;text-decoration:none;font-size:16px;color:var(--body);text-transform:uppercase;letter-spacing:.04em;}
.nav nav a:not(.btn):hover{color:var(--red);}

/* torn edges */
.torn-bottom{position:relative;}
.torn-bottom::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:22px;background:var(--bg);clip-path:polygon(0% 100%, 0.0% 9px, 2.38% 10px, 4.76% 14px, 7.14% 9px, 9.52% 9px, 11.9% 10px, 14.29% 11px, 16.67% 5px, 19.05% 4px, 21.43% 14px, 23.81% 10px, 26.19% 9px, 28.57% 12px, 30.95% 11px, 33.33% 14px, 35.71% 4px, 38.1% 3px, 40.48% 9px, 42.86% 6px, 45.24% 4px, 47.62% 3px, 50.0% 10px, 52.38% 14px, 54.76% 13px, 57.14% 12px, 59.52% 2px, 61.9% 11px, 64.29% 8px, 66.67% 9px, 69.05% 12px, 71.43% 13px, 73.81% 11px, 76.19% 12px, 78.57% 4px, 80.95% 11px, 83.33% 2px, 85.71% 10px, 88.1% 3px, 90.48% 2px, 92.86% 2px, 95.24% 5px, 97.62% 5px, 100.0% 11px, 100% 100%);z-index:2;}
.torn-top{position:relative;}
.torn-top::before{content:"";position:absolute;left:0;right:0;top:-21px;height:22px;background:var(--bg2);clip-path:polygon(0% 100%, 0.0% 9px, 2.38% 10px, 4.76% 14px, 7.14% 9px, 9.52% 9px, 11.9% 10px, 14.29% 11px, 16.67% 5px, 19.05% 4px, 21.43% 14px, 23.81% 10px, 26.19% 9px, 28.57% 12px, 30.95% 11px, 33.33% 14px, 35.71% 4px, 38.1% 3px, 40.48% 9px, 42.86% 6px, 45.24% 4px, 47.62% 3px, 50.0% 10px, 52.38% 14px, 54.76% 13px, 57.14% 12px, 59.52% 2px, 61.9% 11px, 64.29% 8px, 66.67% 9px, 69.05% 12px, 71.43% 13px, 73.81% 11px, 76.19% 12px, 78.57% 4px, 80.95% 11px, 83.33% 2px, 85.71% 10px, 88.1% 3px, 90.48% 2px, 92.86% 2px, 95.24% 5px, 97.62% 5px, 100.0% 11px, 100% 100%);z-index:2;}
.torn-top-paper{clip-path:polygon(0.0% 0px, 2.78% 7px, 5.56% 5px, 8.33% 7px, 11.11% 9px, 13.89% 3px, 16.67% 8px, 19.44% 3px, 22.22% 10px, 25.0% 4px, 27.78% 7px, 30.56% 0px, 33.33% 10px, 36.11% 1px, 38.89% 7px, 41.67% 10px, 44.44% 4px, 47.22% 6px, 50.0% 8px, 52.78% 1px, 55.56% 4px, 58.33% 5px, 61.11% 3px, 63.89% 8px, 66.67% 4px, 69.44% 0px, 72.22% 1px, 75.0% 9px, 77.78% 1px, 80.56% 6px, 83.33% 1px, 86.11% 4px, 88.89% 6px, 91.67% 1px, 94.44% 0px, 97.22% 10px, 100.0% 0px, 100% 100%, 0% 100%);}

/* hero */
.hero{background:radial-gradient(900px 520px at 78% 30%,rgba(229,72,77,.13),transparent 62%),linear-gradient(180deg,#141217,var(--bg));padding:clamp(56px,7vw,96px) 0 clamp(56px,6vw,84px);overflow:hidden;}
.hero-grid{display:grid;grid-template-columns:1.18fr 1fr;gap:clamp(24px,4vw,72px);align-items:center;}
.hero h1{font-size:clamp(50px,7.6vw,118px);}
.hero .hl{color:var(--red);}
.hero .lead{font-size:clamp(18px,1.7vw,22px);max-width:38ch;margin:28px 0 0;color:var(--body);}
.board{position:relative;aspect-ratio:5/6;width:100%;max-width:600px;justify-self:end;}
.board .tape{display:none;}
.snap{position:absolute;margin:0;background:#f1ede4;padding:10px 10px 36px;transform:rotate(var(--r));box-shadow:0 18px 36px rgba(0,0,0,.6);}
.snap img{width:100%;aspect-ratio:16/9;object-fit:cover;filter:saturate(.85) contrast(1.05);}
.snap figcaption{position:absolute;left:12px;right:12px;bottom:9px;font-size:13.5px;color:#2a2620;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.s1{left:33%;top:3%;width:64%;--r:4deg;z-index:2;}
.s2{left:2%;top:36%;width:52%;--r:-5deg;z-index:3;}
.note{position:absolute;left:50%;top:62%;width:44%;padding:22px 20px 18px;transform:rotate(3deg);z-index:3;}
.note p{margin:0;font-size:clamp(14px,1.35vw,18px);line-height:1.55;}
.circled{position:relative;white-space:nowrap;}
.circled::after{content:"";position:absolute;inset:-6px -10px -4px -8px;border:2.5px solid #c9262c;border-radius:50% 46% 52% 48%;transform:rotate(-3deg);}
.scrawl{position:absolute;left:5%;top:83%;margin:0;color:var(--red);font-size:clamp(22px,2.4vw,32px);transform:rotate(-7deg);z-index:4;}
.scrawl::after{content:" \2192";}

/* sections */
.section{padding:clamp(72px,9vw,120px) 0;position:relative;}
.section-alt{background:var(--bg2);}
.sec-head{margin-bottom:clamp(36px,5vw,64px);}
.sec-head h2{font-size:clamp(44px,6vw,88px);}

/* films */
.exhibit{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(28px,4.5vw,72px);align-items:center;margin-bottom:clamp(72px,9vw,120px);}
.exhibit.flip{grid-template-columns:1fr 1.25fr;}
.exhibit.flip .exhibit-media{order:2;}
.exhibit-media{position:relative;background:#f1ede4;padding:12px;transform:rotate(var(--r));box-shadow:0 22px 44px rgba(0,0,0,.55);}
.poster{position:relative;display:block;width:100%;aspect-ratio:16/9;padding:0;border:0;overflow:hidden;background:#000;cursor:pointer;}
.poster img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.poster:hover img{transform:scale(1.03);}
.poster .play{position:absolute;left:50%;top:50%;width:80px;height:80px;margin:-40px 0 0 -40px;border-radius:50%;background:rgba(229,72,77,.94);box-shadow:0 6px 30px rgba(0,0,0,.6);}
.poster .play::after{content:"";position:absolute;left:32px;top:25px;border-style:solid;border-width:15px 0 15px 24px;border-color:transparent transparent transparent #fff;}
.poster-label{position:absolute;left:12px;top:12px;font-size:14px;color:#fff;background:rgba(0,0,0,.65);padding:3px 9px 2px;}
.poster iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.stamp{display:inline-block;font-family:"DF Type",monospace;font-size:17px;text-transform:uppercase;letter-spacing:.12em;color:var(--red);border:2.5px solid var(--red);padding:4px 12px 2px;transform:rotate(-4deg);margin:0 0 16px;-webkit-mask-image:url(img/ink-mask.png);mask-image:url(img/ink-mask.png);-webkit-mask-size:300px;mask-size:300px;}
.meta{font-size:15px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:0 0 10px;}
.exhibit h3{font-size:clamp(36px,4.4vw,64px);margin-bottom:12px;}
.film-sub{color:var(--ink);font-size:19px;margin:0 0 12px;font-weight:500;}
.exhibit-body p{margin:0 0 10px;}
.more{margin-top:20px!important;font-size:14.5px;display:flex;flex-wrap:wrap;gap:6px 18px;align-items:baseline;}
.more .type{color:var(--muted);text-transform:uppercase;font-size:14px;width:100%;}
.more a{color:var(--body);}

/* the case file */
.casefile{position:relative;max-width:1000px;margin-left:auto;margin-right:clamp(0px,3vw,48px);}
.folder-tab{display:inline-block;margin:0;background:var(--manila);color:var(--paper-ink);padding:9px 22px 6px;border-radius:10px 10px 0 0;font-size:16px;text-transform:uppercase;letter-spacing:.06em;}
.case-body{position:relative;background-color:var(--manila);background-blend-mode:multiply;padding:clamp(28px,4vw,52px) clamp(22px,4vw,56px);transform:rotate(-.6deg);}
.case-body .stamp-red{position:absolute;right:clamp(16px,4vw,48px);top:clamp(16px,3vw,36px);font-size:clamp(18px,2vw,26px);transform:rotate(9deg);color:#c42b30;border-color:#c42b30;}
.case-meta{font-size:15px;text-transform:uppercase;color:var(--paper-mute);margin:0 0 10px;}
.casefile h3{font-size:clamp(34px,4.6vw,66px);color:var(--paper-ink);margin-bottom:18px;max-width:12ch;}
.type-body{font-family:"DF Type",monospace;font-size:clamp(16px,1.4vw,19px);line-height:1.65;max-width:60ch;margin:0 0 16px;}
.case-ask{font-weight:600;margin:0;}
.case-ask a{color:#b3262b;}
.casefile .sticky{position:absolute;right:-10px;bottom:-60px;max-width:300px;}

/* about */
.about-grid{display:grid;grid-template-columns:.9fr 1.4fr;gap:clamp(32px,5vw,80px);align-items:start;}
.about-solo{grid-template-columns:1fr;}
.about-split{grid-template-columns:1fr 1fr;align-items:end;}
.about-copy h2{font-size:clamp(34px,4vw,58px);margin-bottom:0;text-wrap:balance;}
.about-copy p{max-width:46ch;text-wrap:pretty;}
.about-body p{font-size:clamp(17px,1.25vw,20.5px);max-width:52ch;}
.equal{color:var(--ink);font-size:17.5px;margin-top:18px;}
.equal .marker{display:block;color:var(--red);font-size:clamp(24px,2.4vw,32px);line-height:1.1;margin-bottom:6px;transform:rotate(-2deg);transform-origin:left;}

/* memo */
.memo-wrap{display:grid;grid-template-columns:.85fr 1.6fr;gap:clamp(28px,5vw,80px);align-items:start;}
.memo-head{grid-column:1;grid-row:1;}
.memo-kicker{font-family:"DF Marker",cursive;color:var(--red);font-size:clamp(24px,2.6vw,34px);line-height:1.15;margin:22px 0 0;transform:rotate(-3deg);}
.memo{grid-column:2;grid-row:1 / span 2;position:relative;padding:clamp(36px,4.5vw,64px) clamp(24px,4.5vw,64px) clamp(28px,4vw,48px);transform:rotate(.5deg);}
.memo-note{grid-column:1;grid-row:2;align-self:start;}
.memo-lines{border-bottom:2px dashed #b4a993;padding-bottom:14px;margin-bottom:26px;font-size:16px;}
.memo-lines p{margin:3px 0;}
.memo-lines b{color:#b3262b;font-weight:normal;}
.rules{list-style:none;margin:0;padding:0;display:grid;gap:22px;}
.rules li{display:grid;grid-template-columns:48px 1fr;gap:10px;align-items:start;}
.rules .num{font-size:22px;color:#b3262b;line-height:1.2;}
.rules h4{font-family:"Inter",sans-serif;font-size:19px;font-weight:700;margin:0 0 4px;color:var(--paper-ink);display:inline-block;}
.rules p{margin:0;color:var(--paper-mute);}
.underline-red{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 10' preserveAspectRatio='none'%3E%3Cpath d='M2 6 C 40 2, 80 9, 120 5 S 180 3, 198 6' fill='none' stroke='%23d42a30' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat left bottom / 100% 9px;padding-bottom:6px;}
.promise{margin-top:30px;padding-top:22px;border-top:2px dashed #b4a993;}
.promise-label{text-transform:uppercase;font-size:16px;color:#b3262b;margin:0 0 6px;}
.promise p{margin:0;font-size:17px;}
.sign{font-size:34px!important;color:#c42b30;transform:rotate(-4deg);margin-top:14px!important;display:inline-block;}

/* contact */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,80px);align-items:start;}
.contact-copy h2{font-size:clamp(44px,6vw,88px);margin-bottom:22px;}
.contact-grid > *{min-width:0;}
.email{font-size:clamp(15px,1.95vw,26px);color:var(--ink);margin:22px 0 0;overflow-wrap:anywhere;}
.contact-copy .form-note{color:#e2c160;font-size:14px;margin:8px 0 0;}
.card-form{padding:30px 30px 26px;display:flex;flex-direction:column;gap:14px;transform:rotate(var(--r));}
.form-title{margin:0 0 4px;font-size:18px;text-transform:uppercase;color:#b3262b;letter-spacing:.06em;}
.card-form label{display:flex;flex-direction:column;gap:5px;}
.card-form label .type{font-size:15px;color:var(--paper-mute);text-transform:uppercase;}
.card-form input,.card-form select,.card-form textarea{font:inherit;font-family:"Inter",sans-serif;font-size:15.5px;color:var(--paper-ink);background:#f7f3ea;border:1.5px solid #b4a993;border-radius:2px;padding:10px 12px;}
.card-form input:focus,.card-form select:focus,.card-form textarea:focus{outline:2px solid var(--red);outline-offset:1px;}
.form-note{font-size:13px;color:#8a6d12;margin:0;}
/* the live contact card (launch build): clickable address, send status, the hidden trap field for robots */
.email a{color:inherit;text-decoration:none;border-bottom:2px solid transparent;}
.email a:hover{border-bottom-color:var(--red);}
.card-form .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}
.turnstile-slot:empty{display:none;}
.form-status{font-size:14px;color:var(--paper-mute);min-height:1.5em;}
.form-status.ok{color:#23602f;font-weight:600;}
.form-status.err{color:#b3262b;font-weight:600;}
.form-status a{color:#b3262b;font-weight:600;}

/* support */
.support{background:var(--red);padding:42px 0;position:relative;}
.support-row{display:grid;grid-template-columns:auto 1fr auto;gap:28px;align-items:center;}
.support h2{font-size:clamp(30px,3.4vw,46px);color:#fff;}
.support p{margin:0;color:#ffe3e3;font-size:17px;max-width:44ch;}

/* sticky wall */
.sticky-wall{display:flex;flex-wrap:wrap;gap:28px 30px;}
.sticky-wall .sticky{width:250px;margin:0;}
.wall-note{margin-top:36px;color:var(--muted);}

/* footer */
.site-footer{padding:44px 0 52px;background:var(--bar);border-top:1px solid #2c333a;}
.foot-brand img{width:44px;height:44px;margin:-6px -4px -6px -6px;}
.foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px;}
.foot-brand{display:flex;align-items:center;gap:10px;font-family:"DF Title",sans-serif;font-weight:900;text-transform:uppercase;letter-spacing:.04em;color:var(--ink);}
.foot nav{display:flex;flex-wrap:wrap;gap:22px;}
.foot nav a{color:var(--body);text-decoration:none;font-size:16px;text-transform:uppercase;}
.foot nav a:hover{color:var(--red);}
.copy{margin:0;color:var(--muted);font-size:15px;width:100%;}

/* multi-page (2026-10-02): nav state, section links, page heads */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.nav nav a[aria-current="page"]{color:var(--ink);box-shadow:inset 0 -2px 0 var(--red);}
.sec-more{font-family:"DF Type",monospace;font-size:16px;text-transform:uppercase;letter-spacing:.05em;margin:28px 0 0;}
.sec-more a{color:var(--ink);text-decoration:none;border-bottom:2px solid var(--red);padding-bottom:2px;}
.sec-more a::after{content:" \2192";color:var(--red);font-family:"Inter",sans-serif;}
.sec-more a:hover{color:var(--red);}
.paper .sec-more a,.case-body .sec-more a{color:var(--paper-ink);}
.sec-more-films{margin:-40px 0 clamp(72px,9vw,110px);}
.page-head{background:radial-gradient(800px 420px at 80% 20%,rgba(229,72,77,.12),transparent 62%),linear-gradient(180deg,#141217,var(--bg));padding:clamp(56px,7vw,96px) 0 clamp(52px,6vw,80px);}
.page-head h1{font-size:clamp(46px,7vw,104px);max-width:14ch;}
.page-head .hl{color:var(--red);}
.page-head .lead{font-size:clamp(18px,1.7vw,22px);max-width:46ch;margin:24px 0 0;color:var(--body);}
.how-top{padding-top:clamp(64px,8vw,104px);}
.page-head + .section{padding-top:clamp(40px,5vw,68px);}
.nav-patreon{display:none;}
.how-top h1.title{font-size:clamp(44px,6vw,88px);}

/* the view counter */
.counter-strip{padding:clamp(34px,4vw,52px) 0 clamp(30px,3.5vw,44px);border-bottom:1px solid var(--line);}
.counter-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px 40px;}
.counter-copy .label{margin:0 0 6px;}
.counter-note{margin:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 16px;}
.counter-note .marker{color:var(--red);font-size:clamp(24px,2.4vw,32px);transform:rotate(-3deg);display:inline-block;}
.counter-note a{color:var(--body);font-size:15px;}
.counter-strip .odometer{font-size:clamp(34px,5.6vw,78px);}
.counter-asof{margin-top:12px;font-size:14px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;}
.counter-asof .draft{color:#e2c160;text-transform:none;letter-spacing:0;font-family:"Inter",sans-serif;}
.odometer{margin:0;font-family:"DF Title","Inter",sans-serif;font-weight:900;line-height:1;}
.odo-digits{display:inline-flex;align-items:flex-end;gap:clamp(3px,.45vw,6px);}
.odo-digits .dig{display:inline-block;min-width:.74em;text-align:center;padding:.15em .07em .11em;border-radius:5px;color:var(--ink);background:linear-gradient(180deg,#24212a 0%,#17151b 49%,#0b0a0d 50%,#1a181e 100%);box-shadow:inset 0 0 0 1px #34303a,0 8px 18px rgba(0,0,0,.55);font-variant-numeric:tabular-nums;}
.odo-digits .dig:last-child{color:var(--red);}
.odo-digits .sep{color:var(--muted);margin:0 1px;}

/* our story */
.story-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(32px,5vw,80px);align-items:start;}
.story p{font-size:clamp(17px,1.4vw,19.5px);color:var(--ink);max-width:56ch;margin:0 0 18px;}
.story .story-open{font-size:clamp(30px,3vw,42px)!important;color:var(--red)!important;transform:rotate(-2deg);transform-origin:left;margin-bottom:22px!important;line-height:1.1;}
.counter-card{position:relative;padding:34px clamp(20px,3vw,36px) 28px;transform:rotate(var(--r));}
.counter-card .odometer{font-size:clamp(30px,3.6vw,54px);margin:6px 0 12px;}
.card-label{margin:0 0 12px;font-size:17px;text-transform:uppercase;color:#b3262b;letter-spacing:.06em;}
.counter-sub{margin:0;color:var(--paper-ink);font-weight:600;}
.counter-asof-card{margin:4px 0 0;font-size:14px;color:var(--paper-mute);text-transform:uppercase;}
.counter-card .form-note{margin-top:8px;}
.story-note{grid-column:2;margin-top:0;}

/* two cards side by side (interviews) */
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,56px);align-items:start;}
.notecard{padding:clamp(26px,3vw,40px) clamp(22px,3vw,40px);transform:rotate(var(--r));}
.ticks{list-style:none;margin:0;padding:0;display:grid;gap:12px;}
.ticks li{position:relative;padding-left:30px;color:var(--paper-ink);font-size:17px;line-height:1.5;}
.ticks li::before{content:"";position:absolute;left:2px;top:.72em;width:16px;height:3px;background:#c42b30;transform:rotate(-8deg);}
.two-col > .sticky{margin-top:0;}

/* call to action at the bottom of inner pages */
.cta-band-row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px);align-items:end;}
.cta-band h2{font-size:clamp(40px,5vw,76px);margin-bottom:18px;}
.cta-band .big{margin:0;}
.cta-band .email{margin:0;}

/* the full case file page */
.casefile-full{margin:0 auto;max-width:1040px;}
.casefile-full .type-body b{font-family:"DF Type",monospace;font-weight:normal;color:#b3262b;text-transform:uppercase;}

/* tablet */
@media (max-width:1020px){
  .story-grid,.two-col,.cta-band-row{grid-template-columns:1fr;}
  .story-note{grid-column:1;}
  .counter-row{justify-content:flex-start;}
  .hero-grid{grid-template-columns:1fr;}
  .board{justify-self:center;max-width:560px;margin-top:20px;}
  .exhibit,.exhibit.flip{grid-template-columns:1fr;}
  .exhibit.flip .exhibit-media{order:0;}
  .about-grid,.memo-wrap,.contact-grid{grid-template-columns:1fr;}
  .memo,.memo-head,.memo-note{grid-column:1;grid-row:auto;}
  .casefile{margin-right:0;}
  .casefile .sticky{position:relative;right:auto;bottom:auto;}
  .support-row{grid-template-columns:1fr;}
  .email{font-size:clamp(15px,4vw,30px);}
}
/* phone */
@media (max-width:760px){
  .nav{flex-wrap:wrap;height:auto;padding:12px var(--pad) 10px;row-gap:8px;}
  .nav nav{width:100%;justify-content:space-between;gap:8px;}
  .nav nav a:not(.btn){font-size:12.5px;white-space:nowrap;letter-spacing:.02em;}
  .nav nav .btn{display:none;}
  .nav-patreon{display:inline-block;margin-left:auto;}
  .sec-more-films{margin-top:-24px;}
  .sticky-wall .sticky{width:100%;}
}
@media (max-width:480px){
  body{font-size:16px;}
  .brand span{font-size:15px;}
  .snap figcaption{font-size:11px;}
  .note{left:40%;width:57%;padding:16px 14px 14px;}
  .note p{font-size:13px;}
}