@font-face{font-family:'Inter Tight';font-style:normal;font-weight:500;font-display:block;src:url('fonts/inter-tight-500.ttf') format('truetype')}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:600;font-display:block;src:url('fonts/inter-tight-600.ttf') format('truetype')}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:700;font-display:block;src:url('fonts/inter-tight-700.ttf') format('truetype')}
html{color-scheme:light;background:#cbe878}body{margin:0;background:#cbe878}

#alan-block-study .preview-controls{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
#alan-block-study .viewport{max-width:1024px;width:100%;margin:auto;container-type:inline-size;container-name:alan-block-frame}
#alan-block-study .portfolio{--page:light-dark(#cbe878,#9cb84f);--block:light-dark(#ffffff,#151713);--ink:light-dark(#171b13,#f6f8ef);--muted:light-dark(#3d4931,#b5d281);background:var(--page);color:var(--ink);padding:12px;font-family:'Inter Tight','Helvetica Neue',Arial,sans-serif;min-height:0;box-sizing:border-box}
#alan-block-study .portfolio *{box-sizing:border-box}
#alan-block-study .menu{display:grid;grid-template-columns:1.4fr 1.55fr 1.35fr 1.1fr;gap:8px;align-items:start}
#alan-block-study .menu-block{background:var(--block);padding:12px 13px 14px;min-width:0}
#alan-block-study .menu h1,#alan-block-study .menu p,#alan-block-study .menu a{margin:0;font-size:clamp(19px,2.5cqw,27px);line-height:1.08;letter-spacing:-1.05px;font-weight:700;color:var(--ink);text-decoration:none;display:block;overflow-wrap:normal}
#alan-block-study .menu .location{color:var(--muted);margin-top:13px}
#alan-block-study .menu .muted{color:var(--muted)}
#alan-block-study .menu a:hover{text-decoration:underline;text-underline-offset:3px}
#alan-block-study .project-area{padding-top:100px}
#alan-block-study .gallery{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#alan-block-study figure{margin:0;min-width:0;position:relative;background:transparent}
#alan-block-study img{width:100%;height:auto;aspect-ratio:1.5;object-fit:cover;display:block}
#alan-block-study figcaption{position:absolute;top:18px;left:18px;right:18px;pointer-events:none;font-size:clamp(32px,4.5cqw,50px);font-weight:700;letter-spacing:-1.8px;line-height:1.2}#alan-block-study figcaption a{color:#fff;background:#111;padding:2px 9px 5px;text-decoration:none;box-decoration-break:clone;-webkit-box-decoration-break:clone;pointer-events:auto}#alan-block-study figcaption a:hover{color:#cbe878}#alan-block-study .project-detail{padding:20px 13px;background:var(--block);margin-top:8px}#alan-block-study .project-detail p{font-size:16px;line-height:1.5;margin:0}#alan-block-study .project-detail[hidden]{display:none}
#alan-block-study .other{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
#alan-block-study .other div{padding:13px;background:var(--block);font-size:23px;line-height:1.1;font-weight:700;letter-spacing:-.7px}
@container alan-block-frame(max-width:850px){#alan-block-study .menu{grid-template-columns:1fr 1fr}#alan-block-study .menu h1,#alan-block-study .menu p,#alan-block-study .menu a{font-size:25px;letter-spacing:-.8px}#alan-block-study .project-area{padding-top:65px}}
@container alan-block-frame(max-width:500px){#alan-block-study .portfolio{padding:8px;min-height:0}#alan-block-study .menu{gap:6px}#alan-block-study .menu-block{padding:11px}#alan-block-study .menu h1,#alan-block-study .menu p,#alan-block-study .menu a{font-size:20px;letter-spacing:-.6px;line-height:1.12}#alan-block-study .project-area{padding-top:46px}#alan-block-study .gallery{grid-template-columns:1fr;gap:8px}#alan-block-study figcaption{font-size:36px;top:14px;left:14px;right:14px;letter-spacing:-1.3px}#alan-block-study .other div{font-size:26px}#alan-block-study .other{grid-template-columns:1fr}}

#alan-block-study .menu .menu-block{background:#fff}
#alan-block-study .menu .menu-block h1,
#alan-block-study .menu .menu-block p{color:#171b13}
#alan-block-study .menu nav.menu-block a,
#alan-block-study .menu > .menu-block:last-child p{color:var(--page)}
#alan-block-study .menu nav.menu-block a:hover{text-decoration:underline;text-underline-offset:3px}
#alan-block-study .menu .contact-links a{color:var(--page);white-space:nowrap;font-size:clamp(18px,2.3cqw,25px);letter-spacing:-.8px}
#alan-block-study #alan-about,#alan-block-study #alan-download{background:var(--block);padding:24px;margin-top:8px;max-width:100%}
#alan-block-study #alan-about h2{font:700 28px/1.1 'Inter Tight',Arial,sans-serif;margin:0 0 18px}
#alan-block-study #alan-about p,#alan-block-study #alan-download p{font:500 17px/1.5 'Inter Tight',Arial,sans-serif;max-width:650px;margin:0 0 14px}
#alan-block-study #alan-about a{color:var(--ink)}

#alan-block-study .mobile-header{display:none}
#alan-block-study .portfolio{min-height:0}
#alan-block-study a:focus-visible{outline:3px solid #111;outline-offset:4px}
@container alan-block-frame (min-width:601px) and (max-width:850px){
  #alan-block-study .menu{grid-template-columns:1fr 1fr}
  #alan-block-study .menu nav[aria-label="Projects"]{display:block}
  #alan-block-study .menu h1,#alan-block-study .menu p,#alan-block-study .menu a{font-size:25px}
  #alan-block-study .menu .contact-links a{font-size:23px;line-height:1.25}
  #alan-block-study .project-area{padding-top:48px}
}
@container alan-block-frame (max-width:600px){
  #alan-block-study .portfolio{padding:8px}
  #alan-block-study .menu{display:none}
  #alan-block-study .mobile-header{display:block}
  #alan-block-study .mobile-identity{background:#fff;color:#171b13;padding:18px 16px 16px}
  #alan-block-study .mobile-topline{display:flex;justify-content:space-between;align-items:start;gap:16px}
  #alan-block-study .mobile-topline h1{font-family:inherit;font-size:clamp(48px,14cqw,72px);font-weight:700;line-height:.92;letter-spacing:-2.7px;margin:0}
  #alan-block-study .mobile-topline p{font-size:15px;font-weight:600;line-height:1.15;letter-spacing:-.4px;margin:2px 0 0}
  #alan-block-study .mobile-role{font-size:19px;line-height:1.2;font-weight:600;letter-spacing:-.5px;margin:24px 0 0}
  #alan-block-study .mobile-links{display:grid;grid-template-columns:.8fr 1fr 1.4fr;gap:6px;margin-top:6px}
  #alan-block-study .mobile-links a{display:flex;align-items:center;justify-content:center;background:#fff;color:var(--page);font-family:inherit;font-size:16px;font-weight:700;line-height:1.2;letter-spacing:-.5px;min-height:48px;padding:12px 5px;text-decoration:none;white-space:nowrap}
  #alan-block-study .mobile-links a:hover{text-decoration:underline;text-underline-offset:4px}
  #alan-block-study .project-area{padding-top:28px}
  #alan-block-study .gallery{grid-template-columns:1fr;gap:12px}
  #alan-block-study .gallery figure>img{aspect-ratio:1.08;object-fit:cover}
  #alan-block-study figcaption{inset:auto 14px 17px;font-size:clamp(31px,9.2cqw,47px);line-height:1.19;letter-spacing:-1.3px;max-width:90%}
  #alan-block-study figcaption a{padding:3px 8px 4px}
  #alan-block-study #alan-about,#alan-block-study #alan-download{padding:20px 16px}
  #alan-block-study .project-detail{padding:18px 14px}
}

@container alan-block-frame (max-width:600px){
  #alan-block-study .mobile-location{font-size:17px;line-height:1.25;font-weight:500;letter-spacing:-.35px;margin:6px 0 0;color:#171b13}
  #alan-block-study .mobile-links{background:#fff;gap:0;grid-template-columns:.85fr 1fr 1.35fr;padding:0 7px}
  #alan-block-study .mobile-links a{background:transparent;min-height:52px;padding:14px 4px}
}

@container alan-block-frame (max-width:600px){
  #alan-block-study .mobile-header,
  #alan-block-study .mobile-header h1,
  #alan-block-study .mobile-header p,
  #alan-block-study .mobile-header a{font-family:'Inter Tight','Helvetica Neue',Arial,sans-serif;font-weight:700}
}

@container alan-block-frame (max-width:600px){
  #alan-block-study .mobile-header h1,
  #alan-block-study .mobile-header .mobile-role,
  #alan-block-study .mobile-header .mobile-location,
  #alan-block-study .mobile-header a{font-size:24px;font-weight:700;line-height:1.08;letter-spacing:-.8px}
  #alan-block-study .mobile-topline h1 br{display:none}
  #alan-block-study .mobile-topline h1{white-space:normal}
  #alan-block-study .mobile-links{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:0 20px;padding:8px 16px}
  #alan-block-study .mobile-links a{padding:8px 0;min-height:44px}
}

/* Shared visual rules: breakpoints only rearrange the composition. */
#alan-block-study .portfolio .menu h1,
#alan-block-study .portfolio .menu p,
#alan-block-study .portfolio .menu a,
#alan-block-study .portfolio .mobile-header h1,
#alan-block-study .portfolio .mobile-header p,
#alan-block-study .portfolio .mobile-header a{
 font-family:'Inter Tight','Helvetica Neue',Arial,sans-serif;
 font-size:24px;font-weight:700;line-height:1.08;letter-spacing:-.8px;
}
#alan-block-study .portfolio .menu .location,
#alan-block-study .portfolio .mobile-location{color:#171b13}
#alan-block-study .portfolio figcaption{
 top:18px;left:18px;right:18px;bottom:auto;
 font-size:44px;font-weight:700;line-height:1.2;letter-spacing:-1.8px;max-width:none;
}
#alan-block-study .portfolio figcaption a{padding:2px 9px 5px}
#alan-block-study .portfolio .gallery figure>img{aspect-ratio:1.5;object-fit:cover}
#alan-block-study .portfolio .menu-block,
#alan-block-study .portfolio .mobile-identity,
#alan-block-study .portfolio .mobile-links{background:#fff;color:#171b13}
#alan-block-study .portfolio .menu a,
#alan-block-study .portfolio .mobile-links a{color:var(--page)}

#alan-block-study .portfolio .menu > .menu-block:nth-child(2) p,
#alan-block-study .portfolio .mobile-header .mobile-role,
#alan-block-study .portfolio .mobile-header .mobile-location{font-size:20px}

#alan-block-study .portfolio .menu > .menu-block:nth-child(2) p,
#alan-block-study .portfolio .mobile-header .mobile-role,
#alan-block-study .portfolio .mobile-header .mobile-location{line-height:1.08}
#alan-block-study .portfolio .menu > .menu-block:nth-child(2) .location,
#alan-block-study .portfolio .mobile-header .mobile-location{margin:8px 0 0}
@container alan-block-frame (max-width:600px){
  #alan-block-study .portfolio .mobile-header .mobile-role{margin:12px 0 0}
}

#alan-block-study .portfolio,
#alan-block-study .portfolio *{font-size:24px !important}

#alan-block-study .portfolio .gallery figcaption,
#alan-block-study .portfolio .gallery figcaption a{font-size:44px !important}

@container alan-block-frame (max-width:600px){
  #alan-block-study .portfolio .mobile-identity{padding:12px 13px 14px}
  #alan-block-study .portfolio .mobile-header .mobile-role,
  #alan-block-study .portfolio .mobile-header .mobile-location{margin:0;line-height:1.08}
  #alan-block-study .portfolio .mobile-links{display:flex;flex-direction:column;align-items:flex-start;gap:0;padding:12px 13px 14px;margin-top:8px}
  #alan-block-study .portfolio .mobile-links a{display:block;padding:0;min-height:0;line-height:1.08}
}

@container alan-block-frame (max-width:600px){
  #alan-block-study .portfolio .mobile-links{flex-direction:row;flex-wrap:nowrap;justify-content:space-between;align-items:center;gap:8px;padding:12px 8px 14px}
  #alan-block-study .portfolio .mobile-links a{white-space:nowrap;letter-spacing:-1.1px}
}

#alan-block-study .viewport{max-width:1024px}

/* Match the spacing between the header and page content. */
#alan-block-study #alan-about{margin-top:100px}
@container alan-block-frame (min-width:601px) and (max-width:850px){
  #alan-block-study #alan-about{margin-top:48px}
}
@container alan-block-frame (max-width:600px){
  #alan-block-study #alan-about{margin-top:28px}
}

/* Name returns home; the active About link toggles back to the gallery. */
#alan-block-study .portfolio .menu .home-link,
#alan-block-study .portfolio .mobile-header .home-link{color:#171b13;text-decoration:none}
#alan-block-study .portfolio .home-link:hover{text-decoration:underline;text-underline-offset:3px}
#alan-block-study .portfolio a.about-link.is-active{color:#111;background:var(--page);text-decoration:none}
#alan-block-study .portfolio .contact-links a.about-link{width:fit-content;padding-inline:5px;margin-inline:-5px}
#alan-block-study .portfolio .mobile-links a.about-link{padding-inline:5px;margin-inline:-5px}

/* Shared fixed menu and case content, matching the approved preview. */
#alan-block-study .menu,#alan-block-study .mobile-header{position:sticky;top:0;z-index:20;background:var(--page);padding-bottom:8px}
#alan-block-study .case-page{background:#fff;color:#171b13;margin-top:100px;padding:24px}
#alan-block-study .case-page h1{font-size:44px!important;line-height:1.1;margin:0 0 30px;font-weight:700;letter-spacing:-1.8px}
#alan-block-study .case-page h2{font-weight:700;margin:32px 0 12px;line-height:1.15;letter-spacing:-.8px}
#alan-block-study .case-page p{line-height:1.5;margin:0 0 22px;max-width:760px}
#alan-block-study .case-page figure{margin:24px 0}
#alan-block-study .case-page img{width:100%;height:auto;aspect-ratio:auto;object-fit:contain}
#alan-block-study .case-page a{color:#171b13}
#alan-block-study .case-page video,#alan-block-study .case-page iframe{max-width:100%}
#alan-block-study .case-page video{height:auto}
#alan-block-study .portfolio .menu a[aria-current="page"],
#alan-block-study .portfolio .mobile-header a[aria-current="page"]{background:var(--page)!important;color:#111!important;text-decoration:none;width:fit-content;box-shadow:0 0 0 3px var(--page)}
#alan-block-study .portfolio .menu a.home-link,
#alan-block-study .portfolio .mobile-header a.home-link{background:transparent!important;color:#171b13!important;box-shadow:none!important}
@container alan-block-frame(max-width:850px){#alan-block-study .case-page{margin-top:48px}}
@container alan-block-frame(max-width:600px){#alan-block-study .case-page{margin-top:28px;padding:20px 16px}}

/* Approved case typography: section headings match the menu; body matches About. */
#alan-block-study .portfolio .case-page{
 font-family:'Inter Tight','Helvetica Neue',Arial,sans-serif;
 font-size:24px!important;font-weight:500;line-height:1.5;letter-spacing:normal;
}
#alan-block-study .portfolio .case-page p,
#alan-block-study .portfolio .case-page li{
 font-family:inherit;font-size:24px!important;font-weight:500;line-height:1.5;letter-spacing:normal;
}
#alan-block-study .portfolio .case-page h2{
 font-family:inherit;font-size:24px!important;font-weight:700;line-height:1.08;letter-spacing:-.8px;
}
#alan-block-study .portfolio .case-page h1{
 font-family:inherit;font-size:44px!important;font-weight:700;line-height:1.1;letter-spacing:-1.8px;
}

