/* Imbrick — sections shared by the home page and inner pages (work, process, manifesto, anchor, testimonial) */
/* MANIFESTO */
.manifesto{border-top:1px solid var(--line);background:var(--ink);padding:180px 48px;overflow:hidden}
.manifesto-bg-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-family:var(--display);font-style:italic;font-weight:300;font-size:clamp(280px,40vw,600px);color:rgba(255,87,34,.04);white-space:nowrap;line-height:1;pointer-events:none;z-index:0;will-change:transform}
.manifesto-grid{display:grid;grid-template-columns:1fr 1.5fr;gap:80px;align-items:start;max-width:1600px;margin:0 auto;position:relative;z-index:2}
.manifesto-text{font-family:var(--display);font-weight:300;font-size:clamp(28px,3.5vw,52px);line-height:1.15;letter-spacing:-.02em}
.manifesto-text em{font-style:italic;color:var(--brick)}
.manifesto-text .word{display:inline-block;overflow:hidden;vertical-align:top}
.manifesto-text .word > span{display:inline-block}
.meta-block{margin-bottom:32px;padding-left:16px;border-left:1px solid var(--brick);font-family:var(--mono);font-size:13px;color:var(--muted);line-height:1.7}
.meta-block strong{color:var(--cream);display:block;margin-bottom:8px;font-weight:500}
.meta-num{color:var(--brick);font-family:var(--mono);font-size:var(--label);margin-right:8px}

/* WORK */
.work{background:var(--cream);color:var(--ink);border-top:1px solid var(--line);overflow:hidden}
.work .section-tag{color:var(--ink)}
.work .section-tag::before{background:var(--brick)}
.work .section-title em{color:var(--brick-on-light)}
.work-header{display:flex;justify-content:space-between;align-items:end;margin-bottom:80px;flex-wrap:wrap;gap:24px}
.work-filters{display:flex;gap:12px;flex-wrap:wrap}
.filter-chip{font-family:var(--mono);font-size:var(--label);text-transform:uppercase;letter-spacing:var(--label-track);min-height:44px;padding:0 18px;display:inline-flex;align-items:center;border:1px solid var(--ink-line);border-radius:100px;color:var(--ink);background:transparent;transition:background-color .3s,color .3s,border-color .3s,var(--press)}
.filter-chip.active,.filter-chip:hover{background:var(--ink);color:var(--cream);border-color:var(--ink)}
.work-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:24px}
.case{grid-column:span 6;position:relative}
.case:nth-child(1){grid-column:span 7}
.case:nth-child(2){grid-column:span 5;margin-top:120px}
.case:nth-child(3){grid-column:span 5}
.case:nth-child(4){grid-column:span 7;margin-top:80px}
.case-visual{aspect-ratio:4/3;position:relative;overflow:hidden;background:var(--ink);margin-bottom:20px}
.case:nth-child(2) .case-visual{aspect-ratio:3/4}
.case:nth-child(3) .case-visual{aspect-ratio:1/1}
.case-visual-inner{position:absolute;inset:-10%;will-change:transform}
.case-visual-inner::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,var(--bg-1) 0%,var(--bg-2) 100%)}
.case-visual-inner::after{content:'';position:absolute;inset:0;background-image:radial-gradient(circle at 30% 40%,var(--accent-1) 0%,transparent 40%),radial-gradient(circle at 70% 60%,var(--accent-2) 0%,transparent 50%);opacity:.7;mix-blend-mode:screen;transition:opacity .6s,transform .8s}
.case:hover .case-visual-inner::after{transform:scale(1.1);opacity:.9}
/* Brick-wall reveal overlay */
.brick-reveal{position:absolute;inset:0;display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(6,1fr);z-index:3;pointer-events:none}
.brick-reveal span{background:var(--cream);transform:scaleY(1);transform-origin:top;will-change:transform}
.case-visual .glyph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--display);font-style:italic;font-weight:300;font-size:clamp(80px,15vw,220px);color:var(--cream);opacity:.95;z-index:2;letter-spacing:-.05em;transition:transform .8s cubic-bezier(.16,1,.3,1)}
.case:hover .case-visual .glyph{transform:scale(1.15)}
.case-info{display:flex;justify-content:space-between;align-items:start;gap:24px}
.case-meta{font-family:var(--mono);font-size:var(--label);color:var(--ink-muted);text-transform:uppercase;letter-spacing:var(--label-track);margin-bottom:8px}
.case-title{font-family:var(--display);font-size:28px;font-weight:400;letter-spacing:-.02em;line-height:1.1;will-change:contents}
.case-title em{font-style:italic;color:var(--brick-on-light)}
.case-arrow{width:48px;height:48px;border:1px solid var(--ink-line);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .4s}
.case:hover .case-arrow{background:var(--brick);border-color:var(--brick);transform:rotate(-45deg)}
.case:hover .case-arrow svg{stroke:var(--cream)}
.case-result{margin-top:12px;font-family:var(--mono);font-size:var(--label);color:var(--ink-muted);letter-spacing:var(--label-track);display:flex;gap:16px;flex-wrap:wrap}
.case-result span strong{color:var(--brick-on-light);font-weight:500;margin-right:4px}
.case-visual-inner img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}
.case-link{color:inherit;text-decoration:none}
.case-link::after{content:'';position:absolute;inset:0;z-index:4}
.case-link:focus-visible{outline:none}
.case.has-link:focus-within{outline:2px solid var(--brick-on-light);outline-offset:6px}
.work-footer{text-align:center;margin-top:100px}
.work-footer .ghost-link{color:var(--ink);border-color:var(--ink-line)}

