/* AI collection: the portfolio's Inter / Caveat, blue controls and neutral canvas. */
:root:has(.ai-page-body){color-scheme:light;--paper:#f7f5f2;--bg:#f7f5f2;--ink:#211f24;--muted:#626267;--line:#d6d3d8;--panel:#ededed;--lime:#d6ef4d;--violet:#315fcd;--violet-dark:#2450bd;--ai-blue:#315fcd;--ai-blue-hover:#274fae;--ai-blue-active:#224596;--ai-note:#a83b00;--ai-link:#2450bd}
:root[data-theme=dark]:has(.ai-page-body){color-scheme:dark;--paper:#050505;--bg:#050505;--ink:#f4f4f5;--muted:#a6a4ab;--line:#3f3f43;--panel:#1c1c1c;--ai-note:#ff813b;--ai-link:#9bb7ff}
.ai-page-body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.6 Inter,Arial,sans-serif}
.ai-page-body *{box-sizing:border-box}
.ai-page-body img{display:block;max-width:100%;height:auto}
.ai-page-body a{color:inherit}
.ai-page-body button{font:inherit}
.ai-page-body [hidden]{display:none!important}
.ai-page-body .wrap{width:min(1440px,calc(100% - 64px));margin-inline:auto}
.ai-page-body main{min-width:0}
.ai-page-body .skip{position:fixed;top:8px;left:8px;z-index:2000;padding:12px 18px;background:var(--ai-blue);color:#fff;transform:translateY(-150%)}
.ai-page-body .skip:focus{transform:none}
.ai-page-body :is(h1,h2,h3,p){overflow-wrap:break-word;text-wrap:pretty}
.ai-page-body :is(h1,h2,h3){text-wrap:balance}
.ai-page-body :is(a,button,[tabindex]):focus-visible{outline:3px solid var(--ai-link);outline-offset:5px}
.ai-page-body .topbar :is(a,button):focus-visible,.ai-page-body .footer a:focus-visible{outline-color:#d6ef4d}
html:has(.ai-page-body){scroll-behavior:smooth;scroll-padding-top:calc(var(--portfolio-header-height,160px) + 24px)}
.ai-page{padding-block:48px 64px}
.ai-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:40px;align-items:center}
.ai-kicker{margin:0 0 18px;font-size:12px;font-weight:750;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.ai-hero h1{font-size:clamp(44px,5.8vw,86px);font-weight:750;letter-spacing:-.055em;line-height:1.02;margin:0;max-width:12ch}
.ai-hero h1 span{color:var(--ai-link)}
.ai-lead{margin:24px 0 0;max-width:43em;font-size:clamp(17px,1.5vw,20px);line-height:1.6;color:var(--muted)}
.ai-handwritten{color:var(--ai-note);font:700 clamp(27px,2.7vw,38px)/1.1 'Portfolio Marker',cursive;margin:22px 0}
.ai-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:24px}
.ai-page-body .ai-button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;padding:12px 20px;border:0;border-radius:999px;background:#315fcd;color:#fff;text-decoration:none;font:700 14px/1.4 Inter,Arial,sans-serif;text-align:center}
.ai-page-body .ai-button:hover{background:#274fae;color:#fff}
.ai-page-body .ai-button:active{background:#224596}
.ai-text-link{display:inline-flex;align-items:center;min-height:44px;padding:8px 0;text-decoration:underline;text-underline-offset:5px;font-size:14px;font-weight:650;color:var(--ai-link)!important}
.ai-hero-art{display:grid;grid-template-columns:1.15fr 1fr;gap:14px;align-items:center;margin:0;min-width:0}
.ai-hero-art .ai-image:first-child{grid-row:span 2}
.ai-hero-art img{width:100%}
.ai-image{position:relative;display:block;margin:0;min-width:0}
.ai-page-body img.zoomable{cursor:pointer;transition:transform 180ms ease,filter 180ms ease}
.ai-page-body img.zoomable:hover{transform:scale(.992);filter:brightness(.96)}
.ai-page-body img.zoomable:active{transform:scale(.984);filter:brightness(.92)}
.ai-image figcaption{margin-top:10px;color:var(--muted);font-size:13px;line-height:1.5}
.ai-stats{display:flex;flex-wrap:wrap;gap:14px 28px;align-items:baseline;margin-top:28px;padding-top:20px;border-top:1px solid var(--line);color:var(--muted);font-size:13px}
.ai-stats strong{font-size:24px;line-height:1.2;font-weight:750;color:var(--ink);margin-right:6px}
.ai-tools{margin-top:36px;padding:24px;border-radius:22px;background:var(--panel)}
.ai-tools-head{display:flex;gap:12px 24px;align-items:baseline;justify-content:space-between;flex-wrap:wrap;margin-bottom:16px}
.ai-tools h2{margin:0;font-size:19px;line-height:1.3;letter-spacing:-.025em}
.ai-tools-head p{margin:0;color:var(--muted);font-size:14px}
.ai-tool-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;list-style:none;padding:0;margin:0}
.ai-tool-list li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:4px 10px;align-items:center;min-width:0}
.ai-tool-list img{width:28px;height:28px;object-fit:contain;grid-row:span 2}
.ai-tool-list strong{font-size:14px;line-height:1.45}
.ai-tool-list span{color:var(--muted);font-size:12px;line-height:1.4}
.ai-section{padding:0;margin-top:64px;scroll-margin-top:calc(var(--portfolio-header-height,160px) + 24px)}
.ai-section-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px 32px;flex-wrap:wrap;margin:0 0 28px}
.ai-section-head h2{font-size:clamp(28px,3vw,42px);line-height:1.13;letter-spacing:-.04em;font-weight:750;margin:0}
.ai-section-head p{max-width:42em;margin:0;color:var(--muted);font-size:15px}
.ai-section-index{display:block;margin-bottom:12px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ai-link);font-weight:750}
.ai-process-list{list-style:none;counter-reset:process;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0;padding:0}
.ai-process-list li{counter-increment:process;min-width:0;padding:24px;background:var(--panel);border-radius:22px}
.ai-process-list li:before{content:counter(process,decimal-leading-zero);display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:1px solid var(--ai-link);color:var(--ai-link);font-size:14px;font-weight:750;margin-bottom:20px}
.ai-process-list h3{font-size:19px;line-height:1.3;letter-spacing:-.02em;margin:0 0 12px}
.ai-process-list p{font-size:15px;line-height:1.6;color:var(--muted);margin:0}
.ai-process-list li:last-child{background:#315fcd;color:#fff}
.ai-process-list li:last-child:before{color:#fff;border-color:#fff}
.ai-process-list li:last-child p{color:#fff}
.ai-quality{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:32px;padding:32px;border-radius:22px;background:var(--panel);align-items:start}
.ai-quality h3{margin:0 0 14px;font-size:clamp(24px,2.5vw,32px);letter-spacing:-.03em;line-height:1.2}
.ai-quality p{color:var(--muted);font-size:15px;margin:0 0 16px}
.ai-quality .ai-handwritten{color:var(--ai-note);font-size:30px;margin-bottom:0}
.ai-checks{list-style:none;margin:0;padding:0;display:grid;gap:20px}
.ai-checks li{border-left:3px solid var(--ai-link);padding-left:16px}
.ai-checks strong{display:block;font-size:16px;margin-bottom:6px}
.ai-checks span{display:block;color:var(--muted);font-size:15px}
.ai-series-nav{display:flex;flex-wrap:wrap;gap:8px 20px;margin:0 0 32px}
.ai-series-nav a{font-size:14px;line-height:1.5;text-underline-offset:5px;min-height:38px;display:inline-flex;align-items:center}
.ai-series{margin:0;padding:32px 0;border-top:1px solid var(--line);min-width:0;scroll-margin-top:calc(var(--portfolio-header-height,160px) + 24px)}
.ai-series-head{display:flex;justify-content:space-between;align-items:center;gap:20px 28px;margin-bottom:24px}
.ai-series-head>div{min-width:0;max-width:760px}
.ai-series-head .ai-kicker{margin-bottom:9px}
.ai-series-head h3{margin:0;font-size:clamp(25px,3vw,37px);line-height:1.15;letter-spacing:-.035em}
.ai-series-head p:not(.ai-kicker){margin:12px 0 0;font-size:15px;line-height:1.55;color:var(--muted)}
.ai-series-head .ai-text-link{flex:none}
.ai-featured{display:grid;grid-template-columns:1.2fr 1fr;gap:20px;align-items:center;margin-bottom:24px}
.ai-featured img{width:100%;max-height:590px;object-fit:contain}
.ai-series:nth-of-type(even) .ai-featured{grid-template-columns:1fr 1.2fr}
.ai-ribbon{display:block;overflow-x:auto;position:relative;padding:6px 3px 12px;scrollbar-width:thin}
.ai-ribbon-track{display:flex;width:max-content}
.ai-ribbon-group{display:flex;align-items:center;flex:none;gap:16px;padding-right:16px}
.ai-ribbon-group .ai-image{flex:none}
.ai-ribbon img{height:clamp(240px,24vw,330px);width:auto;max-width:none;object-fit:contain}
.ai-ribbon[data-ready=true]{overflow-x:hidden}
.ai-ribbon[data-ready=true] .ai-ribbon-track{animation:ai-photo-run var(--ai-duration) linear infinite;will-change:transform}
.ai-ribbon[data-paused=true] .ai-ribbon-track,.ai-ribbon:hover .ai-ribbon-track,.ai-ribbon:focus-within .ai-ribbon-track{animation-play-state:paused}
.ai-ribbon-note{font-size:12px;color:var(--muted);margin:8px 0 0}
@keyframes ai-photo-run{to{transform:translateX(calc(-1 * var(--ai-distance)))}}
.ai-videos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 24px;align-items:start}
.ai-video{margin:0;min-width:0}
.ai-video video{display:block;width:100%;height:auto;max-height:600px;background:#151515;border-radius:18px;object-fit:contain}
.ai-video figcaption{padding-top:14px}
.ai-video h3{margin:0 0 7px;font-size:22px;line-height:1.25;letter-spacing:-.025em}
.ai-video p{margin:0;color:var(--muted);font-size:14px}
.ai-video .ai-text-link{font-size:13px;margin-top:4px}
.ai-closing{display:flex;justify-content:space-between;align-items:center;gap:24px;padding-top:32px;border-top:1px solid var(--line)}
.ai-closing h2{font-size:clamp(28px,3vw,40px);letter-spacing:-.04em;line-height:1.15;margin:0 0 12px}
.ai-closing p{margin:0;color:var(--muted);max-width:40em}
.ai-closing .ai-button{flex:none}
.ai-page-body .lightbox{width:min(96vw,1700px);height:94dvh;max-width:none;max-height:94dvh;padding:64px 20px 20px;border:0;background:#151515;color:#fff}
.ai-page-body .lightbox::backdrop{background:rgba(0,0,0,.88)}
.ai-page-body .lightbox img{width:100%;height:100%;object-fit:contain;cursor:pointer}
.ai-page-body .lightbox button{position:absolute;top:12px;right:16px;border:0;border-radius:999px;padding:10px 18px;background:#315fcd;color:#fff;font:700 14px/1.4 Inter,Arial,sans-serif;min-height:44px;cursor:pointer}
.ai-page-body .lightbox button:hover{background:#274fae}
.ai-page-body .lightbox :focus-visible{outline-color:#d6ef4d}
.ai-page-body:has(.lightbox[open]){overflow:hidden}
.ai-page-body .footer{margin:0}
.ai-page-body .case-return-top-link{background:#315fcd;color:#fff}
.ai-page-body .case-return-top-link:hover{background:#274fae;color:#fff}
.ai-page-body .case-return-top-link:active{background:#224596}
@media(min-width:1600px){.ai-hero{gap:56px}}
@media(max-width:1000px){.ai-hero{grid-template-columns:1fr;gap:32px}.ai-hero h1{max-width:15ch}.ai-hero-art{grid-template-columns:1fr 1fr 1fr;align-items:center;gap:16px}.ai-hero-art .ai-image:first-child{grid-row:auto}.ai-tool-list{grid-template-columns:repeat(3,minmax(0,1fr))}.ai-process-list{grid-template-columns:repeat(2,minmax(0,1fr))}.ai-quality{grid-template-columns:1fr}.ai-videos{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.ai-page-body .wrap{width:calc(100% - 32px)}.ai-page{padding-block:32px 44px}.ai-section{margin-top:44px}.ai-hero{gap:26px}.ai-hero h1{font-size:clamp(42px,9vw,58px)}.ai-hero-art{gap:10px}.ai-hero-art .ai-image:first-child{grid-row:span 2}.ai-hero-art{grid-template-columns:1.2fr 1fr}.ai-lead{font-size:17px;margin-top:20px}.ai-handwritten{font-size:28px}.ai-tools{padding:20px;margin-top:28px}.ai-tool-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 14px}.ai-process-list{grid-template-columns:minmax(0,1fr);gap:12px}.ai-process-list li{padding:22px}.ai-process-list li:before{margin-bottom:16px}.ai-quality{padding:22px;gap:24px}.ai-section-head{margin-bottom:24px}.ai-series-head{align-items:flex-start;flex-direction:column;gap:10px}.ai-featured,.ai-series:nth-of-type(even) .ai-featured{grid-template-columns:1fr;gap:16px}.ai-featured img{max-height:none}.ai-ribbon img{height:260px}.ai-ribbon-group{gap:12px;padding-right:12px}.ai-series{padding-block:24px}.ai-series-nav{gap:4px 16px;margin-bottom:24px}.ai-videos{grid-template-columns:minmax(0,1fr);gap:28px}.ai-video video{max-height:none}.ai-closing{align-items:flex-start;flex-direction:column}.ai-stats{gap:12px 20px}.ai-stats strong{font-size:22px}.ai-page-body .lightbox{padding:64px 12px 12px}}
@media(prefers-reduced-motion:reduce){html:has(.ai-page-body){scroll-behavior:auto}.ai-page-body *, .ai-page-body *:before,.ai-page-body *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.ai-page-body img.zoomable:hover,.ai-page-body img.zoomable:active{transform:none}.ai-ribbon[data-ready=true]{overflow-x:auto}.ai-ribbon-group[aria-hidden=true]{display:none}}

/* Version 11 home: one neutral entry panel, a staggered photo collage and blue action. */
#portfolio .portfolio-ai-feature{
  display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  align-items:center;gap:clamp(28px,4vw,56px);margin:0;
  padding:clamp(24px,3.5vw,44px);border:0;border-radius:28px;
  color:#211f24;background:#f0f0f2;text-decoration:none;min-width:0;
}
html[data-theme="dark"] #portfolio .portfolio-ai-feature{color:#f4f4f5;background:#202023}
#portfolio .portfolio-ai-preview{
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));
  align-items:end;min-width:0;width:min(100%,340px);margin-inline:auto;
  padding:12px 10px 20px;isolation:isolate;
}
#portfolio .portfolio-ai-preview img{
  grid-row:1;display:block;width:100%;height:auto;max-width:100%;
  border:0;border-radius:18px;box-shadow:none;cursor:pointer;
}
#portfolio .portfolio-ai-preview img:first-child{grid-column:1/9;transform:rotate(-4deg);transform-origin:50% 70%;z-index:1}
#portfolio .portfolio-ai-preview img:last-child{grid-column:8/-1;transform:translateY(8px) rotate(5deg);transform-origin:50% 70%;z-index:2}
#portfolio .portfolio-ai-copy{min-width:0}
#portfolio .portfolio-ai-copy h2{margin:0;font:750 clamp(28px,2.8vw,40px)/1.15 Inter,Arial,sans-serif;letter-spacing:-.035em;color:inherit;hyphens:none;overflow-wrap:break-word}
#portfolio .portfolio-ai-copy p{max-width:43ch;margin:16px 0 0;font:400 17px/1.6 Inter,Arial,sans-serif;color:#55535d;overflow-wrap:break-word}
html[data-theme="dark"] #portfolio .portfolio-ai-copy p{color:#c6c4ca}
#portfolio .portfolio-ai-link{
  display:inline-flex;align-items:center;justify-content:center;gap:12px;
  min-height:48px;max-width:100%;margin-top:24px;padding:12px 20px;
  border:0;border-radius:999px;background:#315fcd;color:#fff;
  font:650 15px/1.5 Inter,Arial,sans-serif;text-decoration:none;
  transition:background-color 180ms ease;
}
#portfolio .portfolio-ai-link>span{flex:none}
#portfolio .portfolio-ai-feature:hover .portfolio-ai-link{background:#274fae}
#portfolio .portfolio-ai-feature:active .portfolio-ai-link{background:#224596}
#portfolio .portfolio-ai-feature:focus-visible{outline:3px solid #315fcd;outline-offset:6px}
html[data-theme="dark"] #portfolio .portfolio-ai-feature:focus-visible{outline-color:#9bb7ff}
@media(max-width:800px){
  #portfolio .portfolio-ai-feature{grid-template-columns:minmax(0,1fr);gap:24px}
  #portfolio .portfolio-ai-preview{width:min(100%,320px)}
  #portfolio .portfolio-ai-copy{width:100%;max-width:560px;justify-self:center}
  #portfolio .portfolio-ai-copy p{max-width:none}
}
@media(max-width:500px){
  #portfolio .portfolio-ai-feature{padding:22px 20px;border-radius:22px;gap:20px}
  #portfolio .portfolio-ai-preview{width:min(100%,280px)}
  #portfolio .portfolio-ai-preview img{border-radius:14px}
  #portfolio .portfolio-ai-copy h2{font-size:28px}
  #portfolio .portfolio-ai-copy p{font-size:16px;margin-top:12px}
  #portfolio .portfolio-ai-link{margin-top:20px;padding-inline:18px}
}
@media(prefers-reduced-motion:reduce){
  #portfolio .portfolio-ai-link{transition:none}
}