/* Slide the shared menu out while scrolling down; show it on upward scroll. */
#alan-block-study .menu,
#alan-block-study .mobile-header{transform:translateY(0);transition:transform 200ms ease-out;will-change:transform}
#alan-block-study.is-menu-hidden .menu,
#alan-block-study.is-menu-hidden .mobile-header{transform:translateY(calc(-100% - 12px));pointer-events:none}
@media(prefers-reduced-motion:reduce){#alan-block-study .menu,#alan-block-study .mobile-header{transition:none}}

/* Static page colors: applied before the first paint, with no cross-page animation. */
html{--portfolio-theme-color:#cbe878}
html[data-theme="galaxy-xr"]{--portfolio-theme-color:#b9cbd8}
html,body{background:var(--portfolio-theme-color)}
#alan-block-study .portfolio{--page:var(--portfolio-theme-color);background:var(--page)}

/* The whole project banner is a single accessible link. */
#alan-block-study .gallery .case-banner{display:block;position:relative;text-decoration:none;color:#fff}
#alan-block-study .gallery .case-caption{position:absolute;top:18px;left:18px;right:18px;font-size:44px!important;font-weight:700;line-height:1.2;letter-spacing:-1.8px}
#alan-block-study .gallery .case-title{font-size:44px!important;color:#fff;background:#111;padding:2px 9px 5px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
#alan-block-study .gallery .case-banner:hover .case-title{color:var(--page)}

/* Bold inset border without changing banner geometry. */
#alan-block-study .gallery .case-banner::after{content:"";position:absolute;inset:0;border:8px solid #111;box-sizing:border-box;pointer-events:none;opacity:0;z-index:2}
@media(hover:hover) and (pointer:fine){#alan-block-study .gallery .case-banner:hover::after{opacity:1}}
#alan-block-study .gallery .case-banner:focus-visible::after{opacity:1}

/* Approved footer: smaller bold type and generous separation from content. */
#alan-block-study .site-footer{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:20px;margin-top:120px;padding:0 1px 10px;color:#171b13;line-height:1.08}
#alan-block-study .portfolio .site-footer,
#alan-block-study .portfolio .site-footer *{font-size:18px!important;font-weight:700;letter-spacing:-.4px}
#alan-block-study .site-footer a{color:inherit;text-decoration:none}
#alan-block-study .site-footer a:hover{text-decoration:underline;text-underline-offset:3px}
@container alan-block-frame(max-width:600px){#alan-block-study .site-footer{margin-top:80px;gap:16px}}