:root{--ink:#121212;--paper:#f2f1ed;--light-text:#f5f4f0}
.ref-hero,.inner-reference-hero{background:var(--ink);color:var(--light-text);isolation:isolate}
.ref-hero:before,.inner-reference-hero:before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 65% 40%,#d1f47019,transparent 55%);pointer-events:none;z-index:-1}
.ref-hero .hero-lines i,.inner-reference-hero .hero-lines i{background:#ffffff26}
.ref-hero .hero-title h1,.inner-reference-hero h1{color:var(--light-text)}
.hero-emblem{filter:drop-shadow(12px 22px 0 #61752d);perspective:900px}
.hero-emblem svg{transform-origin:center;animation:ciardi-sculpture 11s ease-in-out infinite}
.hero-emblem.pulse svg{animation:heart-bounce .6s cubic-bezier(.3,.8,.4,1.4)}
@keyframes ciardi-sculpture{0%,100%{transform:rotateY(-17deg) rotateZ(-8deg) translateY(0)}50%{transform:rotateY(22deg) rotateZ(9deg) translateY(-16px)}}
.hero-review>span,.hero-review small{color:#bdbdbd}.hero-review>a,.hero-review strong{color:var(--light-text)}.hero-review b{color:#d1f470}.diagonal-caption{color:#bbb;background:var(--ink)}
.inner-scroll{color:var(--light-text)}
body.dark-hero #headerwrap:not(.scrolled){color:var(--light-text)}
body.dark-hero #headerwrap:not(.scrolled) .brand,body.dark-hero #headerwrap:not(.scrolled) #main-nav>a{color:var(--light-text)}
.ref-intro{background:var(--paper)}
.ref-services{background:var(--ink);color:var(--light-text)}
.ref-services .service-sticky{padding-top:150px;padding-bottom:150px}
.ref-services .service-tabs button{color:#999;transition:color .25s,translate .35s}
.ref-services .service-tabs button:hover{color:#ddd;translate:8px 0}
.ref-services .service-tabs button[aria-selected=true]{color:var(--light-text)}
.ref-services .service-tags{border-color:#555}.ref-services .service-tags a{background:#292929;color:#e7e7e7;transition:background .25s}
.ref-services .service-tags a:hover{background:#444}.ref-services .service-panels .text-link{border-color:#666;color:#dcff86}
.ref-showcase{background:var(--paper);padding-top:80px}.ref-services+.ref-showcase{padding-top:80px}
.reference-clients{background:var(--paper)}
.reference-clients a{color:#626262}
.reference-quote{background:var(--ink);padding-top:110px;padding-bottom:110px}
.reference-quote blockquote{color:#f5f4f0}
.reference-quote .quote-word{color:#747474;transition:color .25s}
.reference-quote .quote-word.lit{color:var(--light-text)}
.reference-quote .quote-word.lit:nth-child(5n){color:#dcff86}
.ref-work-label,.site-content .reference-projects{background:var(--ink);color:var(--light-text)}
.ref-work-label{padding-top:75px}.reference-projects a{color:var(--light-text)}
.reference-projects img{transition:transform .8s cubic-bezier(.2,.7,.3,1),filter .6s}
.reference-projects .module_column>a{display:block;overflow:hidden}
.reference-projects .module_column>a:hover img{transform:scale(1.035);filter:saturate(1.15)}
.reference-projects h3{transition:translate .3s,color .3s}.reference-projects a:hover h3{translate:6px 0;color:#dcff86}
.reference-faq{padding-top:80px}.reference-faq details[open]{background:var(--paper)}
.nav-contact,.contact-submit{transition:background .25s,transform .25s}.nav-contact:hover,.contact-submit:hover{transform:translateY(-2px)}
.reference-strip:hover>div,.ticker:hover>div{animation-play-state:paused}

.motion-paused .hero-emblem svg,.motion-paused .reference-strip>div,.motion-paused .ticker>div{animation-play-state:paused}
@media(max-width:1050px){body.dark-hero #headerwrap.menu-open:not(.scrolled){background:var(--ink);color:white}body.dark-hero #headerwrap:not(.scrolled) #main-nav{background:var(--ink);color:white}body.dark-hero #headerwrap:not(.scrolled) #main-nav .service-menu a{color:white}}
@media(max-width:650px){.ref-services .service-sticky{padding-top:100px;padding-bottom:100px}.ref-services+.ref-showcase{padding-top:40px}.reference-quote{padding-top:70px;padding-bottom:70px}.hero-emblem{filter:drop-shadow(6px 12px 0 #61752d)}}
@media(prefers-reduced-motion:reduce){.hero-emblem svg{animation:none}.reference-quote .quote-word{color:var(--light-text)}.reference-projects img,.reference-projects h3,.nav-contact,.service-tabs button{transition:none}}

.hero-emblem{width:clamp(170px,18vw,310px);filter:drop-shadow(7px 12px 0 #61752d)}.hero-emblem .symbol-spark{transform-box:fill-box;transform-origin:center;animation:spark-turn 11s ease-in-out infinite}@keyframes spark-turn{0%,100%{transform:translateX(0)}50%{transform:translateX(3px)}}.motion-paused .symbol-spark{animation-play-state:paused}@media(prefers-reduced-motion:reduce){.hero-emblem .symbol-spark{animation:none}}

/* Original transparent portrait stays in front of the full-width ticker. */
.ref-feature.portrait-stage{display:flex;justify-content:center;align-items:flex-end;isolation:isolate;position:relative;margin-top:-75px;padding:0 8vw;gap:7vw;min-height:0;background:transparent;overflow:visible}
.portrait-stage:before{content:'';position:absolute;inset:75px 0 0;background:var(--paper);z-index:-1}
.portrait-cutout{position:relative;z-index:2;display:block;width:auto;height:clamp(420px,44vw,680px);max-width:52%;object-fit:contain;object-position:bottom;flex-shrink:0;pointer-events:none}
.portrait-stage .ticker{position:absolute;left:0;right:0;top:35%;z-index:1;padding:19px 0;font-size:20px;background:#151515;color:#f5f4f0}
.portrait-caption{position:relative;z-index:3;align-self:flex-end;padding:0 0 70px;max-width:430px;color:#121212}
.portrait-caption h2{font-size:clamp(32px,3vw,48px);margin:0 0 18px}.portrait-caption p{font-size:18px;line-height:1.5;margin:0 0 28px}.portrait-caption .text-link{font-size:18px}
@media(max-width:800px){.ref-feature.portrait-stage{padding:0 5vw;gap:4vw}.portrait-cutout{height:430px;max-width:55%}.portrait-caption{padding-bottom:40px}.portrait-caption h2{font-size:30px}.portrait-stage .ticker{font-size:18px}}
@media(max-width:540px){.ref-feature.portrait-stage{display:flex;flex-direction:column;align-items:center;margin-top:-45px;padding:0 22px;gap:0}.portrait-stage:before{inset:45px 0 0}.portrait-cutout{height:auto;width:100%;max-width:360px}.portrait-stage .ticker{top:29%;font-size:17px;padding:15px 0}.portrait-caption{align-self:stretch;padding:35px 0 25px;max-width:none}.portrait-caption h2{font-size:32px}.portrait-caption p{font-size:17px;margin-bottom:18px}}

/* Biography alongside the portrait; ticker aligned with the hero boundary. */
.portrait-stage .ticker{top:75px}.portrait-caption{align-self:flex-end;padding:175px 0 60px;max-width:560px}.portrait-caption>p{font-size:clamp(20px,1.65vw,28px);line-height:1.4;letter-spacing:-.025em;margin:0}.portrait-caption>p>a{display:block;margin-top:25px;font-size:18px;letter-spacing:0;color:var(--cds-accent)}
@media(max-width:800px){.portrait-caption{padding-top:175px;padding-bottom:30px}.portrait-caption>p{font-size:20px}}
@media(max-width:540px){.portrait-stage .ticker{top:45px}.portrait-caption{align-self:stretch;padding:30px 0 15px;max-width:none}.portrait-caption>p{font-size:20px}.portrait-caption>p>a{font-size:17px;margin-top:20px}}

/* Seamless duplicated track, separate from the portrait silhouette. */
.ref-feature.portrait-stage{margin-top:0;padding-top:140px;background:var(--paper)}.portrait-stage:before{display:none}.portrait-stage .ticker{top:0}.portrait-stage .ticker>div{display:flex;width:max-content;gap:0;animation:portrait-ticker 90s linear infinite}.portrait-stage .ticker-copy{display:block;flex:0 0 auto;white-space:nowrap}.portrait-stage .ticker b{display:inline-block;padding:0 26px}@keyframes portrait-ticker{to{transform:translateX(-50%)}}
.portrait-stage .portrait-caption{padding-top:30px;padding-bottom:clamp(125px,11vw,170px)}
.ref-services .service-tabs button{font-size:clamp(40px,3.4vw,64px);line-height:1.12}.ref-services .service-tabs{gap:18px}
@media(max-width:1050px){.ref-services .service-layout{grid-template-columns:54% 46%}.ref-services .service-tabs button{font-size:40px}}
@media(max-width:800px){.portrait-stage .portrait-caption{padding-top:25px;padding-bottom:30px}.ref-services .service-tabs button{font-size:38px;padding:5px 0}.ref-services .service-tabs{gap:10px}}
@media(max-width:540px){.ref-feature.portrait-stage{margin-top:0;padding-top:115px}.portrait-stage .ticker{top:0}.portrait-stage .portrait-caption{padding:30px 0 15px}.ref-services .service-tabs button{font-size:clamp(32px,8.5vw,40px)}}
.motion-paused .portrait-stage .ticker>div{animation-play-state:paused}@media(prefers-reduced-motion:reduce){.portrait-stage .ticker>div{animation:none}}

/* Lime accent: dark lettering on bright fills, readable green on light sections. */
:root{--lime:#d1f470;--lime-ink:#527000}
body #headerwrap #main-nav .nav-contact,.form-section .contact-submit,.floating-contact{background:var(--lime);color:#121212}
body #headerwrap #main-nav .nav-contact:hover,.form-section .contact-submit:hover,.floating-contact:hover{background:#dcff86;color:#121212}
.ref-showcase .text-link,.portrait-caption a,.inner-description a,.editorial-section .text-link{color:var(--lime-ink)}
body.dark-hero #headerwrap:not(.scrolled) #main-nav>a.nav-contact,body #headerwrap.scrolled #main-nav>a.nav-contact{color:#121212}

/* Light surfaces: dark text over a lime underline that grows on interaction. */
.portrait-caption>p>a,
.ref-showcase .text-link,
.ref-intro a,
.editorial-section .text-link,
.editorial-copy p a{
 color:var(--ink);
 width:fit-content;
 max-width:100%;
 padding:2px 3px 4px;
 text-decoration:none;
 background-image:linear-gradient(var(--lime),var(--lime));
 background-position:0 100%;
 background-size:100% 3px;
 background-repeat:no-repeat;
 box-decoration-break:clone;
 -webkit-box-decoration-break:clone;
 transition:background-size .22s ease,color .22s ease;
}
.portrait-caption>p>a:is(:hover,:focus-visible),
.ref-showcase .text-link:is(:hover,:focus-visible),
.ref-intro a:is(:hover,:focus-visible),
.editorial-section .text-link:is(:hover,:focus-visible),
.editorial-copy p a:is(:hover,:focus-visible){
 color:var(--ink);
 background-size:100% 100%;
}
.portrait-caption>p>a:focus-visible,
.ref-showcase .text-link:focus-visible,
.ref-intro a:focus-visible,
.editorial-section .text-link:focus-visible,
.editorial-copy p a:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
@media(prefers-reduced-motion:reduce){.portrait-caption>p>a,.ref-showcase .text-link,.ref-intro a,.editorial-section .text-link,.editorial-copy p a{transition:none}}

/* Selected portfolio: compact image mosaic beside the larger editorial title. */
.ref-showcase.showcase-selection{
 display:grid;
 grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);
 gap:clamp(35px,5vw,90px);
 align-items:center;
 padding:125px var(--pad) 100px;
}
.ref-showcase.showcase-selection>.showcase-grid{
 display:grid;
 grid-template-columns:repeat(3,minmax(0,1fr));
 gap:12px;
 padding:0;
 min-width:0;
}
.showcase-grid .showcase-tile{position:relative;display:block;overflow:hidden;aspect-ratio:1;background:#fff;color:#fff}
.showcase-grid .showcase-tile img{display:block;width:100%;height:100%;min-height:0;object-fit:cover;transition:transform .5s ease}
.showcase-tile>span{position:absolute;inset:auto 0 0;padding:24px 10px 9px;background:linear-gradient(transparent,#000b);font-size:14px;line-height:1.3;opacity:0;transition:opacity .2s ease}
.showcase-tile:is(:hover,:focus-visible) img{transform:scale(1.045)}
.showcase-tile:is(:hover,:focus-visible)>span{opacity:1}
.showcase-tile:focus-visible{outline:3px solid #527000;outline-offset:3px}
.ref-showcase.showcase-selection>.showcase-copy{padding:0;min-width:0}
@media(min-width:1051px){
 .ref-showcase.showcase-selection{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);padding-inline:max(var(--pad),calc((100% - 1280px)/2));justify-content:center}
}
.ref-showcase.showcase-selection h2{font-size:clamp(42px,3.4vw,68px);line-height:1;letter-spacing:-.055em}
.ref-showcase.showcase-selection p{max-width:540px;margin:28px 0;font-size:18px;line-height:1.5}
@media(max-width:900px){.ref-showcase.showcase-selection{gap:30px;grid-template-columns:1fr 1fr;padding-block:95px 75px}.ref-showcase.showcase-selection>.showcase-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.ref-showcase.showcase-selection h2{font-size:42px}}
@media(max-width:600px){.ref-showcase.showcase-selection{grid-template-columns:1fr;gap:40px;padding-block:85px 65px}.ref-showcase.showcase-selection>.showcase-copy{grid-row:1}.ref-showcase.showcase-selection>.showcase-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.ref-showcase.showcase-selection h2{font-size:clamp(40px,10vw,52px)}}
@media(prefers-reduced-motion:reduce){.showcase-grid .showcase-tile img,.showcase-tile>span{transition:none}}

.reference-clients.client-logos>.client-logo-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(20px,3vw,55px);align-items:center}
.client-logo-grid>.client-logo{display:flex;align-items:center;justify-content:center;min-width:0;opacity:.85;}
.client-logo-grid img{display:block;width:100%;max-width:220px;height:auto;aspect-ratio:300/211;object-fit:contain}


@media(max-width:1000px){.reference-clients.client-logos>.client-logo-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:25px 35px}}
@media(max-width:600px){.reference-clients.client-logos>.client-logo-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 30px}.client-logo-grid>.client-logo:last-child:nth-child(odd){grid-column:1/-1;width:calc((100% - 30px)/2);justify-self:center}}
@media(prefers-reduced-motion:reduce){.client-logo-grid>.client-logo{transition:none}}

.reference-quote>span{
 display:block;
 height:auto;
 font-size:clamp(64px,5vw,84px);
 line-height:1;
 color:var(--lime);
}
.reference-quote>span:first-child{margin:0 0 12px;text-align:left}
.reference-quote>span:last-child{margin:18px 0 0;text-align:right}
.reference-quote blockquote{margin:0;padding:0}

.reference-recognition.feedback-section{padding:90px var(--pad) 110px;overflow-anchor:none;scroll-margin-top:100px}
.feedback-section .feedback-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;align-items:stretch}
.feedback-grid .feedback-card{display:flex;flex-direction:column;min-width:0;padding:28px;background:var(--paper);border:1px solid #e4e3dc}
.feedback-grid .feedback-card[hidden]{display:none}
.feedback-card .feedback-rating{font-size:21px;line-height:1;letter-spacing:3px;color:#527000;margin-bottom:22px}
.feedback-card .feedback-text{border:0;padding:0;margin:0;font-size:17px;line-height:1.55;letter-spacing:-.015em;font-weight:400;color:#303030;white-space:pre-line}
.feedback-card .feedback-author{margin-top:auto;padding-top:26px;font-size:17px;line-height:1.35;font-weight:600;color:var(--ink)}
.feedback-author a{color:inherit;text-decoration:none;text-underline-offset:5px}
.feedback-author a:hover{text-decoration:underline;text-decoration-color:#527000}
.feedback-actions{display:flex;justify-content:center;margin-top:36px}
.feedback-actions .feedback-toggle{border:0;border-radius:40px;padding:15px 25px;background:var(--lime);color:var(--ink);font:500 18px/1.4 Manrope,Arial,sans-serif;cursor:pointer;transition:background .2s ease}
.feedback-actions .feedback-toggle:hover{background:#dcff86}
.feedback-actions .feedback-toggle:focus-visible{outline:2px solid var(--ink);outline-offset:5px}
@media(max-width:1099px){.feedback-section .feedback-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.feedback-grid .feedback-card{padding:25px}}
@media(max-width:600px){.reference-recognition.feedback-section{padding-block:65px 75px}.feedback-section .feedback-grid{grid-template-columns:1fr;gap:16px}.feedback-card .feedback-text{font-size:17px}.feedback-actions .feedback-toggle{font-size:17px}}
@media(prefers-reduced-motion:reduce){.feedback-actions .feedback-toggle{transition:none}}

/* Main section headings share the approved portfolio title scale. */
.reference-home .reference-faq h2,
.reference-home .form-section h2{
 font-size:clamp(42px,3.4vw,68px);
 line-height:1;
 letter-spacing:-.055em;
 font-weight:500;
}
.reference-home .reference-faq h2 strong{font-weight:inherit}
.reference-home .form-section{padding-top:100px;padding-bottom:100px}
@media(max-width:900px){.reference-home .reference-faq h2,.reference-home .form-section h2{font-size:42px}}
@media(max-width:600px){.reference-home .reference-faq h2,.reference-home .form-section h2{font-size:clamp(40px,10vw,52px)}.reference-home .form-section{padding-block:70px}}

/* Override the legacy FAQ label rule with the same shared H2 typography. */
:root{--cdi-major-heading:clamp(42px,3.4vw,68px)}
main.site-content :is(.showcase-selection,.feedback-section,.reference-faq,.form-section) h2{
 font-size:var(--cdi-major-heading);
 font-weight:600;
 letter-spacing:-.055em;
 line-height:1;
 word-spacing:normal;
}
body.page-webdesign main.site-content h2:not(.section-label){
 font-size:var(--cdi-major-heading);
 font-weight:600;
 letter-spacing:-.055em;
 line-height:1;
 word-spacing:normal;
}
body.page-webdesign main.site-content h2 strong{font-weight:inherit}
.reference-inner .editorial-paired .editorial-heading{width:100%;max-width:none;margin:0 0 32px;text-align:left}
.reference-inner .editorial-paired .editorial-heading h2{margin:0}
.reference-inner .editorial-paired .editorial-copy p:last-child{margin-bottom:0}
.reference-inner .editorial-paired .editorial-media{align-self:start}
.feedback-section #feedback-heading{margin:0 0 45px}
@media(max-width:900px){:root{--cdi-major-heading:42px}}
@media(max-width:600px){:root{--cdi-major-heading:clamp(40px,10vw,52px)}.feedback-section #feedback-heading{margin-bottom:32px}}

/* About: alternate text and images, beginning with the personal portrait. */
.about-page .editorial-section:not(.editorial-text-only) .editorial-body{align-items:center}
.about-page .about-intro .editorial-body{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}
.about-page .about-intro .editorial-copy h2{font-size:clamp(32px,2.5vw,44px);line-height:1.08;letter-spacing:-.05em;margin:0 0 30px}
.about-page .about-intro .editorial-copy p:last-child{margin-bottom:0}
.about-page .about-portrait{align-self:end;background:transparent;padding:30px 15px 0}
.about-page .about-portrait img{width:100%;height:auto;max-height:740px;object-fit:contain;object-position:center bottom}
@media(max-width:800px){.about-page .about-intro .editorial-body{gap:40px}.about-page .about-portrait{align-self:stretch;padding:25px 20px 0}.about-page .about-portrait img{max-height:580px}.about-page .about-intro .editorial-copy h2{font-size:32px}}

.about-page .about-intro-heading{width:100%;margin-bottom:65px;text-align:center}
main.site-content .about-intro-heading h2{max-width:none;margin:0;font-size:var(--cdi-major-heading);line-height:1.05;letter-spacing:-.055em;font-weight:600;text-wrap:balance}
@media(max-width:800px){.about-page .about-intro-heading{margin-bottom:40px}}

.about-page .about-closing .editorial-body{width:100%;max-width:none;margin-inline:auto}
.about-page .about-closing .editorial-copy{text-align:center}
.about-page .about-closing .editorial-copy p:last-child{margin-bottom:0}

/* Mobile home hero follows its content instead of the full screen height. */
@media(max-width:800px){
 .reference-home .ref-hero{
  height:auto;
  min-height:0;
  max-height:none;
  display:flex;
  flex-direction:column;
  gap:44px;
  padding:calc(var(--header-height) + 88px) var(--pad) 92px;
 }
 .reference-home .hero-title{
  position:relative;
  top:auto;
  left:auto;
  right:auto;
  transform:none;
  width:100%;
 }
 .reference-home .hero-title h1{
  font-size:clamp(36px,10.5vw,64px);
  line-height:1.05;
  letter-spacing:-.055em;
  max-width:none;
 }
 .reference-home .hero-review{position:relative;left:auto;bottom:auto;margin:0}
 .reference-home .ref-hero .diagonal-caption{display:none}
}

/* Mobile facts: reserve a consistent value column and a real text gutter. */
.reference-inner{--cdi-major-heading:clamp(36px,3vw,60px)}
.page-contact .contact-heading{padding-top:clamp(300px,21vw,360px)}
.page-contact .form-section{padding-bottom:clamp(220px,16vw,300px)}
@media(max-width:1050px){.page-contact .contact-heading{padding-top:240px}.page-contact .form-section{padding-bottom:190px}}
@media(max-width:600px){.page-contact .contact-heading{padding-top:200px}.page-contact .form-section{padding-bottom:160px}}
.about-page .feedback-section{--cdi-major-heading:clamp(42px,3.4vw,68px)}
body.reference-inner:not(.page-legal) main.site-content h2:not(.section-label){font-size:var(--cdi-major-heading);font-weight:600;letter-spacing:-.055em;line-height:1;word-spacing:normal}
body.reference-inner:not(.page-legal) main.site-content h2 strong{font-weight:inherit}
@media(max-width:900px){.reference-inner{--cdi-major-heading:38px}}
@media(max-width:900px){.about-page .feedback-section{--cdi-major-heading:42px}}
@media(max-width:600px){.reference-inner{--cdi-major-heading:clamp(36px,9vw,46px)}}
@media(max-width:600px){.about-page .feedback-section{--cdi-major-heading:clamp(40px,10vw,52px)}}
@media(max-width:540px){
 .reference-home .intro-facts>div{grid-template-columns:clamp(104px,30vw,144px) minmax(0,1fr);column-gap:24px}
 .reference-home .intro-facts>div:last-child strong{font-size:clamp(40px,12vw,48px)}
 .reference-home .intro-facts p{min-width:0}
}

/* Internal mobile heroes follow the content rather than the viewport height. */
.website-benefits-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.website-benefits-grid article{border-top:3px solid var(--cds-accent);padding-top:24px}
.website-benefits-grid h3{font-size:clamp(24px,2vw,30px);line-height:1.15;letter-spacing:-.04em;margin:0 0 18px}
.website-benefits-grid p{font-size:18px;line-height:1.6;margin:0}
.website-examples .editorial-body{display:block}
.website-examples .editorial-media{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}
.page-portfolio .portfolio-collection .module-gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 24px;align-items:start}
.page-portfolio .portfolio-heading{padding-top:205px}
@media(max-width:800px){.page-portfolio .portfolio-heading{padding-top:170px}}
@media(max-width:540px){.page-portfolio .portfolio-heading{padding-top:160px}}
.page-portfolio .portfolio-collection .portfolio-masonry-ready{grid-auto-rows:1px}
.page-portfolio .portfolio-collection .gallery-item,.page-portfolio .portfolio-collection .gallery-item:nth-child(even){padding:0;margin:0;align-self:start;min-width:0}
.page-portfolio .portfolio-collection .gallery-item[hidden]{display:none}
.page-portfolio .portfolio-collection .gallery-item img{display:block;width:100%;height:auto}
.page-portfolio .portfolio-caption{margin:14px 0 0}
@media(max-width:1050px){.page-portfolio .portfolio-collection .module-gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:22px}}
@media(max-width:600px){.page-portfolio .portfolio-collection .module-gallery-grid{grid-template-columns:minmax(0,1fr)}}
.editorial-media.logo-preview-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.logo-preview-grid .module{margin:0;min-width:0}
.logo-preview-grid .image-wrap{background:var(--paper);border:1px solid #e4e3dc}
.logo-preview-grid .image-wrap a{display:block}
.logo-preview-grid .image-wrap img{display:block;width:100%;height:auto;aspect-ratio:1;max-height:none;object-fit:contain}
a[data-work-lightbox]{cursor:zoom-in}
a[data-work-lightbox]:focus-visible{outline:3px solid #527000;outline-offset:4px}
html.work-lightbox-open{overflow:hidden}
.contact-honeypot{display:none!important}
.form-delivery-note{font-size:14px;line-height:1.5;color:#555}
.contact-submit:disabled{opacity:.65;cursor:wait}
.form-status[data-state="error"]{color:#9d241e}
.form-status[data-state="success"]{color:#3c5700}
#lightbox{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;border-radius:0;background:#101010;color:#f5f4f0;overflow:hidden;box-sizing:border-box}
#lightbox[open]{display:grid;grid-template-rows:72px minmax(0,1fr) auto}
#lightbox::backdrop{background:#101010}
#lightbox .work-lightbox-toolbar{display:flex;justify-content:space-between;align-items:center;padding:12px 24px;gap:20px}
#lightbox button{position:static;inset:auto;width:auto;height:auto;min-width:44px;min-height:44px;padding:8px 14px;border:1px solid #666;border-radius:30px;background:#202020;color:#fff;cursor:pointer;font-size:17px;line-height:1.2}
#lightbox button:hover{background:#343434}
#lightbox button:focus-visible{outline:3px solid var(--cds-accent);outline-offset:3px}
#lightbox .work-lightbox-close{display:flex;align-items:center;gap:12px}
#lightbox .work-lightbox-close span{font-size:28px;line-height:1}
#lightbox .work-lightbox-stage{position:relative;min-height:0;display:flex;align-items:center;justify-content:center;padding:0 76px}
#lightbox .work-lightbox-stage img{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain}
#lightbox .work-lightbox-prev,#lightbox .work-lightbox-next{position:absolute;top:50%;transform:translateY(-50%);font-size:32px;z-index:1}
#lightbox .work-lightbox-prev{left:16px}
#lightbox .work-lightbox-next{right:16px}
#lightbox button[hidden]{display:none}
#lightbox #lightbox-caption{font-size:17px;line-height:1.4;text-align:center;margin:0;padding:18px 24px max(18px,env(safe-area-inset-bottom));max-height:20dvh;overflow:auto}
@media(max-width:600px){
 .editorial-media.logo-preview-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 #lightbox .work-lightbox-toolbar{padding:10px 16px}
 #lightbox .work-lightbox-stage{padding:0 12px}
 #lightbox .work-lightbox-prev,#lightbox .work-lightbox-next{top:auto;bottom:12px;transform:none;background:#202020e6}
 #lightbox .work-lightbox-prev{left:16px}
 #lightbox .work-lightbox-next{right:16px}
}
@media(max-width:800px){
 .website-benefits-grid{grid-template-columns:1fr;gap:30px}
 .website-benefits-grid p{font-size:17px}
 .website-examples .editorial-media{grid-template-columns:1fr}
}
@media(max-width:800px){
 .inner-reference-hero{
  height:auto;
  min-height:0;
  max-height:none;
  padding:calc(var(--header-height) + 64px) var(--pad) 64px;
  flex-direction:column;
  align-items:stretch;
  gap:32px;
 }
 .inner-reference-hero h1{margin:0}
 .inner-reference-hero .inner-hero-bottom{
  position:relative;
  inset:auto;
  width:100%;
  gap:24px;
 }
 .inner-reference-hero .inner-description{max-width:none}
}