/* SHERBROOKE ANCHOR */
.sherbrooke{background:var(--ink);border-top:1px solid var(--line);padding:140px 48px;overflow:hidden}
.sherbrooke-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:80px;align-items:center;max-width:1600px;margin:0 auto}
.sherbrooke-copy h2{font-family:var(--display);font-weight:300;font-size:clamp(40px,5vw,72px);line-height:1;letter-spacing:-.03em;margin-bottom:32px}
.sherbrooke-copy h2 em{font-style:italic;color:var(--brick)}
.sherbrooke-copy p{font-size:16px;color:var(--muted-2);line-height:1.6;margin-bottom:32px;max-width:480px}
.sherbrooke-meta{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:48px}
.sherbrooke-meta-item{padding:16px 0;border-top:1px solid var(--line)}
.sherbrooke-meta-item .k{font-family:var(--mono);font-size:var(--label);color:var(--brick);text-transform:uppercase;letter-spacing:var(--label-track);margin-bottom:8px}
.sherbrooke-meta-item .v{font-family:var(--display);font-size:24px;color:var(--cream);letter-spacing:-.02em}
.sherbrooke-map{position:relative;aspect-ratio:1/1;background:var(--slate);border:1px solid var(--line);overflow:hidden}
.sherbrooke-map svg{width:100%;height:100%;display:block}
.map-pin{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2;display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none}
.map-pin .ring{width:40px;height:40px;border:1px solid var(--brick);border-radius:50%;position:relative}
.map-pin .ring::before,.map-pin .ring::after{content:'';position:absolute;inset:0;border-radius:50%;border:1px solid var(--brick);opacity:.4;animation:mapPing 3s ease-out infinite}
.map-pin .ring::after{animation-delay:1.5s}
.map-pin .dot{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:8px;height:8px;background:var(--brick);border-radius:50%}
.map-pin .lbl{font-family:var(--mono);font-size:var(--label);color:var(--brick);letter-spacing:var(--label-track);text-transform:uppercase;background:var(--ink);padding:4px 8px;border:1px solid var(--brick)}
@keyframes mapPing{0%{transform:scale(1);opacity:.6}100%{transform:scale(2.5);opacity:0}}

/* PROCESS */
.process{background:var(--ink);border-top:1px solid var(--line)}
.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;margin-top:80px}
.step{border-top:1px solid var(--brick);padding-top:24px}
.step-num{font-family:var(--display);font-style:italic;font-size:64px;font-weight:300;color:var(--brick);line-height:1;margin-bottom:24px}
.step-title{font-family:var(--display);font-size:24px;font-weight:400;margin-bottom:12px;letter-spacing:-.02em}
.step-desc{font-size:14px;color:var(--muted-2);line-height:1.6}
.step-dur{font-family:var(--mono);font-size:var(--label);color:var(--brick);letter-spacing:var(--label-track);text-transform:uppercase;margin-top:16px;display:block}

