/* LOOPI / Inner pages refinement — November 2026.
   Visual-only layer. Published Squarespace copy is retained in page markup. */
:root{--loopi-ink:#151515;--loopi-paper:#f0f0ee;--loopi-blue:#217fac}
.site-header{height:112px;padding:15px 5%;background:#fff}
.site-header .logo{display:block;width:160px;line-height:0}
.site-header .logo img{display:block;width:100%;height:auto;max-height:70px;object-fit:contain;filter:brightness(0)}
.site-header nav{gap:clamp(15px,3vw,48px)}
.site-header nav a{font:900 12px Arial,sans-serif;letter-spacing:.02em}
.site-header nav .nav-contact{border-radius:0;padding:0;background:transparent;color:#111}
.site-header nav a[aria-current=page]{text-decoration:underline;text-underline-offset:7px;text-decoration-thickness:2px}
.site-header nav a:hover{opacity:.55}
main{overflow:clip}
.services-title,.page-hero,.editorial-hero{position:relative;overflow:hidden;min-height:min(62vh,590px);padding:clamp(95px,10vw,155px) 5% clamp(82px,9vw,132px);background:#fff}
.services-title:after,.page-hero:after,.editorial-hero:after{content:"";position:absolute;width:clamp(120px,20vw,390px);height:clamp(120px,20vw,390px);border-radius:50%;border:clamp(18px,3.3vw,55px) solid #e9e9e7;right:-7%;bottom:-48%;pointer-events:none}
.services-title h1,.page-hero h1,.editorial-hero h1{position:relative;z-index:1;max-width:1250px;letter-spacing:-.095em}
.services-title h1{font-size:clamp(68px,12vw,190px)}
.page-hero h1{font-size:clamp(65px,10vw,147px);text-transform:uppercase}
.editorial-hero h1{font-size:clamp(64px,10vw,145px)}
.services-title .small-label,.page-hero .micro,.editorial-hero .kicker{position:relative;z-index:1}
.page-hero p,.editorial-hero>p:not(.kicker){position:relative;z-index:1}
.service-detail,.case-study,.editorial-section{scroll-margin-top:24px}
.service-detail{position:relative;gap:clamp(38px,6vw,100px);padding-top:clamp(76px,8vw,140px);padding-bottom:clamp(76px,8vw,140px)}
.service-detail:nth-of-type(even){background:#fff}
.service-detail .service-heading{top:35px}
.service-heading h2{font-size:clamp(47px,5.5vw,91px)}
.service-body .big-copy{font-size:clamp(24px,2.65vw,40px)}
.service-body h3{display:inline-block;border-top:2px solid currentColor;padding-top:14px;margin-top:42px}
.service-body li::marker,.editorial-content li::marker{color:var(--loopi-blue)}
.service-images{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:49px 0 35px}
.service-image{margin:0;min-width:0;position:relative;overflow:hidden;aspect-ratio:.69;background:#222}
.service-image:nth-child(2){transform:translateY(21px)}
.service-image img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.82);transition:transform .85s cubic-bezier(.2,.9,.25,1),filter .65s}
.service-image:hover img{transform:scale(1.09);filter:saturate(1)}
.service-image figcaption{position:absolute;bottom:0;left:0;right:0;padding:22px 9px 9px;color:#fff;background:linear-gradient(transparent,#000b);font:900 8px/1.4 Arial,sans-serif;letter-spacing:.07em}
.service-detail .detail-cta{margin-top:65px}
.service-detail .detail-cta:hover{border-color:var(--loopi-blue)}
.case-heading{padding-bottom:37px}
.case-study{padding-top:clamp(75px,8vw,140px)}
.case-media{overflow:hidden}
.case-media img{transition:transform 1.15s cubic-bezier(.2,.8,.2,1)}
.case-media:hover img{transform:scale(1.045)}
.case-gallery-expanded{grid-template-columns:repeat(12,minmax(0,1fr));gap:15px;align-items:start}
.case-gallery-tile{grid-column:span 4;margin:0;overflow:hidden;background:#fff}
.case-gallery-tile:nth-child(2),.case-gallery-tile:nth-child(4){grid-column:span 5}
.case-gallery-tile:nth-child(5){grid-column:span 7}
.case-gallery-tile img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;transition:transform .8s;display:block}
.case-gallery-tile:hover img{transform:scale(1.045)}
.case-gallery-tile figcaption{font:900 9px Arial,sans-serif;letter-spacing:.1em;padding:12px 3px 0}
.editorial-hero>p:first-of-type:not(.kicker){font-weight:700}
.editorial-section{gap:clamp(25px,6vw,105px);padding-top:clamp(75px,8vw,125px);padding-bottom:clamp(75px,8vw,125px)}
.editorial-section .editorial-side{position:sticky;top:35px;align-self:start}
.editorial-side h2{font-size:clamp(41px,5vw,80px);text-transform:uppercase}
.editorial-content>img{aspect-ratio:1.56;max-height:none}
.editorial-content .highlight{letter-spacing:-.055em}
.editorial-section:nth-of-type(3){background:#171717;color:#fff}
.editorial-section:nth-of-type(3) .kicker{color:#aaa}
.editorial-section:nth-of-type(3) .editorial-link{color:#fff}
.value-list article{display:grid;grid-template-columns:minmax(180px,.95fr) 1.05fr;column-gap:20px;align-items:start}
.value-list article h3{margin:0}
.value-list article p{margin:2px 0 0}
.team>div{transition:transform .4s}
.team>div:hover{transform:translateY(-7px)}
.editorial-section .editorial-link{font-size:clamp(19px,2vw,28px);letter-spacing:-.025em}
.contact-area{min-height:440px}
.contact-card{border-top:1px solid #111;padding-top:40px}
.contact-card a{transition:transform .25s,background .25s}
.contact-card a:hover{transform:translateY(-3px)}
[data-reveal-section] .service-image img{transform:scale(1.09)}
[data-reveal-section].in-view .service-image img{transform:scale(1);transition-delay:calc(var(--image-index,0)*90ms)}
@media(max-width:1000px){.site-header{height:auto;min-height:85px}.value-list article{grid-template-columns:1fr}.value-list article p{margin-top:8px}}
@media(max-width:790px){.site-header{padding:10px 5%}.site-header .logo{width:140px}.services-title,.page-hero,.editorial-hero{min-height:auto;padding:75px 5% 90px}.service-detail{grid-template-columns:1fr;padding:75px 5%}.service-detail .service-heading,.editorial-section .editorial-side{position:static}.service-images{margin-top:36px}.case-gallery-expanded{grid-template-columns:repeat(2,minmax(0,1fr))}.case-gallery-tile,.case-gallery-tile:nth-child(2),.case-gallery-tile:nth-child(4),.case-gallery-tile:nth-child(5){grid-column:span 1}.editorial-section{grid-template-columns:1fr}.page-hero h1{font-size:clamp(50px,11vw,100px)}}
@media(max-width:500px){.service-images{gap:6px}.service-image{aspect-ratio:.57}.service-image figcaption{font-size:6px;padding:18px 4px 6px}.case-gallery-expanded{gap:11px}.case-gallery-tile figcaption{font-size:7px}.editorial-hero h1,.services-title h1{font-size:clamp(48px,12vw,76px)}}
@media(prefers-reduced-motion:reduce){.service-image img,.case-media img,.case-gallery-tile img,.team>div,.contact-card a{transition:none!important;transform:none!important}}

.team-photo{width:100%;aspect-ratio:.84;object-fit:cover;display:block;filter:saturate(.85);transition:filter .5s,transform .5s}.team>div:hover .team-photo{filter:saturate(1);transform:translateY(-3px)}.team h3{margin-top:18px}@media(prefers-reduced-motion:reduce){.team-photo{transition:none!important;transform:none!important}}

/* Page parity: exact black header wordmark and shared home footer. */
.site-header .logo-wordmark{width:160px;display:block;line-height:0}
.site-header .logo-wordmark img{width:100%;height:auto;max-height:none;aspect-ratio:2.78;object-fit:contain;background:transparent!important;filter:brightness(0)}
.original-footer{background:#151515;color:#fff;padding:50px 5% 25px;display:flex;justify-content:space-between;gap:50px;align-items:flex-end}
.original-footer .footer-brand img{width:auto;height:auto;max-width:220px;display:block;filter:none;background:transparent}
.original-footer .footer-details{font:800 11px/2.3 Arial,sans-serif;letter-spacing:.08em;text-align:right}
.original-footer .footer-details a{display:block;text-decoration:underline;text-underline-offset:4px}
@media(max-width:700px){.original-footer{display:block}.original-footer .footer-details{text-align:left;margin-top:40px}}

/* Services: each photo tells the story of the copy directly beside it. */
.service-detail[data-reveal-section]{grid-template-columns:minmax(0,1fr);gap:45px}
.service-detail[data-reveal-section] .service-heading{position:static;display:flex;align-items:start;justify-content:space-between;gap:25px;border-bottom:1px solid #888;padding-bottom:32px}
.service-detail[data-reveal-section] .service-heading h2{font-size:clamp(54px,7.1vw,116px);margin:0;max-width:960px}
.service-detail[data-reveal-section] .service-body{width:100%;max-width:none}
.service-story{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(28px,5vw,90px);align-items:center;padding:45px 0;border-bottom:1px solid #aaa}
.service-story-reverse{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
.service-story-reverse .service-image{grid-column:1;grid-row:1}
.service-story-reverse .service-story-copy{grid-column:2;grid-row:1}
.service-story-copy{max-width:780px}
.service-story-copy>h3:first-child{margin-top:0}
.service-story .service-image{position:relative;aspect-ratio:1.22;min-width:0;width:100%;margin:0;overflow:hidden;background:#222;transform:none}
.service-story .service-image img{width:100%;height:100%;display:block;object-fit:cover}
.service-story .service-image figcaption{font:900 9px Arial,sans-serif;letter-spacing:.07em;padding:28px 15px 13px}
.service-story-conclusion{padding-top:24px;max-width:800px}
.service-story-conclusion .detail-cta{margin-top:45px}
.service-story-conclusion h3{margin-top:30px}
@media(max-width:790px){
 .site-header .logo-wordmark{width:140px}
 .service-detail[data-reveal-section] .service-heading{display:block}
 .service-detail[data-reveal-section] .service-heading h2{margin:20px 0 0;font-size:clamp(43px,9vw,75px)}
 .service-story,.service-story-reverse{display:flex;flex-direction:column;align-items:stretch;gap:23px;padding:36px 0}
 .service-story-reverse .service-story-copy,.service-story-reverse .service-image{grid-column:auto;grid-row:auto}
 .service-story .service-image{aspect-ratio:1.38}
}

/* SERVICES V2 / tighter editorial rhythm aligned with the homepage */
body:has(.services-title) .services-title{
 min-height:0;padding:58px 5% 61px;background:#fff;
}
body:has(.services-title) .services-title h1{
 font-size:clamp(49px,7vw,104px);line-height:.91;letter-spacing:-.085em;margin:18px 0 0;
}
body:has(.services-title) .services-title:after{
 width:165px;height:165px;border-width:24px;bottom:-115px;right:2%;opacity:.7;
}
body:has(.services-title) .service-detail[data-reveal-section]{
 display:block;padding:55px 5% 61px;background:#f0f0ee;
}
body:has(.services-title) .service-detail.alternate[data-reveal-section]{
 background:#dae8ed;
}
body:has(.services-title) .service-detail[data-reveal-section] .service-heading{
 display:flex;align-items:baseline;justify-content:flex-start;gap:clamp(24px,5vw,90px);
 padding-bottom:24px;margin-bottom:0;border-bottom:1px solid #888;
}
body:has(.services-title) .service-detail[data-reveal-section] .service-heading .small-label{
 width:160px;min-width:160px;white-space:nowrap;
}
body:has(.services-title) .service-detail[data-reveal-section] .service-heading h2{
 font:900 clamp(32px,4.5vw,64px)/.98 Arial,sans-serif;
 letter-spacing:-.07em;margin:0;max-width:none;
}
body:has(.services-title) .service-detail .service-body{
 margin-left:clamp(0px,13vw,250px);max-width:1100px;width:auto;
 font:15px/1.53 Arial,sans-serif;
}
body:has(.services-title) .service-story,
body:has(.services-title) .service-story-reverse{
 display:grid;grid-template-columns:minmax(0,1fr) minmax(185px,31%);
 gap:clamp(22px,4vw,55px);align-items:center;padding:23px 0;
 border-bottom:1px solid #aaa;
}
body:has(.services-title) .service-story-reverse .service-story-copy{
 grid-column:1;grid-row:1;
}
body:has(.services-title) .service-story-reverse .service-image{
 grid-column:2;grid-row:1;
}
body:has(.services-title) .service-story-copy{max-width:750px}
body:has(.services-title) .service-story-copy p{margin:8px 0 12px}
body:has(.services-title) .service-story-copy .big-copy{
 font-size:clamp(19px,2.1vw,29px);line-height:1.25;margin:0 0 11px;
}
body:has(.services-title) .service-story-copy h3,
body:has(.services-title) .service-story-conclusion h3{
 font:900 13px/1.35 Arial,sans-serif;letter-spacing:.025em;
 margin:14px 0 11px;padding-top:11px;
}
body:has(.services-title) .service-story-copy>h3:first-child{margin-top:0}
body:has(.services-title) .service-story-copy ul{margin:9px 0 8px;padding-left:20px}
body:has(.services-title) .service-story-copy li{padding:2px 0}
body:has(.services-title) .service-story .service-image{
 height:clamp(150px,16vw,210px);max-width:320px;aspect-ratio:auto;
 justify-self:end;border-radius:0;
}
body:has(.services-title) .service-story .service-image img{height:100%;width:100%;object-fit:cover}
body:has(.services-title) .service-story .service-image figcaption{font-size:7px;padding:16px 9px 7px}
body:has(.services-title) .service-story-conclusion{
 max-width:none;padding:13px 0 0;
}
body:has(.services-title) .service-story-conclusion p{margin:8px 0 12px;max-width:750px}
body:has(.services-title) .service-story-conclusion .detail-cta{
 margin:24px 0 0;padding:15px 0;gap:6px;
 font-size:11px;
}
body:has(.services-title) .detail-cta span{font-size:20px}
@media(max-width:1000px){
 body:has(.services-title) .service-detail .service-body{margin-left:0}
}
@media(max-width:700px){
 body:has(.services-title) .services-title{padding:51px 5% 53px}
 body:has(.services-title) .service-detail[data-reveal-section]{padding:43px 5% 49px}
 body:has(.services-title) .service-detail[data-reveal-section] .service-heading{
  display:block;padding-bottom:19px;
 }
 body:has(.services-title) .service-detail[data-reveal-section] .service-heading h2{
  font-size:clamp(31px,7vw,49px);margin:12px 0 0;
 }
 body:has(.services-title) .service-story,
 body:has(.services-title) .service-story-reverse{
  grid-template-columns:minmax(0,1fr) minmax(108px,32%);
  gap:14px;padding:19px 0;
 }
 body:has(.services-title) .service-story-reverse .service-story-copy{
  grid-column:1;grid-row:1;
 }
 body:has(.services-title) .service-story-reverse .service-image{
  grid-column:2;grid-row:1;
 }
 body:has(.services-title) .service-story .service-image{
  height:clamp(130px,30vw,180px);width:100%;max-width:none;align-self:start;
 }
 body:has(.services-title) .service-story-copy .big-copy{font-size:19px}
 body:has(.services-title) .service-body{font-size:14px}
 body:has(.services-title) .service-story-copy h3{font-size:12px}
}
@media(max-width:460px){
 body:has(.services-title) .service-story,
 body:has(.services-title) .service-story-reverse{grid-template-columns:1fr;gap:13px}
 body:has(.services-title) .service-story .service-image,
 body:has(.services-title) .service-story-reverse .service-image{
  grid-column:1;grid-row:2;height:165px;width:100%;max-width:none;
 }
 body:has(.services-title) .service-story-reverse .service-story-copy{
  grid-column:1;grid-row:1;
 }
}

/* Services CTA text remains informational; only the invitation is a link. */
body:has(.services-title) .service-detail .detail-cta .detail-cta-question{
 font:900 11px/1.4 Arial,sans-serif;letter-spacing:.035em;
}
body:has(.services-title) .service-detail .detail-cta .detail-contact-link{
 display:inline-flex!important;width:max-content!important;max-width:100%;
 font:900 18px/1.2 Arial,sans-serif;letter-spacing:-.03em;
 margin:0;
}
body:has(.services-title) .service-detail .detail-cta .micro-cta-arrow{
 font:400 18px/1 Arial,sans-serif;
}

/* Drawn arrow and full reset: no glyph underline inside the circle. */
a.micro-cta, .original-footer .footer-details a.micro-cta{ text-decoration:none!important; text-decoration-line:none!important; }
a.micro-cta .micro-cta-arrow,
a.micro-cta .micro-cta-arrow *{ text-decoration:none!important; text-decoration-line:none!important; }
a.micro-cta .micro-cta-arrow svg{width:15px;height:15px;display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
