/* Quirky Corridor - bold light colour-block direction (styling layer only).
   Same words, functions and QC colours. Light throughout. Loaded after qc-premium.css. */
:root{--b-red:#c10a17;--b-logo:#db0b1a;--b-sand:#FAFAFA;--b-sand2:#FAFAFA;--b-ink:#17161a;--b-mute:#55535c;--b-white:#FFFFFF;
 --p-bg:var(--b-white);--p-band:var(--b-sand);--p-ink:var(--b-ink);--p-mute:var(--b-mute);--p-red:var(--b-red)}
html,body{background:var(--b-white);color:var(--b-ink)}
@keyframes none{}
/* squiggle mark (inline svg) */
:root{--zig:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='84' height='16' viewBox='0 0 84 16'%3E%3Cpath d='M2 12 8 4l6 8 6-8 6 8 6-8 6 8 6-8 6 8 6-8 6 8 6-8 6 8' fill='none' stroke='%23c10a17' stroke-width='2.4' stroke-linejoin='round' stroke-linecap='round'/%3E%3C/svg%3E")}
/* headings: heavy, with short red rule */
.qc-section h2{font-weight:800!important;letter-spacing:-.04em!important;line-height:1.02!important;max-width:20ch;font-size:clamp(38px,5.4vw,78px)!important}
.qc-section h2::after{content:"";display:block;width:64px;height:4px;background:var(--b-red);margin-top:26px;border-radius:2px}
.qc-kicker,.qc-section .qc-kicker{font-size:13px!important;font-weight:700!important;letter-spacing:.18em!important;color:var(--b-red)!important}
.qc-kicker::before{width:22px;height:22px!important;background:var(--zig) center/contain no-repeat!important;opacity:1}
.qc-section{padding-top:clamp(72px,9vw,128px)!important;padding-bottom:clamp(72px,9vw,128px)!important}
/* nav */
.qc-nav{background:rgba(252,252,251,.94)!important;border-bottom:0!important;box-shadow:0 1px 0 #FAFAFA}
.qc-nav-links a{font-weight:600}
.qc-btn{font-weight:700;border-radius:999px!important}
.qc-btn-red{background:var(--b-red)!important}
.qc-btn-ghost{border:2px solid var(--b-ink)!important;color:var(--b-ink)!important}
.qc-btn-ghost:hover{background:var(--b-ink)!important;color:#fff!important}
/* hero: big type left, colour bolts right */
.qc-hero{position:relative;overflow:hidden;background:var(--b-white)!important;text-align:left!important;padding-top:clamp(56px,8vw,120px)!important;padding-bottom:clamp(180px,18vw,260px)!important;isolation:isolate}
.qc-hero::before,.qc-hero::after{content:"";position:absolute;z-index:-1;top:0;bottom:0;pointer-events:none}
.qc-hero::before{display:none}
.qc-hero::after{right:0;width:56%;background:url(/assets/hero-art.png) right bottom/auto 100% no-repeat}
@media (min-width:1700px){.qc-hero::after{width:48%;background-size:cover}}
.qc-wordwall{display:none!important}
.qc-hero>*:not(.qc-marquee){position:relative;max-width:min(980px,92%)!important;margin-left:clamp(20px,9vw,150px)!important;margin-right:auto!important;text-align:left!important}
.qc-eyebrow{color:var(--b-red)!important;font-weight:700;letter-spacing:.2em!important;display:flex!important;gap:14px;align-items:center;justify-content:flex-start!important}
.qc-hero h1{font-size:clamp(48px,8.4vw,132px)!important;font-weight:800!important;letter-spacing:-.05em!important;line-height:.96!important;color:var(--b-ink)!important;text-align:left!important}
.qc-hero h1::before{content:"";display:block;width:84px;height:16px;background:var(--zig) no-repeat;margin-bottom:26px}
.qc-rotate,.qc-rotate *{color:var(--b-red)}
.qc-hero-sub{color:var(--b-mute)!important;max-width:44ch!important}
.qc-hero-ctas{justify-content:flex-start!important}
.qc-marquee{position:absolute!important;left:0;right:0;bottom:0;background:var(--b-red)!important;border:0!important;padding:18px 0}
.qc-marquee,.qc-marquee *{color:#fff!important;opacity:1!important;font-weight:700;letter-spacing:.16em}
.qc-marquee em,.qc-marquee .qc-dot{color:var(--b-red)!important;background:none!important}
@media (max-width:860px){
 .qc-hero::after{width:100%;height:420px;top:auto;background-size:cover;background-position:center bottom}
 .qc-hero>*:not(.qc-marquee){margin-left:20px!important;max-width:calc(100% - 40px)!important}
 .qc-hero{padding-bottom:470px!important}
}
/* problems: sand panel, white cards in 2 cols */
#problems{background:var(--b-sand)!important;--band:var(--b-sand)}
.qc-problem-grid-v2{gap:clamp(14px,2vw,28px)!important}
.qc-problem-v2,.qc-problem-v2.rv-in:hover{background:var(--b-white)!important;border:0!important;border-radius:6px!important;padding:clamp(26px,3vw,48px)!important;border-top:5px solid var(--b-red)!important}
.qc-problem-v2 h3{font-weight:800;font-size:clamp(22px,2.2vw,32px);letter-spacing:-.03em}
/* services: edge-to-edge colour mosaic panels */
#services{background:var(--b-white)!important;--band:var(--b-white);padding-bottom:0!important}
#services>*:not(.qc-alt){position:relative}
.qc-alt{width:100vw!important;max-width:none!important;margin:clamp(40px,5vw,72px) calc(50% - 50vw) 0!important}
.qc-alt-row,.qc-alt-row:nth-child(even){display:grid!important;grid-template-columns:1fr 1fr!important;gap:0!important;padding:0!important;border:0!important;background:var(--b-sand)!important;align-items:stretch!important;min-height:0}
.qc-alt-row:nth-child(even){background:var(--b-white)!important}
.qc-alt-row.is-flip .qc-alt-img{order:2}
.qc-alt-img{border-radius:0!important;aspect-ratio:1/1!important;width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;box-shadow:none!important;background:var(--b-sand2)}
.qc-alt-img img{width:100%!important;height:100%!important;object-fit:contain!important;transform:none!important;filter:none!important}
.qc-alt-text{align-self:center;background:var(--b-white);margin:clamp(20px,3vw,44px);padding:clamp(28px,4vw,64px)!important;border-radius:6px;box-shadow:0 1px 0 rgba(23,22,26,.04)}
.qc-alt-row:nth-child(even) .qc-alt-text{background:var(--b-sand)}
.qc-alt-text h3{font-weight:800!important;font-size:clamp(26px,2.9vw,42px)!important;letter-spacing:-.035em!important}
.qc-alt-text h3::after{content:"";display:block;width:56px;height:4px;background:var(--b-red);margin-top:18px}
.qc-slide-n{color:var(--b-red)!important;font-weight:700!important}
.qc-tags span,.qc-tag{border:2px solid var(--b-ink)!important;color:var(--b-ink)!important;font-weight:700;background:transparent}
@media (max-width:859px){.qc-alt-row,.qc-alt-row:nth-child(even){grid-template-columns:1fr!important}.qc-alt-row.is-flip .qc-alt-img{order:0}.qc-alt-img{min-height:0!important;aspect-ratio:1/1!important;height:auto!important}.qc-alt-text{margin:0!important;border-radius:0}}
/* approach */
#approach{background:var(--b-white)!important;--band:var(--b-white)}
.qc-steps{gap:clamp(14px,2vw,28px)!important}
.qc-step,.qc-step.rv-in:hover,.qc-step.qc-lit,.qc-step.qc-tap{background:var(--b-sand)!important;border:0!important;border-radius:6px!important;padding:0 0 clamp(22px,2.4vw,34px)!important;overflow:hidden;border-top:0!important}
.qc-step-head{display:block!important;margin:0 0 18px!important;padding:0!important}
.qc-step-thumb{display:block!important;width:100%!important;height:auto!important;aspect-ratio:1/1;object-fit:contain;border:0!important;border-radius:0!important;mix-blend-mode:normal!important;background:var(--b-sand2)!important;margin:0 0 clamp(18px,2vw,26px)!important;box-shadow:none!important}
.qc-step h3,.qc-step p{padding-left:clamp(20px,2.4vw,34px);padding-right:clamp(20px,2.4vw,34px)}
.qc-step h3{font-weight:800;letter-spacing:-.03em;font-size:clamp(22px,2vw,30px)}
.qc-step-n{color:var(--b-red)!important;font-weight:800}
/* industries: full red band like a client strip */
#industries{background:var(--b-red)!important;--band:var(--b-red);color:#fff}
#industries h2,#industries p,#industries .qc-kicker,#industries .qc-lead{color:#fff!important}
#industries h2::after{background:#fff}
#industries .qc-kicker::before{filter:brightness(0) invert(1)}
.qc-chip,.qc-chips button,.qc-chips span{border:2px solid #fff!important;background:transparent!important;color:#fff!important;font-weight:700;border-radius:999px}
.qc-chip-on{background:#fff!important;color:var(--b-red)!important}
/* working with us: 2x2 mosaic */
#working{background:var(--b-sand)!important;--band:var(--b-sand)}
.qc-working-thumb{border-radius:6px!important;box-shadow:none!important;background:var(--b-sand2)!important}
.qc-working h3,#working h3{font-weight:800;letter-spacing:-.03em}
/* notes + contact */
#notes{background:var(--b-white)!important;--band:var(--b-white)}
#contact{background:var(--b-sand)!important;--band:var(--b-sand)}
#contact h2::after{background:var(--b-red)}
/* a 6px red rule above the footer */
.qc-footer{border-top:8px solid var(--b-red)}
/* refinements */
.qc-hero h1{font-size:clamp(46px,6vw,100px)!important}
.qc-hero h1 .qc-rotate{display:block!important;text-align:left!important;margin:0!important;padding:0!important;width:auto!important}
.qc-hero h1 .qc-rotate-col{text-align:left!important;margin:0!important}
.qc-hero h1 .qc-rotate-col span{text-align:left!important;justify-content:flex-start!important}
.qc-kicker::before{width:44px!important;height:10px!important}
@media (min-width:861px){.qc-hero>*:not(.qc-marquee){max-width:min(640px,50%)!important}.qc-hero-sub{max-width:40ch!important}}
.qc-hero h1 .qc-rotate{font-size:.74em!important}

/* story thread: numbered steps */
.qc-steps{counter-reset:stp}
.qc-step{position:relative;counter-increment:stp}
.qc-step::before{content:none!important;display:none!important}
.qc-hero>*:not(.qc-marquee){position:relative;z-index:1}
/* hero art sizing */
@media (min-width:861px){
 .qc-hero{min-height:calc(clamp(460px,52vw,880px) + 64px)!important;padding-bottom:100px!important}
 .qc-hero::after{top:auto!important;bottom:0;right:0;width:clamp(460px,52vw,880px)!important;height:clamp(460px,52vw,880px)!important;background-size:100% 100%!important}
 .qc-hero>*:not(.qc-marquee){max-width:min(46%,640px)!important}
 .qc-hero-sub{max-width:100%!important}
}
@media (max-width:860px){.qc-hero{padding-bottom:400px!important}.qc-hero::after{height:380px!important}}
@media (max-width:860px){.qc-hero{padding-bottom:calc(min(100vw,560px) + 70px)!important}.qc-hero::after{height:min(100vw,560px)!important;background-size:contain!important;background-position:right bottom!important}}
@media (min-width:1500px){.qc-alt-row,.qc-alt-row:nth-child(even){grid-template-columns:minmax(0,720px) 1fr!important}.qc-alt-row.is-flip,.qc-alt-row.is-flip:nth-child(even){grid-template-columns:1fr minmax(0,720px)!important}}
@media (min-width:1500px){.qc-alt-text{max-width:820px;width:100%;justify-self:start;margin-left:clamp(48px,6vw,160px)!important}.qc-alt-row.is-flip .qc-alt-text{justify-self:end;margin-left:0!important;margin-right:clamp(48px,6vw,160px)!important}}
/* hero: align copy with the logo edge, tighter top gap */
@media (min-width:861px){.qc-hero{padding-top:clamp(36px,4.5vw,76px)!important}.qc-hero>*:not(.qc-marquee){margin-left:clamp(24px,3.4vw,64px)!important;max-width:min(700px,52%)!important}.qc-hero h1{font-size:clamp(52px,7.2vw,120px)!important}}
@media (min-width:1700px){.qc-hero>*:not(.qc-marquee){margin-left:max(64px,calc((100vw - 1700px)/2 + 64px))!important}}
@media (min-width:861px){.qc-hero>*:not(.qc-marquee){max-width:min(620px,44%)!important}}
@media (min-width:1700px){.qc-hero>*:not(.qc-marquee){max-width:min(700px,40%)!important}}
@media (max-width:860px){.qc-hero{padding-bottom:calc(min(100vw,560px)*.86 + 60px)!important}.qc-hero::after{height:calc(min(100vw,560px)*.86)!important;background-size:100% 100%!important}}
@media (max-width:860px){.qc-hero{min-height:0!important}}