/* TESTIMONIAL */
.testimonial{background:var(--cream);color:var(--ink);border-top:1px solid var(--line);padding:180px 48px;overflow:hidden;position:relative}
.testimonial-quote{max-width:1200px;margin:0 auto;font-family:var(--display);font-weight:300;font-size:clamp(32px,5vw,72px);line-height:1.15;letter-spacing:-.02em;text-align:center}
.testimonial-quote em{font-style:italic;color:var(--brick-on-light)}
.testimonial-quote::before{content:'"';display:block;font-style:italic;color:var(--brick-on-light);font-size:1.5em;line-height:.5;margin-bottom:32px}
.testimonial-quote .word{display:inline-block;overflow:hidden;vertical-align:top;margin-right:.2em}
.testimonial-quote .word > span{display:inline-block}
.testimonial-attr{text-align:center;margin-top:48px;font-family:var(--mono);font-size:var(--label);text-transform:uppercase;letter-spacing:var(--label-track);color:var(--ink-muted)}
.testimonial-attr strong{color:var(--ink);display:block;margin-bottom:4px}

/* RESPONSIVE */
@media(max-width:1024px){
  .work-grid{grid-template-columns:1fr}
  .case,.case:nth-child(n){grid-column:1;margin-top:0}
  .process-grid{grid-template-columns:repeat(2,1fr);gap:40px;row-gap:60px}
  .manifesto-grid,.sherbrooke-grid{grid-template-columns:1fr;gap:40px}
}
@media(max-width:640px){
  .process-grid{grid-template-columns:1fr}
  .testimonial{padding:100px 20px}
}

