/* Each treatment borrows its light from the object on the page. */
.paper-stage {overflow:clip}
.pen-light {position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(119deg,transparent 45%,#fff8d942 58%,#ffffed36 62%,transparent 72%);mask-image:linear-gradient(0deg,transparent,#000 23% 75%,transparent)}
.hero-cta {box-shadow:inset 0 1px #eff7da44,0 6px 20px #213a2a29}
.drawing-print,.studio-print {position:relative;min-width:0;isolation:isolate}
.drawing-print {padding:clamp(5px,.7vw,10px);background:linear-gradient(120deg,#c7cbb2,#f0eedb 35%,#b5c2ae);border-radius:4px;box-shadow:0 18px 35px -23px #04160a}
.drawing-print img {border-radius:1px}
.studio-print {padding:clamp(8px,1vw,15px);background:linear-gradient(135deg,#ecebd9,#c4cfb9 72%,#dce0cb);border:1px solid #e3e6d2aa;border-radius:3px;box-shadow:0 18px 35px -20px #07190b}
.studio-print .about-image {border-radius:1px}
.studio-print::after,.studio-print::before {content:"";position:absolute;pointer-events:none}
.studio-print::after {inset:0;background:linear-gradient(115deg,transparent 16%,#fff4d72e 35%,transparent 53%)}
.studio-print::before {z-index:-1;inset:7px -3px -4px 5px;border:1px solid #93a78d;border-radius:3px}
.about-stories {border:0;position:relative}
.about-stories::before,.project-overview::after {content:"";position:absolute;inset:0 0 auto;height:1px;background:linear-gradient(90deg,transparent,#c8d5ac88 13%,#97ad8f66 70%,transparent)}
.about-stories h2::before {content:"";display:block;width:24px;height:3px;margin-bottom:14px;background:linear-gradient(90deg,#c4cbaa,#768f71);transform-origin:left}
.services-page .measure-section {background:radial-gradient(ellipse at 75% 18%,#44613d59,transparent 62%),var(--dark)}
.service-index {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:0 0 clamp(20px,3vw,40px);padding:5px clamp(5px,1vw,14px);border:1px solid #aabda03b;border-radius:8px;background:linear-gradient(108deg,#283e30,#1a2c21);box-shadow:inset 0 1px #dfebc314}
.service-index a {display:flex;align-items:center;gap:9px;min-height:44px;padding:8px clamp(8px,1.2vw,20px);color:#eaf0e4;font:500 clamp(.85rem,1.2vw,1rem)/1.3 var(--sans);text-decoration:none;border-radius:4px}
.service-index a span {color:#b4c5a9;font:.76rem/1 var(--serif);font-style:italic;font-variant-numeric:tabular-nums}
.service-index a::after {display:none}
.service-index a:is(:hover,:focus-visible) {background:#d1e1b713}
.service-portfolio article {scroll-margin-top:24px}
.digital-offer {box-shadow:0 18px 28px -26px #040f06,inset 0 1px #e7f1d733}
.service-action {text-decoration-color:currentColor}
.estimate-pair {background:radial-gradient(ellipse at 18% 4%,#faf6e8,transparent 62%),#e1e6d8}
.construction-plate {position:relative}
.construction-plate::after {content:"";position:absolute;inset:auto 0 0;height:6px;pointer-events:none;background:repeating-linear-gradient(90deg,#f6f3d891 0 1px,transparent 1px 12px);mask-image:linear-gradient(90deg,transparent,#000 15% 85%,transparent);transform-origin:0 50%}
.projects-page .work {background:radial-gradient(ellipse 75% 24rem at 84% 5rem,#3e513c70,transparent),var(--dark)}
.project-overview {position:relative;padding-bottom:clamp(20px,3vw,43px)}
.project-overview::after {inset:auto 0 0}
.projects-page .feature {position:relative;isolation:isolate}
.projects-page .feature::before {content:"";z-index:-1;position:absolute;inset:0 3% 1.6rem;pointer-events:none;background:radial-gradient(ellipse at 50% 60%,#849b6f38,transparent 67%)}
.projects-page .display::after {content:"";position:absolute;inset:12.35% 16.15% 27.85% 16.05%;pointer-events:none;background:linear-gradient(118deg,transparent 37%,#edf5ce14 53%,transparent 69%)}
.project-showcase {padding-block:4px;mask-image:linear-gradient(90deg,#000 0 95%,transparent)}
.project-showcase:focus-within {mask-image:none}
@media(max-width:720px) {
  .service-index {grid-template-columns:repeat(2,minmax(0,1fr))}
  .service-index a {padding:8px 12px}
}
@media(prefers-reduced-motion:no-preference) {
  .pen-light {animation:pen-daylight 3.4s ease-out both}
  .studio-print::after {animation:print-daylight 2.6s ease-out both}
  .service-index a,.service-action span {transition:background-color .2s,transform .2s}
  .service-action:is(:hover,:focus-visible) span {transform:translate(2px,-2px)}
  .construction-plate[data-seen]::after,.about-stories [data-seen] h2::before {animation:ruled-line .75s ease-out both}
  .projects-page .feature[data-seen] .display::after {animation:glass-light 1.9s ease-out both}
  @keyframes pen-daylight {from{transform:translateX(9%);opacity:.15}to{transform:none;opacity:1}}
  @keyframes print-daylight {from{opacity:0}to{opacity:1}}
  @keyframes ruled-line {from{transform:scaleX(.35)}to{transform:scaleX(1)}}
  @keyframes glass-light {from{background-position:100% 0;background-size:220% 100%;opacity:.3}to{background-position:40% 0;background-size:220% 100%;opacity:1}}
}

/* Keep the notice clear of the homepage actions on wider screens. */
@media (min-width: 721px) {
  body:has(.paper-stage) > .cookie-notice {
    margin-inline: auto var(--gutter);
  }
}

.projects-page .app-project { display: flex; flex-direction: column; }
.projects-page .app-caption { order: 1; }
