:root  {
  --paper:#faf3df;
  --ink:#242126;
  --accent:#f79ac2;
  --on-accent:#242126;
  --line:#242126;
  --muted:#625754;
  --tint:#f3dfd6;
  --focus:#243be9;
  --field:#fffaf0
}
body  {
  background-image:radial-gradient(#2421260c .7px,transparent .8px);
  background-size:7px 7px
}
.site-header  {
  border-bottom:3px solid var(--ink);
  height:94px;
  background:var(--paper)
}
.logo  {
  font-family:Georgia,'Times New Roman',serif;
  letter-spacing:-1px;
  font-size:28px
}
.logo-symbol  {
  background:#46cedb;
  clip-path:none;
  border:2px solid var(--ink);
  box-shadow:4px 4px 0 var(--ink);
  transform:rotate(-8deg);
  width:27px;
  height:27px
}
.logo-dot  {
  display:none
}
.button  {
  border:2px solid var(--ink);
  background:#ffe263;
  color:var(--ink);
  box-shadow:4px 4px 0 var(--ink);
  gap:22px;
  padding:13px 20px;
  font-size:13px
}
.button:hover  {
  background:#46cedb;
  border-color:var(--ink);
  transform:translate(-1px,-1px);
  box-shadow:5px 5px 0 var(--ink)
}
.button.secondary:hover  {
  background:#ffe263;
  color:var(--ink)
}
.menu-toggle  {
  border:2px solid var(--ink);
  box-shadow:3px 3px 0 var(--ink);
  background:#fff7e3
}
.hero  {
  position:relative
}
.hero-topline  {
  display:flex;
  justify-content:space-between;
  gap:28px;
  padding:22px 4vw;
  border-bottom:2px solid var(--ink);
  background:#46cedb
}
.hero-topline .eyebrow  {
  font-size:10px;
  letter-spacing:1.1px
}
.hero-spread  {
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);
  padding:0 4vw;
  gap:3vw;
  min-height:calc(100svh - 198px)
}
.hero-copy  {
  padding:90px 0 38px;
  position:relative;
  min-width:0
}
.mini-sticker  {
  position:absolute;
  top:20px;
  left:5px;
  background:#ffe263;
  border:2px solid var(--ink);
  padding:9px 15px;
  font:10px 'Courier New',monospace;
  transform:rotate(-7deg);
  box-shadow:3px 3px 0 var(--ink);
  line-height:1.2
}
.hero h1  {
  font-family:'Cooper Black',Georgia,'Times New Roman',serif;
  font-size:clamp(58px,6.5vw,112px);
  font-weight:900;
  letter-spacing:-.064em;
  line-height:1.02;
  position:relative;
  z-index:2;
  margin:0 0 27px
}
.hero h1 span  {
  text-shadow:4px 4px 0 #f79ac2
}
.hero-copy>p  {
  font-size:15px;
  line-height:1.65;
  max-width:420px;
  margin-bottom:25px
}
.hero-copy .button  {
  position:relative;
  z-index:2
}
.hero-scribble  {
  position:absolute;
  right:3vw;
  bottom:27px;
  font-size:51px;
  font-weight:700;
  line-height:1;
  letter-spacing:-14px;
  color:#ef5d98;
  transform:rotate(-12deg)
}
.hero-art-wrap  {
  position:relative;
  min-width:0;
  padding:68px 20px 74px 8px;
  display:flex;
  align-items:center
}
.hero-art  {
  margin:0;
  width:100%;
  aspect-ratio:1.03;
  max-height:570px;
  position:relative;
  border:3px solid var(--ink);
  box-shadow:12px 12px 0 #242126;
  background:#eddcca;
  transform:rotate(3deg);
  z-index:2
}
.hero-art img  {
  object-position:50% 50%
}
.hero-art figcaption  {
  position:absolute;
  bottom:12px;
  left:12px;
  right:12px;
  padding:8px 10px;
  background:#fff8e8ed;
  font-size:8px;
  color:var(--ink);
  border:1px solid var(--ink)
}
.art-circle  {
  position:absolute;
  width:150px;
  height:150px;
  border-radius:50%;
  background:#f79ac2;
  border:3px solid var(--ink);
  top:27px;
  right:-4px;
  background-image:radial-gradient(#242126 1px,transparent 1.5px);
  background-size:10px 10px
}
.art-triangle  {
  position:absolute;
  bottom:19px;
  left:2px;
  width:150px;
  height:135px;
  background:repeating-linear-gradient(45deg,#242126 0 5px,#46cedb 5px 12px);
  clip-path:polygon(0 100%,50% 0,100% 100%);
  transform:rotate(-14deg);
  z-index:3
}
.art-ticket  {
  position:absolute;
  right:4px;
  bottom:28px;
  padding:14px 22px;
  display:flex;
  gap:22px;
  align-items:center;
  border:3px solid var(--ink);
  background:#ffe263;
  transform:rotate(-5deg);
  z-index:4;
  box-shadow:5px 5px 0 var(--ink)
}
.art-ticket>span  {
  font-family:Georgia,serif;
  font-size:51px;
  letter-spacing:-5px;
  font-weight:900;
  line-height:1
}
.art-ticket small  {
  font:9px 'Courier New',monospace;
  line-height:1.35
}
.facts  {
  border-bottom:3px solid var(--ink);
  background:#faf3df;
  grid-template-columns:repeat(3,minmax(0,1fr))
}
.fact  {
  padding:30px 4vw;
  border-right:2px solid var(--ink)
}
.fact:last-child  {
  border:0
}
.fact strong  {
  font-family:Georgia,serif;
  font-size:30px;
  font-weight:900;
  letter-spacing:-1.2px
}
.fact span  {
  font-size:12px
}
.section  {
  padding:90px 4vw
}
.section-head  {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,2.5fr);
  gap:5vw
}
.section-head h2  {
  font-family:'Cooper Black',Georgia,serif;
  font-size:clamp(44px,5.1vw,82px);
  line-height:1.02;
  letter-spacing:-.05em
}
.section-head .eyebrow  {
  font-size:10px;
  padding-top:6px
}
.services  {
  background:#faf3df
}
.service-tabs  {
  border:2px solid var(--ink);
  box-shadow:5px 5px 0 var(--ink)
}
.service-tab  {
  border:0;
  border-right:2px solid var(--ink);
  padding:19px 20px;
  font-size:14px;
  min-width:0
}
.service-tab:last-child  {
  border-right:0
}
.service-tab[aria-selected=true]  {
  background:#46cedb
}
.service-panel  {
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  padding-top:46px;
  gap:6vw
}
.service-copy  {
  min-width:0
}
.service-copy>.eyebrow  {
  font-size:10px;
  display:block;
  margin-bottom:18px
}
.service-copy h3  {
  font-family:Georgia,serif;
  font-size:48px;
  line-height:1.05;
  letter-spacing:-2px
}
.service-copy p  {
  font-size:15px
}
.service-copy>.text-link  {
  background:transparent;
  color:inherit;
  border:0
}
.fit-list li  {
  border-bottom:1px dashed #aa9596;
  font-size:12px
}
.service-visual  {
  min-height:340px;
  border:2px solid var(--ink);
  background:#f3b5ce;
  background-image:radial-gradient(#24212633 1px,transparent 1.5px);
  background-size:13px 13px;
  box-shadow:8px 8px 0 #ffe263
}
.visual-caption  {
  font-size:9px
}
.connected  {
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);
  gap:7vw;
  align-items:center;
  background:#ffe263;
  border-top:3px solid var(--ink);
  border-bottom:3px solid var(--ink)
}
.connected-art  {
  position:relative;
  aspect-ratio:1;
  min-width:0;
  border:3px solid var(--ink);
  background:#46cedb;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:40px;
  transform:rotate(-3deg);
  box-shadow:12px 12px 0 var(--ink)
}
.giant-ps,.giant-prs  {
  font-family:Georgia,serif;
  font-size:clamp(85px,12vw,185px);
  font-weight:bold;
  line-height:.86;
  letter-spacing:-.1em
}
.giant-prs  {
  align-self:flex-end;
  margin-top:10px
}
.plus-badge  {
  position:absolute;
  right:-26px;
  top:15px;
  width:105px;
  height:105px;
  border:3px solid var(--ink);
  border-radius:50%;
  background:#f79ac2;
  font-size:75px;
  line-height:1;
  display:grid;
  place-items:center;
  transform:rotate(13deg)
}
.connected-dot  {
  position:absolute;
  bottom:17px;
  left:17px;
  width:40px;
  height:40px;
  border-radius:50%;
  background:var(--ink)
}
.connected-copy  {
  min-width:0
}
.connected-copy h2  {
  font-family:Georgia,serif;
  font-size:clamp(44px,5.5vw,87px);
  line-height:1;
  letter-spacing:-.06em;
  margin:26px 0
}
.connected-copy h2 em  {
  font-weight:bold;
  font-style:italic
}
.connected-copy p  {
  font-size:16px;
  max-width:430px
}
.capability-tags  {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:24px 0
}
.capability-tags span  {
  font:10px 'Courier New',monospace;
  padding:8px 11px;
  border:2px solid var(--ink);
  background:#faf3df
}
.connected-copy .button  {
  font-size:12px;
  max-width:100%
}
.process  {
  background:#f3b5ce;
  border-bottom:3px solid var(--ink)
}
.process-grid  {
  gap:35px;
  grid-template-columns:repeat(3,minmax(0,1fr))
}
.process-grid article  {
  border-top:2px solid var(--ink);
  min-width:0
}
.process-number  {
  font-family:Georgia,serif;
  font-size:19px;
  width:48px;
  height:48px;
  background:#ffe263;
  border:2px solid var(--ink);
  display:grid;
  place-items:center;
  box-shadow:3px 3px 0 var(--ink);
  transform:rotate(-4deg);
  margin-bottom:35px
}
.process-grid h3  {
  font-family:Georgia,serif;
  font-size:27px;
  letter-spacing:-.8px
}
.process-grid p  {
  font-size:14px;
  color:#594752
}
.faq-layout  {
  grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);
  gap:7vw
}
.faq-layout h2  {
  font-family:Georgia,serif;
  font-size:57px;
  letter-spacing:-3px
}
.faq-list summary  {
  font-size:15px;
  font-weight:700
}
.faq-list details  {
  border-top:2px solid var(--ink)
}
.faq-list details:last-child  {
  border-bottom:2px solid var(--ink)
}
.faq-list summary::after  {
  width:29px;
  height:29px;
  display:grid;
  place-items:center;
  background:#46cedb;
  border:1px solid var(--ink);
  font-size:23px;
  flex-shrink:0
}
.final-cta  {
  background:#46cedb;
  border-top:3px solid var(--ink);
  border-bottom:3px solid var(--ink);
  padding:90px 4vw
}
.final-cta h2  {
  font-family:Georgia,serif;
  font-size:clamp(47px,6.5vw,100px);
  line-height:1.03;
  letter-spacing:-.06em
}
.final-cta .button  {
  background:#f79ac2
}
.final-cta .button:hover  {
  background:#ffe263
}
.site-footer  {
  border:0;
  background:#faf3df
}
.site-footer .logo  {
  font-size:26px
}
.quote-modal  {
  border:3px solid var(--ink);
  box-shadow:12px 12px 0 #242126
}
.quote-modal h2,.confirmation h3  {
  font-family:Georgia,serif;
  letter-spacing:-1.6px
}
.modal-close  {
  border:2px solid var(--ink);
  background:#f79ac2
}
.field input,.field select,.field textarea  {
  border:1px solid var(--ink)
}
.confirmation .success-mark  {
  border:2px solid var(--ink);
  background:#46cedb;
  box-shadow:4px 4px 0 #ffe263
}
@media(max-width:1000px)  {
  .site-header  {
    height:84px
  }
  .hero-spread  {
    gap:2vw;
    min-height:630px
  }
  .hero-copy  {
    padding-top:90px
  }
  .hero h1  {
    font-size:6.8vw
  }
  .hero-copy>p  {
    font-size:14px;
    max-width:350px
  }
  .hero-art-wrap  {
    padding:60px 15px 80px 8px
  }
  .hero-art  {
    aspect-ratio:.86
  }
  .art-circle  {
    width:120px;
    height:120px;
    right:0
  }
  .art-ticket  {
    padding:12px 17px;
    right:0
  }
  .art-triangle  {
    width:110px;
    height:110px
  }
  .hero-scribble  {
    display:none
  }
  .fact  {
    padding:27px 3vw
  }
  .fact strong  {
    font-size:26px
  }
  .service-copy h3  {
    font-size:40px
  }
  .connected-art  {
    padding:30px
  }
  .plus-badge  {
    width:75px;
    height:75px;
    font-size:55px;
    right:-18px
  }
  .connected-copy h2  {
    font-size:49px
  }
  .connected-copy p  {
    font-size:15px
  }
  .faq-layout h2  {
    font-size:46px
  }
}
@media(max-width:640px)  {
  .site-header  {
    height:78px;
    padding:0 5vw
  }
  .logo  {
    font-size:24px
  }
  .logo-symbol  {
    width:23px;
    height:23px
  }
  .header-nav  {
    border-bottom:3px solid var(--ink);
    top:75px
  }
  .header-nav .button  {
    margin-right:5px
  }
  .hero-topline  {
    padding:17px 5vw;
    gap:20px
  }
  .hero-topline>.eyebrow  {
    font-size:8px;
    letter-spacing:.4px;
    max-width:185px
  }
  .hero-topline>.eyebrow:last-child  {
    max-width:110px;
    text-align:right
  }
  .hero-spread  {
    display:flex;
    flex-direction:column;
    padding:0 5vw;
    gap:0;
    min-height:0
  }
  .hero-copy  {
    padding:80px 0 12px
  }
  .mini-sticker  {
    font-size:9px;
    top:20px;
    padding:7px 12px;
    left:3px
  }
  .hero h1  {
    font-size:14.5vw;
    line-height:1.01;
    margin-bottom:24px
  }
  .hero h1 span  {
    text-shadow:3px 3px 0 #f79ac2
  }
  .hero-copy>p  {
    font-size:14px;
    max-width:none;
    margin-bottom:23px
  }
  .hero-copy .button  {
    min-height:51px
  }
  .hero-art-wrap  {
    padding:45px 12px 70px 6px
  }
  .hero-art  {
    aspect-ratio:1.5;
    max-height:450px;
    box-shadow:7px 7px 0 var(--ink);
    transform:rotate(2deg)
  }
  .hero-art figcaption  {
    font-size:7px;
    left:9px;
    right:9px;
    bottom:9px;
    padding:7px
  }
  .art-circle  {
    top:12px;
    right:0;
    width:100px;
    height:100px
  }
  .art-triangle  {
    left:0;
    bottom:19px;
    width:95px;
    height:87px
  }
  .art-ticket  {
    bottom:25px;
    right:2px;
    padding:10px 15px;
    gap:17px;
    box-shadow:4px 4px 0 var(--ink)
  }
  .art-ticket>span  {
    font-size:40px
  }
  .art-ticket small  {
    font-size:8px
  }
  .facts  {
    grid-template-columns:minmax(0,1fr)
  }
  .fact  {
    padding:22px 5vw;
    border-right:0;
    border-bottom:2px solid var(--ink)
  }
  .fact strong  {
    font-size:23px
  }
  .fact span  {
    font-size:10px;
    max-width:150px
  }
  .section  {
    padding:65px 5vw
  }
  .section-head  {
    display:block
  }
  .section-head .eyebrow  {
    display:block;
    margin-bottom:21px
  }
  .section-head h2  {
    font-size:10.6vw;
    line-height:1.08
  }
  .service-tabs  {
    box-shadow:3px 3px 0 var(--ink)
  }
  .service-tab  {
    font-size:10px;
    line-height:1.35;
    padding:15px 7px;
    min-height:60px
  }
  .service-panel  {
    grid-template-columns:minmax(0,1fr);
    padding-top:33px;
    gap:30px
  }
  .service-copy h3  {
    font-size:35px;
    letter-spacing:-1.5px
  }
  .service-copy>.eyebrow  {
    font-size:9px
  }
  .service-copy p  {
    font-size:14px
  }
  .fit-list li  {
    font-size:11px
  }
  .service-copy>.text-link  {
    font-size:12px;
    gap:15px
  }
  .service-visual  {
    min-height:280px;
    box-shadow:5px 5px 0 #ffe263;
    margin-right:5px
  }
  .service-visual  {
    gap:25px
  }
  .visual-arrow  {
    font-size:29px
  }
  .visual-caption  {
    font-size:8px
  }
  .connected  {
    grid-template-columns:minmax(0,1fr);
    gap:50px
  }
  .connected-art  {
    max-width:calc(100% - 24px);
    margin:0 12px;
    box-shadow:7px 7px 0 var(--ink);
    padding:30px
  }
  .giant-ps,.giant-prs  {
    font-size:28vw
  }
  .plus-badge  {
    right:-14px;
    top:13px;
    width:69px;
    height:69px;
    font-size:50px
  }
  .connected-dot  {
    width:25px;
    height:25px;
    left:14px;
    bottom:14px
  }
  .connected-copy h2  {
    font-size:14vw;
    line-height:1
  }
  .connected-copy p  {
    font-size:15px
  }
  .connected-copy .button  {
    width:100%;
    font-size:11px;
    gap:12px
  }
  .process-grid  {
    grid-template-columns:minmax(0,1fr);
    gap:34px
  }
  .process-grid article  {
    grid-template-columns:39px minmax(0,1fr);
    gap:8px 16px
  }
  .process-number  {
    width:35px;
    height:35px;
    font-size:13px;
    margin:3px 0 0
  }
  .process-grid h3  {
    font-size:24px;
    line-height:1.3
  }
  .process-grid p  {
    font-size:14px
  }
  .faq-layout  {
    grid-template-columns:minmax(0,1fr);
    gap:30px
  }
  .faq-layout h2  {
    font-size:42px;
    line-height:1.06;
    letter-spacing:-2px
  }
  .faq-list summary  {
    font-size:14px
  }
  .faq-list details p  {
    font-size:14px
  }
  .final-cta  {
    padding:65px 5vw
  }
  .final-cta h2  {
    font-size:12.5vw;
    line-height:1.04
  }
  .final-cta p  {
    font-size:14px
  }
  .site-footer .prototype-note  {
    font-size:10px
  }
  .quote-modal h2  {
    font-size:32px
  }
}
/* V2 service framing and review navigation. */ .header-nav a.button  {
  display: inline-flex;
  padding: 13px 20px;
  text-decoration: none;
}
.hero-topline  {
  align-items: center;
  gap: 32px;
  padding-top: 16px;
  padding-bottom: 16px;
}
.hero-topline .hero-descriptor,
.hero-topline .hero-location  {
  font-size: clamp(12px, 1.8vw, 18px);
  font-weight: 700;
  letter-spacing: 0.5px;
  line-height: 1.18;
  white-space: nowrap;
}
.hero-topline .hero-location  {
  text-align: right;
  flex-shrink: 0;
}
.estimate-hint  {
  display: block;
  margin-top: 15px;
  font-size: 11px;
  color: var(--muted);
}
.hero-scribble  {
  bottom: 54px;
  right: 0;
  pointer-events: none;
}
.art-ticket > span  {
  font-size: 49px;
  letter-spacing: -4px;
}
.art-ticket small  {
  font-size: 11px;
  font-weight: 700;
  line-height: 1.5;
}
.hero-ribbon  {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 11px 4vw;
  border-top: 3px solid var(--ink);
  border-bottom: 3px solid var(--ink);
  background: #f79ac2;
  font: 700 14.4px 'Courier New', monospace;
  letter-spacing: 0.4px;
  text-transform: uppercase;
}
.hero-ribbon > a  {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  min-height: 44px;
  flex: 1;
}
.hero-ribbon > a:hover  {
  text-decoration: underline;
  text-underline-offset: 5px;
}
.hero-ribbon > span  {
  font-size: 25px;
  line-height: 1;
}
.hero-ribbon > a span  {
  font-size: 16px;
}
.fact strong  {
  font-size: clamp(23px, 2.2vw, 30px);
  line-height: 1.13;
}
.service-illustration  {
  display: block;
  align-self: center;
  width: 100%;
  margin: 0;
  aspect-ratio: 3 / 2;
  min-height: 0;
  background: #faf3df;
}
.service-illustration img  {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.service-illustration .visual-caption  {
  bottom: 12px;
  left: 12px;
  right: 12px;
  padding: 6px 9px;
  border: 1px solid var(--ink);
  background: #fff8e8ee;
  color: var(--ink);
  font-size: 9px;
  line-height: 1.4;
}
.faq-list p a  {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.footer-contact a  {
  overflow-wrap: anywhere;
}
.review-dock  {
  position: fixed;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 30;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 5px;
  border: 2px solid var(--ink);
  background: var(--ink);
  color: var(--paper);
  box-shadow: 4px 4px 0 #f79ac2;
  font: 11px 'Courier New', monospace;
  white-space: nowrap;
}
.review-dock > span  {
  padding: 10px 13px;
  background: #ffe263;
  color: var(--ink);
  font-weight: 700;
}
.review-dock a  {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  min-height: 38px;
  padding: 10px 13px;
}
.review-dock a:hover  {
  background: #414046;
}
@media (max-width: 640px)  {
  .hero-topline  {
    gap: 15px;
    padding: 14px 5vw;
  }
  .hero-topline .hero-descriptor,
  .hero-topline .hero-location  {
    max-width: none;
    font-size: clamp(12px, 3.3vw, 16px);
    letter-spacing: -0.1px;
    line-height: 1.3;
    white-space: normal;
  }
  .hero-topline .hero-descriptor { max-width: 58%; }
  .hero-topline .hero-location { flex-basis: 34%; }
  .estimate-hint  {
    margin-top: 13px;
    font-size: 10px;
  }
  .art-ticket > span  {
    font-size: 40px;
  }
  .art-ticket small  {
    font-size: 9px;
  }
  .hero-ribbon  {
    padding: 8px 4vw;
    gap: 6px;
    font-size: 12px;
    letter-spacing: -0.2px;
  }
  .hero-ribbon > a  {
    flex-direction: column;
    gap: 3px;
    padding: 5px 0;
    min-height: 48px;
  }
  .hero-ribbon > span  {
    font-size: 18px;
  }
  .hero-ribbon > a span  {
    font-size: 13px;
  }
  .fact strong  {
    font-size: 23px;
    max-width: 56%;
  }
  .fact span  {
    max-width: 40%;
    font-size: 11px;
  }
  .service-tab  {
    font-size: 11px;
  }
  .service-illustration  {
    width: calc(100% - 5px);
    min-height: 0;
  }
  .service-illustration .visual-caption  {
    left: 8px;
    right: 8px;
    bottom: 8px;
    font-size: 8px;
  }
  .review-dock  {
    bottom: 14px;
    max-width: calc(100vw - 28px);
  }
}

/* September readability and brand refinements. */
.motion-v21 .eyebrow { font-size: 13.2px; }
.motion-v21 .section-head .eyebrow,
.motion-v21 .service-copy > .eyebrow { font-size: 12px; }
.motion-v21 .hero-topline .eyebrow { font-size: clamp(12px, 1.8vw, 18px); }
.hero-location, .location-link { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .22em; }
.hero-location:hover, .location-link:hover { text-decoration-thickness: 2px; }
.connected-art { container-type: inline-size; }
.giant-ps, .giant-prs { font-size: clamp(48px, 34cqw, 185px); white-space: nowrap; }
.brand-ellipsis { font-size: .65em; letter-spacing: -.05em; }
@media (max-width: 640px) {
  .motion-v21 .hero-topline .eyebrow { font-size: clamp(12px, 3.3vw, 16px); }
  .motion-v21 .service-copy > .eyebrow { font-size: 10.8px; }
}