/* IDENTITIES — the brand wall: logos laid in running bond, each brick flips to its reverse */
.identities{background:var(--ink);border-top:1px solid var(--line);overflow:hidden;--gap:10px}
.identities-header{display:flex;justify-content:space-between;align-items:end;gap:32px;flex-wrap:wrap;margin:0 auto 72px;max-width:1600px}
.identities-header .section-title{margin-bottom:0}
.identities-lead{max-width:420px;color:var(--muted-2);font-size:16px;line-height:1.6}
.id-wall{list-style:none;display:grid;grid-template-columns:repeat(8,1fr);gap:var(--gap);max-width:1600px;margin:0 auto}
.id-brick{grid-column:span 2;aspect-ratio:2.1/1;perspective:1200px}
.id-half{grid-column:span 1;background:var(--slate-2);border-radius:3px;box-shadow:inset 0 1px 0 rgba(244,241,234,.05)}
.id-half:nth-child(18n+5),.id-half:nth-child(18n+18){background:var(--brick)}
.id-card{position:relative;display:block;width:100%;height:100%;border:0;padding:0;background:none;cursor:pointer;color:inherit;font:inherit;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.16,1,.3,1);border-radius:3px}
.id-face{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;border-radius:3px;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.id-front{background:var(--paper);box-shadow:inset 0 0 0 1px rgba(10,10,10,.06)}
.id-front img{max-width:70%;max-height:66%;width:auto;height:auto;object-fit:contain}
.id-back{background:var(--brand);transform:rotateX(180deg);flex-direction:column;gap:10px;padding:16px;text-align:center}
.id-back .id-mono{max-width:46%;max-height:38%;width:auto;height:auto;object-fit:contain}
.id-back .id-mono.is-symbol{max-height:46%}
.id-back-name{font-family:var(--display);font-size:clamp(15px,1.4vw,20px);line-height:1.1;letter-spacing:-.01em}
.id-back-sector{font-family:var(--mono);font-size:var(--label);letter-spacing:var(--label-track);text-transform:uppercase;opacity:.75}
.is-reverse-light .id-back,.is-reverse-light.id-panel--reverse,.is-reverse-light .id-bcard--back{color:#fff}
.is-reverse-dark .id-back,.is-reverse-dark.id-panel--reverse,.is-reverse-dark .id-bcard--back{color:var(--ink)}
.is-reverse-light .id-mono{filter:brightness(0) invert(1)}
.is-reverse-dark .id-mono{filter:brightness(0)}
@media(hover:hover){.id-card:hover{transform:rotateX(180deg)}}
.id-card:focus-visible{transform:rotateX(180deg);outline:2px solid var(--brick);outline-offset:4px}
.identities-footer{text-align:center;margin-top:80px}

/* Brand board (modal) */
.id-board{border:0;padding:0;margin:auto;width:min(1240px,calc(100vw - 32px));max-height:calc(100dvh - 32px);background:var(--slate);color:var(--cream);border-radius:6px;overflow:auto;overscroll-behavior:contain}
.id-board::backdrop{background:rgba(10,10,10,.82);backdrop-filter:blur(6px)}
.id-board[open]{animation:idBoardIn .5s cubic-bezier(.16,1,.3,1)}
@keyframes idBoardIn{from{opacity:0;transform:translateY(24px) scale(.98)}to{opacity:1;transform:none}}
.id-board-inner{padding:40px}
.id-board-header{display:flex;justify-content:space-between;align-items:start;gap:24px;margin-bottom:32px}
.id-board-header .section-tag{margin-bottom:12px}
.id-board-title{font-family:var(--display);font-weight:300;font-size:clamp(32px,4vw,56px);line-height:1;letter-spacing:-.02em}
.id-board-full{margin-top:10px;color:var(--muted-2);font-size:15px}
.id-board-close{flex:none;width:48px;height:48px;border-radius:50%;border:1px solid var(--line-strong);background:transparent;color:var(--cream);font-size:28px;line-height:1;cursor:pointer;transition:background .3s,border-color .3s,color .3s}
.id-board-close:hover,.id-board-close:focus-visible{background:var(--brick);border-color:var(--brick);color:var(--ink)}
.id-board-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.id-panel{position:relative;margin:0;border-radius:4px;overflow:hidden;background:var(--slate-2);min-height:220px;display:flex;flex-direction:column}
.id-panel figcaption,.id-panel-caption{position:absolute;left:16px;bottom:14px;font-family:var(--mono);font-size:var(--label);letter-spacing:var(--label-track);text-transform:uppercase;color:var(--muted)}
.id-panel-stage{flex:1;display:flex;align-items:center;justify-content:center;padding:48px 32px 56px}
.id-panel-stage img{max-width:72%;max-height:200px;width:auto;height:auto;object-fit:contain}
.id-panel--primary{grid-column:span 4;background:var(--paper);min-height:340px}
.id-panel--primary figcaption{color:rgba(10,10,10,.7);background:rgba(255,255,255,.8);padding:4px 8px;border-radius:2px;left:12px;bottom:12px}
.id-panel--primary .id-panel-stage img{max-height:240px}
.id-panel--reverse{grid-column:span 2;background:var(--brand)}
.id-panel--reverse figcaption{color:inherit;opacity:.8}
.id-panel--reverse .id-panel-stage img{max-width:80%;max-height:150px}
.id-panel--cards{grid-column:span 3;background:radial-gradient(120% 90% at 30% 20%,#2a2a2a 0%,#151515 60%,#0d0d0d 100%);min-height:320px}
.id-panel--cards .id-panel-stage{position:relative;perspective:1400px}
.id-bcard{position:absolute;width:min(62%,300px);aspect-ratio:85/55;border-radius:5px;display:flex;align-items:center;justify-content:center;box-shadow:0 30px 50px -18px rgba(0,0,0,.75),0 6px 14px rgba(0,0,0,.35)}
.id-bcard--back{background:var(--brand);transform:translate(-22%,-14%) rotate(-9deg) rotateX(14deg)}
.id-bcard--back img{max-width:44%;max-height:48%}
.id-bcard--front{background:var(--paper);transform:translate(18%,14%) rotate(6deg) rotateX(10deg);flex-direction:column;align-items:flex-start;justify-content:space-between;padding:9%}
.id-bcard--front img{max-width:56%;max-height:42%;object-fit:contain;object-position:left center}
.id-bcard-lines{display:flex;flex-direction:column;gap:5px;width:46%}
.id-bcard-lines i{display:block;height:3px;border-radius:2px;background:rgba(10,10,10,.18)}
.id-bcard-lines i:nth-child(2){width:72%}
.id-bcard-lines i:nth-child(3){width:54%}
.id-panel--icon{grid-column:span 3;background:linear-gradient(160deg,#1f1f1f,#121212)}
.id-panel--icon .id-panel-stage{gap:28px;align-items:center}
.id-icon{flex:none;display:flex;align-items:center;justify-content:center;background:var(--brand);box-shadow:0 18px 30px -12px rgba(0,0,0,.7),inset 0 0 0 1px rgba(255,255,255,.06)}
.id-icon.has-symbol{background:var(--paper)}
.id-icon img{max-width:68%;max-height:68%;width:auto;height:auto;object-fit:contain}
.id-icon--l{width:120px;height:120px;border-radius:27px}
.id-icon--m{width:64px;height:64px;border-radius:15px}
.id-icon--s{width:32px;height:32px;border-radius:8px}
.id-panel--palette{grid-column:span 6;min-height:0;padding:24px 16px 48px}
.id-swatches{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px}
.id-swatches li{display:flex;flex-direction:column;gap:10px}
.id-swatch-chip{display:block;height:72px;border-radius:3px;background:var(--swatch);box-shadow:inset 0 0 0 1px rgba(244,241,234,.12)}
.id-swatches code{font-family:var(--mono);font-size:13px;color:var(--muted-2)}
.id-panel--application{grid-column:span 3;min-height:0;background:#0d0d0d}
.id-panel--application img{display:block;width:100%;height:auto}
.id-panel--application figcaption{background:rgba(10,10,10,.75);color:var(--cream);padding:4px 8px;border-radius:2px;left:12px;bottom:12px}

/* Identities page: applications in an editorial layout */
.id-applications{background:var(--cream);color:var(--ink);border-top:1px solid var(--line)}
.id-applications .section-tag{color:var(--ink)}
.id-applications .section-title em{color:var(--brick-on-light)}
.id-applications-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;max-width:1600px;margin:0 auto;list-style:none}
.id-applications-grid figure{margin:0}
.id-applications-grid img{display:block;width:100%;height:auto;border-radius:4px;box-shadow:0 40px 60px -30px rgba(10,10,10,.45)}
.id-applications-grid figcaption{margin-top:14px;font-family:var(--mono);font-size:var(--label);letter-spacing:var(--label-track);text-transform:uppercase;color:var(--ink-muted)}
.id-app--1{grid-column:1/span 6}
.id-app--2{grid-column:8/span 5;margin-top:140px}
.id-app--3{grid-column:2/span 5;margin-top:60px}
.id-app--4{grid-column:8/span 4;margin-top:40px}
.id-app--5{grid-column:3/span 8;margin-top:40px}

@media(prefers-reduced-motion:reduce){
  .id-card{transition:none}
  .id-card:hover,.id-card:focus-visible{transform:none}
  .id-back{transform:none;opacity:0;transition:opacity .2s}
  .id-card:hover .id-back,.id-card:focus-visible .id-back{opacity:1}
  .id-board[open]{animation:none}
}
@media(max-width:1024px){
  .id-board-grid{grid-template-columns:repeat(2,1fr)}
  .id-panel--primary,.id-panel--palette{grid-column:span 2}
  .id-panel--reverse,.id-panel--cards,.id-panel--icon,.id-panel--application{grid-column:span 1}
  .id-applications-grid{grid-template-columns:1fr 1fr}
  .id-applications-grid li{grid-column:auto;margin-top:0}
}
@media(max-width:720px){
  .identities{--gap:8px}
  .id-wall{grid-template-columns:repeat(2,1fr)}
  .id-brick{grid-column:span 1}
  .id-half{display:none}
  .id-back-sector{display:none}
  .id-board-inner{padding:24px 16px}
  .id-board-grid{grid-template-columns:1fr}
  .id-panel--primary,.id-panel--palette,.id-panel--reverse,.id-panel--cards,.id-panel--icon,.id-panel--application{grid-column:1}
  .id-applications-grid{grid-template-columns:1fr}
}
