/* Direction A: printed ticket stock and hand-lettered wall art.
   Layout, wall photography and the unedited portrait stay in home.css. */
:root{--violet:#c399ff;--deep-purple:#581897;--brush:'Permanent Marker','Segoe Print','Comic Sans MS',cursive;--script:'Kaushan Script','Segoe Print','Comic Sans MS',cursive;--stock:#eee8db;--ticket-edge:polygon(0 0,100% 0,100% 41%,98% 44%,97.5% 50%,98% 56%,100% 59%,100% 100%,0 100%,0 59%,2% 56%,2.5% 50%,2% 44%,0 41%)}
.signature{color:#9546ed;background:linear-gradient(165deg,#cfbaff 5%,#9b65f0 35%,#7025d4 58%,#a27aff 76%,#5920af);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(2px 3px 0 #200a35);text-shadow:none}
.brand:before{display:none}
.brand svg{color:var(--violet);filter:drop-shadow(2px 2px 0 var(--deep-purple))}
.brand-sub{font-family:var(--brush);font-size:25px;transform:rotate(-5deg);text-shadow:3px 3px 0 var(--deep-purple)}
.brand{gap:27px}
.mobile-intro{color:#e4d9eb}
.headline-poster{overflow:visible;clip-path:none}
.headline-poster h1{font-weight:400;letter-spacing:0;line-height:1.02;margin:24px 0 7px;isolation:isolate}
h1>span{display:block;width:fit-content;max-width:100%}
h1 .support-word{font-family:var(--script);font-size:clamp(56px,6.1vw,100px);text-transform:none;transform:rotate(-6deg);color:var(--violet);text-shadow:3px 4px 0 var(--deep-purple),5px 6px 0 #100c16;margin:0 0 9px 10px}
h1 .independent-word{font-family:var(--display);font-size:clamp(59px,6.8vw,112px);color:#ddc3ff;-webkit-text-stroke:1px #c399ff;text-shadow:4px 4px 0 #7024bd,7px 6px 0 #120d18;transform:rotate(-1deg);letter-spacing:1px}
h1 .artists-word{position:relative;font-family:var(--brush);font-size:clamp(57px,6.3vw,105px);text-transform:none;color:#f9f1ff;text-shadow:3px 4px 0 #3a125e;transform:rotate(-4deg);padding:3px 24px 12px 10px;margin:8px 0 0}
h1 .artists-word:before{content:'';position:absolute;inset:10% -2% 0 -3%;background:linear-gradient(110deg,#601db5,#8a2be2 55%,#a354e2);clip-path:polygon(2% 11%,92% 0,89% 10%,100% 13%,95% 32%,100% 48%,94% 68%,97% 90%,7% 100%,10% 87%,0 84%,4% 57%,0 30%,6% 23%);z-index:-1}
/* White tear-off stock, deep hanging tabs and a visible perforation. */
.tear-nav{gap:22px;filter:drop-shadow(4px 7px 2px #0009)}
.tear-nav a,.tear-nav a:last-child{position:relative;min-height:248px;background:#eeeae2 url('../assets/photo/paper-tape.webp') -150px 38%/1600px auto;color:#151216;box-shadow:none;clip-path:polygon(1% 1%,26% 0,54% 1%,79% 0,99% 1%,100% 99%,0 100%);mask-image:linear-gradient(to bottom,#000 0 calc(100% - 64px),transparent calc(100% - 64px)),repeating-linear-gradient(90deg,#000 0 21px,transparent 21px 23px);mask-size:100% 100%,100% 64px;mask-position:top,bottom;mask-repeat:no-repeat}
.tear-nav a:nth-child(2){min-height:262px}
.tear-nav a span{padding:38px 13px 25px;font-size:25px}
.tear-nav a span:before{content:'';display:block;width:21px;height:15px;border:1px solid #492f66;border-radius:50%;margin-bottom:17px;background:url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 78"%3E%3Cpath d="M15 54 7 21 32 36 48 5 61 36 90 17 80 55Z M19 67 78 67" fill="none" stroke="%23581897" stroke-width="6"/%3E%3C/svg%3E') center/15px 12px no-repeat;transform:rotate(-12deg)}
.tear-nav i{height:65px;flex:none;border-top:2px dashed #70675e;background:none;clip-path:polygon(0 0,100% 0,100% 94%,80% 99%,62% 92%,45% 100%,25% 95%,0 99%)}
.tear-nav a:focus-visible{outline-offset:-6px}
/* Each stock panel has die-cut notches, a perforated stub and a crown stamp. */
.action-paste,.discovery-note,.service-flyer,.mission-copy,.co-bill,.contact-wall>div,.contact-wall li{position:relative;clip-path:var(--ticket-edge);border:1px solid #c7bba478;box-shadow:inset 0 0 0 7px #ffffff0a}
.action-paste{background:linear-gradient(#6721bddb,#7832cbdc),url('../assets/photo/paper-tape.webp') center/1100px auto;padding:25px 34px 23px}
.ticket-stamp{position:absolute;right:18px;top:16px;width:37px;height:34px;padding:5px;border:1px solid currentColor;border-radius:50%;color:var(--violet);transform:rotate(13deg);opacity:.8}
.action-paste>p{padding-right:32px}
.work-link>span{font:400 clamp(28px,3vw,45px)/1.35 var(--brush);text-transform:none;text-shadow:2px 3px 0 #3e155f}
.work-link em{font-family:var(--script);font-style:normal;color:#ecdbff}
.work-link svg{width:55px;margin-left:9px}
.work-link small{font-weight:600}
.service-line{border-top:2px dashed #e6d3ff9c;padding-top:19px;margin:24px -25px -5px;padding-left:23px;padding-right:18px;gap:10px 20px}
.discovery-note{padding:32px 28px 71px;transform:rotate(-3deg);background-color:var(--stock);border-color:#a69679}
.discovery-note:after,.mission-copy:after,.contact-wall>div:after{content:'';position:absolute;bottom:42px;left:0;right:0;border-top:2px dashed #67546b80}
.discovery-note .ticket-stamp{top:auto;bottom:7px;color:var(--deep-purple);width:35px;height:29px}
.discovery-note h2{font:400 clamp(24px,2.5vw,38px)/1.4 var(--script);color:var(--deep-purple);margin:5px 0 22px;transform:rotate(-1deg)}
.discovery-note h2 span{display:block}
.discovery-note h2 span:nth-child(2){font-family:var(--brush);font-size:.88em;color:#24172c;transform:rotate(2deg)}
.discovery-note h2 span:last-child{text-decoration:underline;text-decoration-color:#8a2be270;text-underline-offset:7px}
.flyer-stack{min-width:0}
.service-flyer{overflow:visible;margin-top:13px;background-color:var(--stock)}
.service-flyer:nth-child(2){background-image:linear-gradient(#c7a1eee8,#c7a1eee8),url('../assets/photo/paper-tape.webp');color:#281335}
.service-flyer button{font-family:var(--brush);font-size:clamp(25px,2.6vw,37px);text-transform:none;border:0;padding:24px 19px 24px 27px;transform:none!important;min-height:105px}
.service-flyer:nth-child(2) button,.service-flyer:nth-child(4) button{font-family:var(--script)}
.service-flyer button>span:first-child{transform:rotate(-2deg)}
.service-flyer button .flap-mark{position:relative;display:flex;flex:none;align-self:stretch;align-items:center;justify-content:center;width:45px;margin:-24px -2px -24px 0;border-left:2px dashed currentColor;padding-left:12px;font:400 30px/1 var(--label)}
.service-flyer button .flap-mark:before{content:'';position:absolute;top:13px;width:20px;height:15px;background:url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 78"%3E%3Cpath d="M15 54 7 21 32 36 48 5 61 36 90 17 80 55Z M19 67 78 67" fill="none" stroke="%23581897" stroke-width="7"/%3E%3C/svg%3E') center/contain no-repeat}
.service-flyer.branding button .flap-mark:before{filter:brightness(0) invert(1)}
.is-open .flap-mark{transform:none}
.is-open .flap-mark:after{content:'−';position:absolute;inset:0;display:grid;place-items:center;padding-left:12px;background:inherit;font-size:30px}
.is-open .flap-mark{font-size:0!important}
.flap-body{border-top:2px dashed #74617f90;padding:3px 30px 25px}
.service-flyer button:focus-visible{outline-offset:-7px}
.mission-copy{background:var(--stock) url('../assets/photo/paper-tape.webp') -150px 38%/1600px auto;color:#251a2e;padding:35px 33px 64px;transform:rotate(2deg)}
.mission-copy h2{font:400 clamp(35px,3.4vw,53px)/1.3 var(--script);color:var(--deep-purple);transform:rotate(-4deg)}
.mission-copy h2 span{font-family:var(--brush);display:block;margin-left:20px;text-shadow:2px 2px 0 #d5bbf4}
.mission-copy p{font-size:18px;line-height:1.8}
.mission-copy>svg{position:absolute;right:18px;bottom:7px;width:36px;height:29px;padding:3px;border:1px solid var(--deep-purple);border-radius:50%;color:var(--deep-purple)}
.manifesto{font:400 clamp(35px,3.7vw,60px)/1.25 var(--brush);transform:rotate(-4deg);min-width:0}
.manifesto>p:first-child{margin:0;text-shadow:3px 3px 0 #401066}
.manifesto span{font-family:var(--script);color:var(--violet)}
.energy-banner{position:relative;isolation:isolate;font:400 clamp(19px,1.9vw,29px)/1.5 var(--script);padding:26px 20px;margin:25px -8px 0 -12px;color:#f2e7ff;text-align:center;transform:rotate(6deg)}
.energy-banner:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,#581897,#8a2be2 70%,#6621ac);clip-path:polygon(5% 6%,93% 0,89% 8%,100% 13%,95% 26%,99% 43%,94% 61%,100% 80%,91% 85%,94% 96%,5% 100%,8% 89%,0 86%,4% 67%,0 42%,6% 29%,1% 13%)}
.energy-banner strong{font-family:var(--brush);font-weight:400}
.co-bill{padding:34px 43px 65px 30px;background-color:#17111f}
.co-bill:after{content:'';position:absolute;bottom:43px;left:0;right:0;border-top:2px dashed #bca2d178}
.co-bill .ticket-stamp{top:auto;bottom:7px;width:34px;height:29px}
.cross{color:var(--violet)}
.co-bill h2{font:400 clamp(37px,3.8vw,57px)/1.05 var(--script);color:var(--violet);text-shadow:2px 3px 0 #581897;transform:rotate(-5deg);margin:14px 0 22px}
.co-bill h2 span{display:block}
.co-bill h2 span:last-child{font-family:var(--brush);color:#f4eaff;transform:rotate(2deg);font-size:.9em;margin:4px 0 0 17px}
.co-bill p{font-family:var(--script);font-size:20px;line-height:1.6;color:#e3c7ff}
.contact-wall{gap:35px;align-items:center}
.contact-wall>div{background:linear-gradient(#6920b9e8,#6920b9e8),url('../assets/photo/paper-tape.webp') center/1000px auto;padding:25px 26px 69px;transform:rotate(-3deg)}
.contact-wall>div:after{border-color:#d7b3ff99}
.contact-wall>div>svg{width:44px;height:35px;color:var(--violet)}
.contact-wall h2{font:400 clamp(39px,4.4vw,69px)/1.15 var(--script);margin:7px 0 23px;text-shadow:3px 3px 0 #3a0f62;transform:rotate(-3deg)}
.contact-wall h2 span{display:block;font-family:var(--brush);color:#e1c9ff}
.contact-wall ul{background:none;padding:0;min-width:0}
.contact-wall li{background:var(--stock) url('../assets/photo/paper-tape.webp') -150px 38%/1600px auto;color:#281a31;border-color:#ac9a80;margin:12px 0;transform:rotate(1deg)}
.contact-wall li:nth-child(even){transform:rotate(-1deg);margin-left:9px}
.contact-wall li a{font-size:12px;min-height:77px;padding:18px 22px;gap:14px;align-items:center;overflow-wrap:anywhere}
.contact-wall li span{font-size:10px;font-weight:700;color:#581897;border-right:2px dashed #80658e;align-self:stretch;display:flex;align-items:center;padding-right:14px;min-width:83px}
.contact-wall li span:before{content:'';width:16px;height:13px;flex:none;margin-right:6px;background:url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 78"%3E%3Cpath d="M15 54 7 21 32 36 48 5 61 36 90 17 80 55Z M19 67 78 67" fill="none" stroke="%23581897" stroke-width="7"/%3E%3C/svg%3E') center/contain no-repeat}
.contact-wall li a:focus-visible,.submit-link:focus-visible,.work-link:focus-visible,.co-bill>a:focus-visible{outline-offset:-3px}
.contact-wall li a:focus-visible{outline-color:#581897}
.footer-sign{border-top:2px dashed #ffffff60}
@media(min-width:701px) and (max-width:1200px){
 .brand{gap:15px}.brand-sub{font-size:20px}.brand .signature{font-size:65px}
 .tear-nav a,.tear-nav a:nth-child(2){min-height:220px}.tear-nav a span{font-size:22px;padding:27px 10px 20px}
 .headline-poster{padding-left:15px;padding-right:8px}.work-link>span{font-size:clamp(24px,3vw,36px)}.work-link svg{width:38px}
 .services{gap:30px}.discovery-note{padding:28px 23px 64px}.discovery-note h2{font-size:clamp(23px,2.5vw,30px)}
 .service-flyer button{font-size:clamp(23px,2.6vw,31px);padding-left:20px}.service-flyer button .flap-mark{width:36px}
 .mission-copy{padding:28px 24px 62px}.mission-copy p{font-size:16px}.contact-wall{grid-template-columns:1fr;gap:26px}.contact-wall>div{max-width:440px}.contact-wall li a{font-size:14px}
}
@media(min-width:701px) and (max-width:1000px){
 .brand{gap:10px;padding-left:15px}.brand .signature{font-size:51px}.brand-sub{font-size:16px}
 h1 .support-word{font-size:6.1vw}h1 .independent-word{font-size:6.8vw}h1 .artists-word{font-size:6.1vw}
 .tear-nav a span{font-size:20px}.tear-nav a span:before{margin-bottom:12px}.tear-nav a,.tear-nav a:nth-child(2){min-height:212px}
 .action-paste{padding-left:24px;padding-right:24px}.action-paste>p{font-size:12px}.work-link svg{width:30px;margin-left:4px}
 .service-flyer button{font-size:22px;padding-left:18px;padding-right:12px}.service-flyer button .flap-mark{width:28px;padding-left:7px}
 .discovery-note h2{font-size:24px}.co-bill{max-width:420px}
}
@media(max-width:700px){
 .brand{gap:16px}.brand .signature{font-size:65px}.brand-sub{font-size:21px}.brand svg{color:var(--violet)}
 .headline-poster{padding-bottom:25px}.headline-poster h1{margin-top:18px}
 h1 .support-word{font-size:clamp(46px,13.5vw,78px);margin-left:7px;margin-bottom:9px}
 h1 .independent-word{font-size:clamp(43px,12.7vw,73px);letter-spacing:0}
 h1 .artists-word{font-size:clamp(45px,13.8vw,80px);margin-top:6px;padding-bottom:12px}
 .action-paste{padding:26px 23px 22px;margin-top:0;margin-bottom:18px}.action-paste .ticket-stamp{width:28px;height:26px;top:8px;right:10px;opacity:.6}
 .work-link>span{font-size:clamp(24px,7.2vw,40px)}.work-link svg{width:30px;height:25px;margin-left:3px}.work-link small{font-size:10px}
 .service-line{font-size:9px;gap:8px 13px;margin:21px -18px -5px;padding:15px 16px 0}
 .tear-nav{gap:5px;bottom:0;grid-template-columns:.8fr 1.2fr 1.2fr;filter:drop-shadow(0 -4px 5px #000b)}
 .tear-nav a,.tear-nav a:nth-child(2),.tear-nav a:nth-child(3){min-height:100px;mask-image:linear-gradient(to bottom,#000 0 calc(100% - 28px),transparent calc(100% - 28px)),repeating-linear-gradient(90deg,#000 0 16px,transparent 16px 18px);mask-size:100% 100%,100% 28px}
 .tear-nav a span{font:800 10px/1.35 var(--label);padding:12px 8px 9px}.tear-nav a span:before{display:none}.tear-nav i{height:29px;border-top-width:2px}
 main{padding-bottom:135px}html{scroll-padding-bottom:125px;scroll-padding-top:20px}a,button{scroll-margin-bottom:125px;scroll-margin-top:20px}
 .discovery-note{padding:30px 25px 65px}.discovery-note h2{font-size:clamp(25px,7.2vw,37px)}
 .service-flyer button{font-size:29px;min-height:98px;padding-left:25px}.service-flyer button .flap-mark{width:38px}
 .mission-copy{padding:28px 25px 66px}.mission-copy h2{font-size:42px}.mission-copy p{font-size:16px}
 .manifesto{align-self:stretch;font-size:clamp(34px,10.9vw,60px);margin:0 12px 15px}.energy-banner{font-size:clamp(19px,5.1vw,28px);margin:22px -4px 0;padding:25px 13px}
 .co-bill{padding:27px 25px 62px}.co-bill h2{font-size:43px}.co-bill p{font-size:19px}.co-bill-brands{gap:9px}.mini-brand .signature{font-size:51px}.co-bill-brands img{width:110px;height:110px}
 .contact-wall>div{padding:25px 26px 66px}.contact-wall h2{font-size:57px}.contact-wall ul{margin:28px 0 0}.contact-wall li a{font-size:11px;padding:17px 18px;flex-wrap:nowrap;gap:12px}.contact-wall li span{font-size:9px;min-width:66px;padding-right:10px;flex-direction:column;justify-content:center;gap:6px}.contact-wall li span:before{margin-right:0}
}
@media(max-width:360px){.brand{gap:12px;padding-left:21px}.brand .signature{font-size:53px}.brand-sub{font-size:18px}.service-flyer button{font-size:24px}.co-bill h2{font-size:36px}.co-bill-brands img{width:95px;height:95px}.co-bill-brands{gap:6px}.cross{font-size:24px}.mini-brand{font-size:20px}.contact-wall li a{font-size:10px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

/* Match the die cuts to the detachable stub, rather than the panel midpoint. */
.discovery-note,.mission-copy,.co-bill,.contact-wall>div,.action-paste{
 --stub:43px;clip-path:none;
 mask-image:radial-gradient(circle at 0 calc(100% - var(--stub)),transparent 0 8px,#000 8.5px),radial-gradient(circle at 100% calc(100% - var(--stub)),transparent 0 8px,#000 8.5px);
 mask-composite:intersect;
}
.action-paste{--stub:66px}
.service-line{min-height:48px}
.discovery-note:before,.mission-copy:before,.co-bill:before,.contact-wall>div:before{
 content:'GIGI / INDEPENDENT MUSIC';position:absolute;left:24px;bottom:15px;
 font:700 8px/1.2 var(--label);letter-spacing:1.3px;color:var(--deep-purple);opacity:.75;
}
.co-bill:before,.contact-wall>div:before{color:#e1c9ff}
.discovery-note,.mission-copy{background-image:linear-gradient(#ffffff26,#ffffff26),url('../assets/photo/paper-tape.webp')}
/* A perforated stack of hanging tabs, with uneven torn ends like Direction A. */
.tear-nav a,.tear-nav a:last-child{
 background-image:linear-gradient(#ffffff35,#ffffff35),url('../assets/photo/paper-tape.webp');
 clip-path:polygon(1% 1%,26% 0,54% 1%,79% 0,99% 1%,100% 97%,85% 99%,70% 97%,55% 100%,39% 98%,23% 99%,0 97%);
}
.tear-nav i{position:relative}
.service-flyer button>span:first-child{min-width:0;overflow-wrap:normal}
.service-flyer button .flap-mark{align-self:stretch}
.service-flyer{
 --service-stub:64px;clip-path:none;
 mask-image:radial-gradient(circle at calc(100% - var(--service-stub)) 0,transparent 0 7px,#000 7.5px),radial-gradient(circle at calc(100% - var(--service-stub)) 100%,transparent 0 7px,#000 7.5px);
 mask-composite:intersect;
}
.contact-wall li{
 --social-stub:105px;clip-path:none;
 mask-image:radial-gradient(circle at var(--social-stub) 0,transparent 0 6px,#000 6.5px),radial-gradient(circle at var(--social-stub) 100%,transparent 0 6px,#000 6.5px);
 mask-composite:intersect;
}
@media(min-width:1001px) and (max-width:1200px){.service-flyer{--service-stub:55px}}
@media(min-width:701px) and (max-width:1000px){
 .service-flyer{--service-stub:40px}
 .portrait-mount{margin-bottom:90px}
}
@media(max-width:700px){
 .tear-nav a,.tear-nav a:nth-child(2),.tear-nav a:nth-child(3){min-height:88px}
 .service-flyer{--service-stub:57px}
 .contact-wall li{--social-stub:84px}
 main{padding-bottom:120px}
 .services{gap:26px;padding-bottom:45px}
 .mission{padding-bottom:40px}
}
@media(max-width:360px){.service-line{font-size:8px;column-gap:10px}}