/* Final layout and interaction layer. */
.work--brown .rating i { background: transparent url("assets/supplied-star-olive.png") center/contain no-repeat; }

.work-asset > .asset-doodle {
  top: 101%; left: 25%; right: auto;
  width: clamp(8rem, 13vw, 13rem); height: clamp(8rem, 13vw, 13rem);
  transform: translate(-50%, .75rem) rotate(-9deg); opacity: .76;
}
.issue-doodle { display:none; }
#issue-002 .work-asset > .symbol-eye {
  left: 76%; width: clamp(10rem, 16vw, 16rem); height: clamp(9rem, 14vw, 14rem);
  transform: translate(-50%, .75rem) rotate(9deg);
}
#issue-003 .work-asset > .symbol-cross {
  top: 104%; left: 20%; width: clamp(9rem, 14vw, 14rem); height: clamp(9rem, 14vw, 14rem);
  background-image: url("assets/supplied-cross-brown.png?v=clean-2");
}

.work-project-image {
  position:absolute; z-index:1; inset:0; width:100%; height:100%; object-fit:cover;
  filter:brightness(.8);
  clip-path:polygon(7.6% 17.8%,11.4% 12.3%,17.2% 10%,22.8% 6.8%,29.6% 8.6%,36.2% 6.9%,42.6% 9.8%,49.2% 8.5%,55.6% 11.4%,61.7% 10.6%,68% 14.5%,74.3% 16.8%,78.7% 22.3%,84.1% 25.8%,86.9% 32.2%,90.8% 38%,90% 44.9%,93.4% 51.8%,91.6% 58.9%,93.4% 66.8%,90.1% 72.6%,91% 79.5%,85.8% 84%,82.1% 90.2%,75.3% 91.1%,69.7% 94.9%,62.9% 93.4%,56.2% 96.5%,49.6% 94%,42.9% 96%,36.2% 92.9%,29.6% 93.5%,23.9% 89.4%,17.8% 87.8%,14.7% 81.7%,9.8% 78.5%,8.7% 71.7%,5.2% 66.6%,6.4% 60.2%,3.6% 53.8%,5.7% 47.2%,4.4% 40.6%,7.2% 34.5%,5.9% 27.1%,7.2% 20.5%);
}
.work-asset::before,
.work-asset::after {
  content:""; position:absolute; z-index:2; inset:0; pointer-events:none;
  clip-path:polygon(7.6% 17.8%,11.4% 12.3%,17.2% 10%,22.8% 6.8%,29.6% 8.6%,36.2% 6.9%,42.6% 9.8%,49.2% 8.5%,55.6% 11.4%,61.7% 10.6%,68% 14.5%,74.3% 16.8%,78.7% 22.3%,84.1% 25.8%,86.9% 32.2%,90.8% 38%,90% 44.9%,93.4% 51.8%,91.6% 58.9%,93.4% 66.8%,90.1% 72.6%,91% 79.5%,85.8% 84%,82.1% 90.2%,75.3% 91.1%,69.7% 94.9%,62.9% 93.4%,56.2% 96.5%,49.6% 94%,42.9% 96%,36.2% 92.9%,29.6% 93.5%,23.9% 89.4%,17.8% 87.8%,14.7% 81.7%,9.8% 78.5%,8.7% 71.7%,5.2% 66.6%,6.4% 60.2%,3.6% 53.8%,5.7% 47.2%,4.4% 40.6%,7.2% 34.5%,5.9% 27.1%,7.2% 20.5%);
}
.work-asset::before {
  background:rgba(25,14,8,.01);
  box-shadow:inset -18px -20px 26px rgba(23,12,6,.62), inset 8px 9px 16px rgba(255,247,232,.16);
  filter:drop-shadow(8px 13px 10px rgba(20,10,5,.38));
}
.work-asset::after {
  background:radial-gradient(ellipse at 38% 32%, transparent 44%, rgba(21,11,6,.25) 100%);
  mix-blend-mode:multiply;
}
.project-image--juno { object-position:center 28%; }
.project-image--elbocone { object-position:center; }
.testimonial-paper-base {
  position:absolute; inset:-5% -7%; width:114%; height:110%; object-fit:contain;
}
.testimonial-paper-base { z-index:2; }
.testimonial-paper-shadow { z-index:1; pointer-events:none; }
.testimonial-clean-rim { z-index:3; pointer-events:none; }
.testimonial-body-photo {
  filter:brightness(.8);
}
#work .work-asset::before,
#work .work-asset::after,
#issue-002 .work-asset::before,
#issue-002 .work-asset::after,
#issue-003 .work-asset::before,
#issue-003 .work-asset::after { content:none; }

.hero-actions, .project-actions, .contact-links { display:flex; flex-wrap:wrap; gap:clamp(1.75rem,3.5vw,4rem); align-items:center; }
.project-actions { margin-top:.25rem; }
.project-actions--stacked { flex-direction:column; align-items:flex-start; gap:1.35rem; }
.social-actions { display:flex; flex-wrap:wrap; gap:clamp(1.5rem,3vw,3rem); }
.project-outcome { max-width:31rem; margin:0 0 1.6rem; font-size:clamp(.95rem,1.05vw,1.08rem); line-height:1.55; }
.hero::before { content:none; background:none; }
.hero-corner-art {
  position:absolute;
  z-index:2;
  right:-3rem;
  top:34%;
  width:clamp(30rem,42vw,48rem);
  transform:scaleX(-1);
  pointer-events:none;
  filter:drop-shadow(.35rem .55rem .65rem rgb(20 10 5 / 32%));
}
.hero-corner-art > img { display:block; width:100%; height:auto; }
.hero-henny-character {
  position:absolute;
  z-index:3;
  top:38%;
  right:clamp(12rem,24vw,22rem);
  width:clamp(18rem,24vw,28rem);
  height:auto;
  pointer-events:none;
  filter:drop-shadow(.3rem .5rem .6rem rgb(20 10 5 / 26%));
}
.hero-ideas-mark {
  position:absolute;
  z-index:3;
  top:10%;
  right:clamp(2.5rem,4.5vw,5rem);
  width:clamp(15rem,19vw,23rem);
  height:auto;
  transform:rotate(6deg);
  opacity:.76;
  pointer-events:none;
  filter:drop-shadow(.2rem .35rem .4rem rgb(20 10 5 / 18%));
}
.work:not(.work--brown) .text-cta::after,
.work:not(.work--brown) .issue-label::after { background:var(--brown); }
#work .issue-label::after,
#issue-002 .issue-label::after,
#issue-003 .issue-label::after {
  width:10.5rem;
  clip-path:polygon(0 40%,18% 28%,38% 48%,59% 27%,78% 45%,100% 34%,100% 75%,79% 66%,58% 79%,37% 63%,17% 78%,0 65%);
}
.contact-links { margin-top:2rem; }

.text-cta, .arrow-link { position:relative; border-bottom:0; }
.text-cta::after, .arrow-link::after {
  content:""; position:absolute; left:0; right:0; bottom:0; height:3px;
  background:#77785c; border-radius:50%;
  clip-path:polygon(0 40%,18% 28%,38% 48%,59% 27%,78% 45%,100% 34%,100% 75%,79% 66%,58% 79%,37% 63%,17% 78%,0 65%);
  transform:scaleX(.28); transform-origin:left; transition:transform .38s cubic-bezier(.2,.7,.2,1);
}
.text-cta:hover::after, .text-cta:focus-visible::after,
.arrow-link:hover::after, .arrow-link:focus-visible::after { transform:scaleX(1); }

.services-heading { position:relative; }
.services-heading h2 em, .studio-copy h2 em { color:#77785c; }
.services > .symbol-heart {
  top:17%; right:8%; width:clamp(8rem,13vw,13rem); height:clamp(8rem,13vw,13rem);
  transform:rotate(6deg); opacity:.7;
}
.service-card p { font-size:clamp(.95rem,1.05vw,1.08rem); line-height:1.5; }

.services .service-grid {
  border:0; gap:clamp(.65rem,1.2vw,1.2rem); align-items:stretch;
}
.services .service-card {
  min-height:0; padding:0;
  border:0; display:flex; flex-direction:column; justify-content:flex-start;
  background-color:transparent !important;
  background-position:center; background-size:100% 100%; background-repeat:no-repeat;
  -webkit-mask:none !important; mask:none !important;
  filter:drop-shadow(0 .8rem .65rem rgb(22 12 6 / 24%));
}
.services .service-card:nth-child(1) { aspect-ratio:513 / 445; }
.services .service-card:nth-child(2) { aspect-ratio:499 / 446; }
.services .service-card:nth-child(3) { aspect-ratio:487 / 461; }
.services .service-card:nth-child(4) { aspect-ratio:504 / 483; }
.services .service-card:nth-child(1) { background-image:url("assets/service-paper-01-flat.png?v=1"); }
.services .service-card:nth-child(2) { background-image:url("assets/service-paper-02-flat.png?v=1"); }
.services .service-card:nth-child(3) { background-image:url("assets/service-paper-03-flat.png?v=1"); }
.services .service-card:nth-child(4) { background-image:url("assets/service-paper-04-flat.png?v=1"); }
.services .service-card { background-blend-mode:multiply; }
.services .service-card > * { opacity:1; position:absolute; left:18%; }
.services .service-card:nth-child(odd)>span,
.services .service-card:nth-child(odd)>h3,
.services .service-card:nth-child(odd)>p { color:var(--brown); }
.services .service-card:nth-child(even)>span,
.services .service-card:nth-child(even)>h3,
.services .service-card:nth-child(even)>p { color:var(--cream); }
.services .service-card > span { top:13%; width:max-content; padding-bottom:.4rem; border-bottom:2px solid currentColor; font:700 clamp(.64rem,.8vw,.8rem)/1 var(--mono); }
.services .service-card > h3 {
  top:33%; right:10%; margin:0; font-size:clamp(1.9rem,2.7vw,3.2rem); line-height:.95;
}
.services .service-card > p {
  top:54%; right:10%; margin:0; max-width:none; font-size:clamp(.78rem,.9vw,.95rem); line-height:1.42;
}
.services .service-card::after {
  content:"↗"; position:absolute; left:18%; top:78%; color:var(--cream);
  font:400 clamp(1.7rem,2.4vw,2.5rem)/1 var(--mono);
}
.services .service-card:nth-child(odd)::after { color:var(--brown); }
.services .service-card {
  transform-origin:center; transition:opacity .8s ease, transform .42s cubic-bezier(.2,.75,.2,1), filter .42s ease;
  will-change:transform;
}
.services .service-card:hover {
  z-index:4; transform:scale(1.055) rotate(-.7deg); filter:drop-shadow(0 1.2rem .9rem rgb(22 12 6 / 32%));
}
.services .service-card:nth-child(even):hover { transform:scale(1.055) rotate(.7deg); }

.yung-gravy-note {
  position:absolute; z-index:10; top:-2.2rem; right:2%;
  display:flex; align-items:flex-end; gap:.45rem; color:#77785c;
  text-decoration:none; transform:rotate(4deg); transition:transform .3s ease;
  animation:yung-gravy-float 2.8s ease-in-out infinite;
}
.yung-gravy-note strong { font:700 clamp(.82rem,1.05vw,1.05rem)/1.1 var(--mono); letter-spacing:.06em; text-transform:uppercase; border-bottom:2px solid currentColor; }
.yung-gravy-arrow { display:block; font:400 clamp(1.7rem,2.5vw,2.5rem)/.8 var(--hand); transform:translateY(.55rem) rotate(-8deg); }
.yung-gravy-note:hover,.yung-gravy-note:focus-visible { transform:rotate(1deg) translateY(-.2rem); }
@keyframes yung-gravy-float {
  0%,100% { translate:0 0; }
  50% { translate:0 .28rem; }
}

.home-booking {
  position:relative; display:grid; grid-template-columns:40% 60%; padding-top:0;
  background:var(--brown); color:var(--cream); overflow:hidden;
  border-top:1px solid rgb(238 231 220 / 28%);
}
.home-booking::before { content:none; }

.homepage-footer::before {
  background-image:url("assets/transition-brown-beige.png");
}
.home-booking .form-intro { min-height:52rem; }
.home-booking .form-intro h2 {
  margin:clamp(3rem,5vw,5rem) 0 1.75rem; font:900 clamp(4.3rem,7vw,7rem)/.82 var(--display);
  letter-spacing:-.055em; text-transform:uppercase;
}
.home-booking .form-intro h2 em { color:#77785c; font:inherit; }
.home-booking .form-panel { align-self:center; }
.form-botcheck { position:absolute !important; left:-9999px !important; }

.studio-copy > .symbol-ideas {
  top:8%; right:7%; width:clamp(8rem,13vw,13rem); height:clamp(6rem,10vw,10rem);
  background-image:url("assets/supplied-ideas-olive.png"); transform:rotate(-2deg); opacity:.65;
}

.services,.studio,.contact { font-family:var(--mono); }
.services-heading h2,.service-card h3,.studio-copy h2,.contact-copy h2 {
  font-family:var(--display); font-style:normal; font-weight:900;
}
.services-heading h2 em,.studio-copy h2 em { font:inherit; }

.inner-page { background:var(--brown); color:var(--cream); font-family:var(--mono); }
.inner-page .site-header { background:var(--brown); }
.editorial-page,.form-page { min-height:calc(100vh - 6.75rem); }
.inner-hero,.form-intro { padding:clamp(5rem,9vw,9rem) var(--gutter); position:relative; }
.inner-hero::after {
  content:""; position:absolute; z-index:2; left:0; right:0; bottom:-3.25vw; height:6.510417vw;
  background:url("assets/transition-brown-beige.png") center/100% 100% no-repeat; pointer-events:none;
}
.inner-hero h1,.form-intro h1,.editable-story h2 {
  margin:2.5rem 0; font:900 clamp(4rem,8vw,8rem)/.9 var(--display); letter-spacing:-.055em; text-transform:uppercase;
}
.form-intro h1 { font-size:clamp(3.25rem,5vw,5rem); overflow-wrap:anywhere; }
.inner-hero h1 em,.form-intro h1 em { color:#77785c; font:inherit; }
.page-lede,.form-intro>p:last-child { max-width:42rem; font:700 clamp(.9rem,1.2vw,1.15rem)/1.6 var(--mono); text-transform:uppercase; }
.editable-story { position:relative; padding:clamp(6rem,10vw,10rem) var(--gutter); background:var(--cream); color:var(--brown); }
.editable-story h2 { max-width:60rem; font-size:clamp(3rem,6vw,6rem); }
.editable-story>p:not(.meta-label) { max-width:48rem; font-size:clamp(1rem,1.25vw,1.2rem); line-height:1.7; }
.editable-story>.symbol-ideas { top:12%; right:7%; width:12rem; height:9rem; background-image:url("assets/supplied-ideas-brown.png"); }

.about-page .inner-hero {
  min-height: clamp(26rem, 52vh, 35rem);
  display: flex; flex-direction: column; justify-content: center;
}
.about-page .inner-hero h1 { max-width: 72rem; }
.about-page .page-lede { margin-bottom: 1.5rem; }
.about-story { min-height: clamp(36rem, 72vh, 50rem); overflow:hidden; }
.about-story h2 { max-width: 52rem; margin-bottom: clamp(2rem,4vw,4rem); }
.about-copy { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(2rem,6vw,7rem); width:100%; max-width:76rem; margin-inline:auto; padding-inline:0; }
.about-copy-block { min-width:0; }
.about-copy-block p { margin:0 0 1.25rem; font-size:clamp(1rem,1.25vw,1.2rem); line-height:1.7; }
.about-subhead { margin:0 0 1rem; font:700 .875rem/1.35 var(--mono); letter-spacing:.07em; text-transform:uppercase; }
.about-story .about-subhead { color:var(--brown); }
.about-actions { display:flex; flex-wrap:wrap; gap:clamp(2rem,4vw,4rem); margin-top:clamp(3rem,5vw,5rem); }
.about-story>.symbol-ideas { top:9%; right:4%; width:11rem; height:8.5rem; opacity:.62; clip-path:none; background-image:url("assets/supplied-ideas-brown-clean.png?v=1"); background-size:contain; background-position:center; }
.about-footer-band {
  position:relative; min-height:clamp(36rem,58vw,54rem);
  display:flex; align-items:center;
  padding:clamp(8rem,12vw,12rem) var(--gutter);
  background:var(--brown); color:var(--cream);
}
.about-footer-band::before {
  content:""; position:absolute; z-index:2; left:0; right:0; top:-1px; height:6.510417vw;
  background:url("assets/transition-beige-brown.png") center/100% 100% no-repeat; pointer-events:none;
}
.about-footer-band::after {
  content:""; position:absolute; z-index:2; left:0; right:0; bottom:-1px; height:6.510417vw;
  background:url("assets/transition-brown-beige.png") center/100% 100% no-repeat; pointer-events:none;
}
.about-page .site-footer { padding-top:clamp(3rem,5vw,5rem); }
.about-page .site-footer::before { content:none; }
.about-founder-content { position:relative; z-index:3; width:min(100%,82rem); margin:0 auto; font-family:var(--mono); }
.about-founder-content h2 {
  max-width:74rem; margin:clamp(2rem,3.5vw,3.5rem) 0 clamp(2.75rem,5vw,4.75rem);
  font:900 clamp(3.5rem,7vw,7rem)/.9 var(--display);
  letter-spacing:-.055em; text-transform:uppercase;
}
.about-founder-content h2 em { color:#77785c; font:inherit; }
.about-founder-copy {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(2.5rem,6vw,7rem);
  max-width:76rem; margin-bottom:clamp(2.75rem,4.5vw,4.5rem); padding-top:clamp(1.5rem,2.5vw,2.25rem);
  border-top:1px solid rgb(238 231 220 / 28%);
}
.about-founder-copy .about-copy-block { min-width:0; }
.about-founder-copy p { margin:0 0 1.25rem; font:400 clamp(1rem,1.2vw,1.15rem)/1.75 var(--mono); }
.about-founder-copy .about-subhead { color:#77785c; }
.about-founder-content .text-cta { color:var(--cream); }
.about-founder-mark {
  top:17%; right:6%; width:clamp(8rem,13vw,13rem); height:clamp(8rem,13vw,13rem);
  background-image:url("assets/supplied-star-olive.png"); opacity:.72; transform:rotate(7deg);
}

.reveal {
  opacity:0; transform:translateY(1.5rem) scale(.995); filter:blur(1.5px);
  transition:opacity .68s ease var(--reveal-delay,0ms), transform .78s cubic-bezier(.18,.75,.2,1) var(--reveal-delay,0ms), filter .55s ease var(--reveal-delay,0ms);
}
.reveal.is-visible { opacity:1; transform:none; filter:none; }

.turnt-click-pulse {
  position:fixed; z-index:9999; pointer-events:none; translate:-50% -50%;
}
.turnt-click-pulse { width:16px; height:16px; border:2px dashed #77785c; border-radius:50%; animation:turnt-pulse .55s ease-out forwards; }
@keyframes turnt-pulse { to { width:72px; height:72px; opacity:0; rotate:35deg; } }

.site-loader {
  position:fixed; inset:0; z-index:10000; display:grid; place-items:center;
  background:var(--brown); color:var(--cream); opacity:1; visibility:visible;
  transition:opacity .5s ease,visibility .5s ease;
}
.site-loader__inner { display:grid; justify-items:center; gap:1.2rem; }
.site-loader__logo { display:block; width:clamp(10rem,22vw,17rem); height:auto; }
.site-loader__line { width:clamp(6rem,12vw,10rem); height:3px; background:#77785c; transform-origin:left; animation:turnt-load-line 1.1s ease-in-out infinite; }
body.is-loaded .site-loader { opacity:0; visibility:hidden; pointer-events:none; }
@keyframes turnt-load-line { 0% { transform:scaleX(.12); } 55% { transform:scaleX(1); } 100% { transform:scaleX(.12); transform-origin:right; } }

.contact-bubble {
  position:fixed; z-index:90; right:clamp(.8rem,1.7vw,1.5rem); bottom:clamp(6rem,11vh,8rem);
  display:inline-flex; align-items:center; gap:.55rem; padding:1rem 1.3rem;
  border:1px solid rgb(238 231 220 / 42%); border-radius:999px;
  background:#77785c; color:var(--cream); box-shadow:0 .65rem 1.2rem rgb(20 10 5 / 24%);
  font:700 .78rem/1 var(--mono); letter-spacing:.05em; text-decoration:none; text-transform:uppercase;
  transition:transform .25s ease,box-shadow .25s ease;
}
.contact-bubble:hover,.contact-bubble:focus-visible { transform:translateY(-.2rem) rotate(-1deg); box-shadow:0 .9rem 1.4rem rgb(20 10 5 / 30%); }

/* Compact, API-free TURNT Dino assistant. */
.turnt-assistant { position:fixed; z-index:92; left:50%; right:auto; bottom:clamp(9.5rem,18vh,12rem); width:max-content; display:grid; justify-items:center; font-family:var(--mono); color:var(--brown); transform:translateX(-50%); }
.turnt-assistant__trigger { display:grid; justify-items:center; gap:.15rem; border:0; padding:0; background:none; color:var(--cream); cursor:pointer; }
.turnt-assistant__label { padding:.35rem .65rem; border-radius:.45rem; background:var(--cream); color:var(--brown); font:700 .68rem/1 var(--mono); letter-spacing:.06em; text-transform:uppercase; box-shadow:0 .25rem .7rem rgb(20 10 5 / 16%); }
.turnt-assistant__dino { display:block; width:clamp(5.8rem,8vw,9rem); height:auto; image-rendering:auto; filter:drop-shadow(0 .35rem .35rem rgb(20 10 5 / 22%)); }
.turnt-assistant__panel { position:absolute; right:0; bottom:calc(100% + .6rem); width:min(23rem,calc(100vw - 2rem)); height:18rem; display:grid; grid-template-rows:auto minmax(0,1fr) auto auto; margin:0; overflow:hidden; border:1px solid rgb(64 47 33 / 20%); border-radius:1rem; background:var(--cream); box-shadow:0 1rem 2.5rem rgb(20 10 5 / 28%); }
.turnt-assistant__panel[hidden] { display:none; }
.turnt-assistant__header { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; padding:1rem 1rem .8rem; background:var(--brown); color:var(--cream); }
.turnt-assistant__header h2 { display:flex; align-items:center; flex-wrap:wrap; gap:.45rem; margin:0; font:900 1.15rem/1 var(--display); letter-spacing:-.04em; text-transform:uppercase; }
.turnt-assistant__header h2 small { color:#78a9e8; font:700 .55rem/1 var(--mono); letter-spacing:.06em; text-transform:uppercase; }
.turnt-assistant__header p { margin:.3rem 0 0; font:400 .72rem/1.3 var(--mono); }
.turnt-assistant__close { display:grid; place-items:center; width:2.25rem; height:2.25rem; flex:0 0 2.25rem; border:0; border-radius:50%; background:rgb(238 231 220 / 10%); color:var(--cream); font:400 1.75rem/1 var(--mono); cursor:pointer; }
.turnt-assistant__close:hover { background:rgb(238 231 220 / 20%); }
.turnt-assistant__messages { min-height:0; display:grid; align-content:start; gap:.55rem; overflow:auto; padding:.85rem 1rem .4rem; }
.turnt-assistant__message { max-width:88%; margin:0; padding:.6rem .7rem; border-radius:.65rem; font:400 .76rem/1.45 var(--mono); }
.turnt-assistant__message a { color:inherit; font-weight:700; text-decoration:underline; text-underline-offset:2px; }
.turnt-assistant__message--assistant { justify-self:start; background:#e2d7c8; }
.turnt-assistant__message--visitor { justify-self:end; background:#77785c; color:var(--cream); }
.turnt-assistant__suggestions { display:flex; flex-wrap:wrap; gap:.35rem; padding:.45rem 1rem .7rem; }
.turnt-assistant__suggestions button { border:1px solid rgb(64 47 33 / 28%); border-radius:999px; padding:.4rem .55rem; background:transparent; color:var(--brown); font:400 .62rem/1.1 var(--mono); cursor:pointer; }
.turnt-assistant__suggestions button:hover { background:#e2d7c8; }
.turnt-assistant__form { display:flex; gap:.45rem; padding:.45rem 1rem .8rem; border-top:1px solid rgb(64 47 33 / 18%); }
.turnt-assistant__form input { min-width:0; flex:1; border:1px solid rgb(64 47 33 / 24%); border-radius:.45rem; padding:.55rem .65rem; background:#f2eadf; color:var(--brown); font:400 .68rem/1.2 var(--mono); }
.turnt-assistant__form input::placeholder { color:rgb(64 47 33 / 60%); }
.turnt-assistant__form button { border:1px solid #77785c; border-radius:.45rem; padding:.55rem .7rem; background:#77785c; color:var(--cream); font:700 .65rem/1 var(--mono); cursor:pointer; }
.turnt-assistant__form button:hover { filter:brightness(1.08); }
.turnt-assistant__trigger:focus-visible { outline:none; }
.turnt-assistant__close:focus-visible, .turnt-assistant__suggestions button:focus-visible, .turnt-assistant__form button:focus-visible, .turnt-assistant__form input:focus-visible { outline:2px solid currentColor; outline-offset:3px; }
@media (max-width:850px) { .turnt-assistant { bottom:10.5rem; } .turnt-assistant__dino { width:5.5rem; } }
@media (max-width:600px) {
  .contact-bubble { bottom:clamp(7rem,13vh,8.5rem); }
  .turnt-assistant { bottom:13rem; }
  .turnt-assistant__label { font-size:.6rem; }
  .turnt-assistant__dino { width:4.6rem; }
  .turnt-assistant__panel { width:min(22rem,calc(100vw - 1.5rem)); height:min(20rem,calc(100dvh - 19rem)); }
  .turnt-assistant__form input { font-size:16px; }
}

/* Keep the floating controls out of the mobile/tablet hero, then reveal them
   together once the visitor reaches the page content. */
@media (max-width:850px) {
  .contact-bubble,
  .turnt-assistant {
    transition: opacity .45s ease, transform .45s ease, visibility .45s ease;
  }

  body.mobile-tools-hide .contact-bubble,
  body.mobile-tools-hide .turnt-assistant {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }

  body.mobile-tools-hide .contact-bubble { transform: translateY(1rem); }
  body.mobile-tools-hide .turnt-assistant { transform: translate(-50%, 1rem); }
}
@media (prefers-reduced-motion:reduce) { .turnt-assistant__dino { animation:none; } }

.renovation-footer { min-height:8rem; padding-top:2rem; }
.renovation-footer::before { content:none; }
.renovation-page .inner-hero::after { content:none; }
.renovation-page .renovation-footer::before {
  content:"";
  position:absolute;
  z-index:6;
  top:0;
  left:0;
  right:0;
  height:6.510417vw;
  background:url("assets/transition-brown-beige.png") center/100% 100% no-repeat;
  pointer-events:none;
}

.form-page { display:grid; grid-template-columns:minmax(20rem,.8fr) minmax(30rem,1.2fr); }
.form-intro { display:flex; flex-direction:column; justify-content:center; }
.form-panel { position:relative; padding:clamp(4rem,7vw,7rem) var(--gutter); background:var(--cream); color:var(--brown); }
.work-form { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
.work-form label { display:grid; gap:.6rem; font:700 .75rem var(--mono); letter-spacing:.06em; text-transform:uppercase; }
.work-form input,.work-form select,.work-form textarea {
  width:100%; padding:1rem .2rem; border:0; border-bottom:1px solid rgb(64 47 33/.48); border-radius:0;
  background:transparent; color:var(--brown); font:1rem var(--mono);
}
.work-form textarea { border:1px solid rgb(64 47 33/.38); padding:1rem; resize:vertical; }
.form-wide { grid-column:1/-1; }
.form-submit { justify-self:start; padding:.9rem 0; border:0; border-bottom:2px solid #77785c; background:transparent; color:var(--brown); font:700 .85rem var(--mono); letter-spacing:.06em; text-transform:uppercase; cursor:pointer; }
.w-form-done,.w-form-fail { display:none; margin:1.5rem 0 0; padding-top:1.25rem; border-top:1px solid rgb(64 47 33/.28); color:var(--brown); font:600 .9rem/1.45 var(--mono); }

.hero-copy .meta-label::after {
  height:3px;
  background:#77785c;
  border-radius:50%;
  clip-path:polygon(0 38%,17% 26%,35% 47%,54% 29%,72% 49%,100% 31%,100% 72%,73% 65%,53% 80%,34% 64%,16% 78%,0 63%);
}

@media(max-width:850px){
  .work-asset>.asset-doodle { top:96%; width:7rem; height:7rem; }
  .services>.symbol-heart { top:18%; right:5%; width:7rem; height:7rem; }
  .form-page { grid-template-columns:1fr; }
  .work-form { grid-template-columns:1fr; }
  .form-wide { grid-column:auto; }
  .about-page .inner-hero { min-height:28rem; }
  .about-footer-band { min-height:32rem; }
  .about-copy { grid-template-columns:1fr; gap:1.25rem; padding-inline:0; }
  .about-story>.symbol-ideas { top:7%; right:3%; width:7rem; height:5rem; }
  .yung-gravy-note { top:8rem; right:var(--gutter); }
  .services .service-card { min-height:0; }
  .home-booking { grid-template-columns:1fr; overflow:visible; }
  .home-booking .form-intro { min-height:44rem; }
}

@media(prefers-reduced-motion:reduce){
  .reveal,.reveal.is-visible,.services .service-card,.yung-gravy-note { transition:none; transform:none; filter:none; opacity:1; animation:none; }
  .site-loader__line { animation:none; transform:scaleX(1); }
}

/* Focused iPhone and narrow-screen fit. */
html {
  max-width:100%;
  -webkit-text-size-adjust:100%;
}
body { max-width:100%; }
img,svg,video { max-width:100%; }
button,a,input,select,textarea { touch-action:manipulation; }
.site-header {
  padding-left:max(var(--gutter),env(safe-area-inset-left));
  padding-right:max(var(--gutter),env(safe-area-inset-right));
}
.contact-bubble {
  right:max(clamp(.8rem,1.7vw,1.5rem),env(safe-area-inset-right));
  bottom:max(clamp(6rem,11vh,8rem),calc(env(safe-area-inset-bottom) + 5rem));
}

@media(max-width:850px){
  .site-header {
    height:calc(4.75rem + env(safe-area-inset-top));
    padding-top:env(safe-area-inset-top);
  }
  .brand-reference { width:min(9.25rem,42vw); }
  .menu-toggle { min-width:3rem; min-height:3rem; text-align:right; }
  .navigation {
    top:calc(4.75rem + env(safe-area-inset-top));
    max-height:calc(100dvh - 4.75rem - env(safe-area-inset-top));
    overflow-y:auto;
    padding-left:max(var(--gutter),env(safe-area-inset-left));
    padding-right:max(var(--gutter),env(safe-area-inset-right));
    padding-bottom:max(2rem,env(safe-area-inset-bottom));
  }

  .hero-copy,
  .hero-copy.reveal,
  .hero-copy.reveal.is-visible {
    padding-top:max(7.25rem,calc(5.75rem + env(safe-area-inset-top)));
    padding-left:max(var(--gutter),env(safe-area-inset-left));
    padding-right:max(var(--gutter),env(safe-area-inset-right));
  }
  .hero-copy h1 { max-width:100%; overflow-wrap:normal; }
  .hero-intro { max-width:31rem; }
  .hero-actions { row-gap:1rem; }
  .hero-footer {
    padding-left:max(var(--gutter),env(safe-area-inset-left));
    padding-right:max(var(--gutter),env(safe-area-inset-right));
  }

  .work { overflow-x:clip; }
  .work-layout { min-width:0; }
  .work-asset { width:calc(100% - 1.25rem); max-width:42rem; }
  .issue-copy,
  .issue-copy.reveal,
  .issue-copy.reveal.is-visible {
    width:100%;
    max-width:100%;
    transform:none;
  }
  .issue-copy h2 { max-width:100%; overflow-wrap:normal; }
  .issue-copy blockquote,
  .project-outcome { max-width:100%; }
  .project-actions,.social-actions { row-gap:1rem; }
  .yung-gravy-note { top:-1.5rem; right:0; }

  .section,.editable-story,.inner-hero,.form-intro {
    padding-left:max(var(--gutter),env(safe-area-inset-left));
    padding-right:max(var(--gutter),env(safe-area-inset-right));
  }
  .services-heading h2,.inner-hero h1,.editable-story h2 { overflow-wrap:normal; }
  .about-page .inner-hero { padding-top:max(7rem,calc(5.25rem + env(safe-area-inset-top))); }
  .about-footer-band { min-height:max(32rem,68svh); }
  .about-founder-copy { grid-template-columns:1fr; gap:1.25rem; }
  .about-founder-mark { top:9%; right:4%; width:7rem; height:7rem; }
  .site-footer {
    padding-left:max(var(--gutter),env(safe-area-inset-left));
    padding-right:max(var(--gutter),env(safe-area-inset-right));
    padding-bottom:max(2rem,env(safe-area-inset-bottom));
  }
}

@media(max-width:600px){
  .hero { min-height:max(56rem,100svh); }
  .hero-copy,
  .hero-copy.reveal,
  .hero-copy.reveal.is-visible { padding-bottom:23rem; }
  .hero-copy h1 { font-size:clamp(3.15rem,16.5vw,4.65rem); line-height:1; }
  .hero-intro { font-size:.72rem; line-height:1.5; }
  .hero-footer { grid-template-columns:1fr auto; gap:.75rem; }
  .hero-footer p { font-size:.52rem; }

  .work { padding:3.5rem max(var(--gutter),env(safe-area-inset-left)) 5rem; }
  .work-layout,
  #work .work-layout,
  #issue-003 .work-layout { gap:2rem; }
  #issue-002 { padding-bottom:7rem; }
  .work-asset { width:calc(100% - 1rem); }
  .testimonial-paper-base { inset:-1% -2%; width:104%; height:102%; }
  .work-asset>.asset-doodle,
  #issue-002 .work-asset>.symbol-eye,
  #issue-003 .work-asset>.symbol-cross { display:none; }
  .issue-copy { position:relative; padding-right:0; }
  .issue-copy>.issue-doodle {
    display:block; position:absolute; z-index:1; top:7.3rem; right:.1rem;
    width:5.25rem; height:5.25rem; opacity:.72; transform:rotate(15deg);
  }
  #work .issue-copy>.issue-doodle { top:9.75rem; }
  #issue-002 .issue-copy>.issue-doodle { width:7.85rem; height:7.85rem; transform:rotate(7deg); }
  #issue-003 .issue-copy>.issue-doodle { top:6.2rem; width:6.1rem; height:6.1rem; transform:rotate(12deg); }
  .issue-copy h2 { font-size:clamp(3.35rem,17vw,5rem); line-height:.94; }
  .rating { max-width:100%; gap:.18rem; }
  .rating i { flex-basis:clamp(1.85rem,10vw,2.35rem); }
  .project-actions,.social-actions { gap:1rem 1.5rem; }
  .project-actions--stacked { gap:1.15rem; }
  .yung-gravy-note { top:-1.1rem; right:-.1rem; }
  .yung-gravy-note strong { font-size:1.05rem; }
  .yung-gravy-arrow { font-size:1.55rem; }

  .section { padding-top:6rem; padding-bottom:6rem; }
  .services-heading { margin:3rem 0 4rem; }
  .services-heading h2 { font-size:clamp(3.2rem,15vw,4.8rem); line-height:1; }
  .services>.symbol-heart { top:18.3rem; right:1.25rem; width:4.5rem; height:4.5rem; background-position:center -.35rem; }
  .services .service-grid { grid-template-columns:1fr; gap:1rem; }
  .services .service-card { width:calc(100% - 1rem); min-height:20rem; margin-inline:auto; background-size:92% 92%; }
  .services .service-card > h3 { font-size:clamp(2rem,10vw,3rem); }
  .services .service-card > p { font-size:clamp(.78rem,3.8vw,.95rem); }
  .services .service-card::after { top:86%; }

  .inner-hero h1 { font-size:clamp(3rem,15vw,4.75rem); line-height:.92; }
  .page-lede { font-size:.8rem; }
  .editable-story { padding-top:6rem; padding-bottom:6rem; }
  .editable-story h2 { max-width:calc(100% - 1rem); font-size:clamp(2.8rem,14vw,4.5rem); line-height:.92; }
  .about-story>.symbol-ideas { top:1.75rem; right:max(var(--gutter),env(safe-area-inset-right)); width:4.5rem; height:3.5rem; }
  .about-footer-band { min-height:max(42rem,82svh); padding-top:7rem; padding-bottom:7rem; }
  .about-founder-content h2 { max-width:100%; font-size:clamp(3rem,15vw,4.75rem); }
  .about-founder-lede,.about-founder-copy p { font-size:.92rem; }
  .about-founder-mark { top:3.75rem; right:max(var(--gutter),env(safe-area-inset-right)); width:5rem; height:5rem; }

  .contact-bubble {
    padding:.9rem 1.1rem;
    font-size:.7rem;
    bottom:max(clamp(8rem,16vh,10rem),calc(env(safe-area-inset-bottom) + 7rem));
  }
  .site-footer { grid-template-columns:1fr; gap:1rem; padding-bottom:max(5rem,calc(2rem + env(safe-area-inset-bottom))); }
  .site-footer a { grid-column:auto; justify-self:start; }
}

@media(hover:none),(pointer:coarse){
  .services .service-card:hover,
  .services .service-card:nth-child(even):hover { z-index:auto; transform:none; filter:drop-shadow(0 .8rem .65rem rgb(22 12 6 / 24%)); }
  .contact-bubble:hover { transform:none; }
}

@media(max-width:600px){
  .hero::before {
    inset:0;
    height:auto;
    background-size:auto 88%;
    background-position:center;
    transform:translate(-2.5rem,5.5rem) scaleX(1.24) scaleY(1.1);
    transform-origin:center;
  }
  .reference-crown--hero { top:16.5%; right:4%; width:7rem; }
  .hero-footer { background:var(--brown); }
  .hero-copy h1 { font-size:clamp(2.75rem,12vw,3.2rem); }
  .hero-actions { flex-direction:column; align-items:flex-start; gap:.75rem; }
  .hero-corner-art {
    left:-2.25rem;
    right:auto;
    top:53%;
    width:min(92vw,23rem);
    transform:none;
  }
  .hero-henny-character {
    top:54%;
    right:-3rem;
    width:min(52vw,13rem);
  }
.hero-ideas-mark { display:none; }
}

/* Desktop resilience pass: keep the service papers readable at every desktop width
   and leave the hero footer copy clear of the decorative collage. */
@media (min-width:601px) and (max-width:1350px) {
  .services .service-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:clamp(1rem,1.8vw,1.5rem);
  }
  .services .service-card {
    min-height:clamp(20rem,33vw,25rem);
  }
  .services .service-card > h3 {
    font-size:clamp(2.45rem,4.75vw,3.55rem);
  }
  .services .service-card > p {
    font-size:clamp(.86rem,1.25vw,1rem);
  }
}

.services .service-card:nth-child(1) { background-image:url("assets/service-paper-01-flat.png?v=2"); }
.services .service-card:nth-child(2) { background-image:url("assets/service-paper-02-flat.png?v=2"); }
.services .service-card:nth-child(3) { background-image:url("assets/service-paper-03-flat.png?v=2"); }
.services .service-card:nth-child(4) { background-image:url("assets/service-paper-04-flat.png?v=2"); }
.services .service-grid { align-items:start; }
.services .service-card { align-self:start; }

@media (min-width:601px) {
  /* Keep the desktop hero links comfortably clear of the footer divider by
     giving the whole copy block a little more room above it. */
  .hero-copy,
  .hero-copy.reveal,
  .hero-copy.reveal.is-visible {
    padding-top:clamp(7rem,8vw,8rem);
  }
  .hero-actions {
    position:static;
    top:auto;
  }
  .hero-intro { margin-bottom:clamp(1.5rem,2vw,2rem); }
  .hero-corner-art {
    top:36%;
    right:-1.5rem;
    width:clamp(22rem,30vw,38rem);
  }
  .hero-footer {
    z-index:6;
    background:var(--brown);
  }
  .hero-ideas-mark {
    top:10%;
    right:clamp(1.75rem,3.5vw,4rem);
    width:clamp(10rem,12vw,14rem);
    opacity:.68;
  }
  .reference-crown--hero {
    top:22%;
    right:-5%;
    width:clamp(5.75rem,7vw,8rem);
  }
}

/* Keep the testimonial doodles inside their paper section on desktop. The
   torn transition belongs to the next section, so artwork should not sit
   underneath it and appear clipped. */
@media (min-width:851px) {
  .work-asset > .asset-doodle,
  #issue-002 .work-asset > .symbol-eye,
  #issue-003 .work-asset > .symbol-cross {
    top:82%;
    transform:translate(-50%, -50%) rotate(-9deg);
  }
  #issue-002 .work-asset > .symbol-eye {
    transform:translate(-50%, -50%) rotate(9deg);
  }
}

/* Final composition pass: keep the hero artwork balanced at wide Safari
   widths and give the paper sections enough breathing room. */
@media (min-width:851px) {
  .hero-henny-character {
    right:clamp(9rem,20vw,18rem);
  }
  .reference-crown--hero {
    top:21%;
    right:clamp(2rem,8vw,8rem);
    width:clamp(9rem,11vw,13rem);
  }
  .hero-ideas-mark {
    top:14%;
    right:clamp(5rem,8vw,9rem);
    transform:rotate(10deg);
  }
  .hero-copy .meta-label::after { display:none; }
  .work-asset > .asset-doodle,
  #issue-002 .work-asset > .symbol-eye,
  #issue-003 .work-asset > .symbol-cross {
    top:112%;
  }
  #issue-003 .work-asset > .symbol-cross { top:116%; }
  .yung-gravy-note { top:11%; right:7%; }
}

@media (max-width:600px) {
  .hero-henny-character { right:0; }
  .reference-crown--hero { width:8.5rem; top:15%; right:3%; clip-path:inset(0 0 0 4%); }
  .about-copy-block p,
  .about-founder-copy p { margin-bottom:.9rem; line-height:1.62; }
}

@media (min-width:851px) {
  .reference-crown--hero {
    right:1%;
    top:23%;
    width:clamp(10rem,12vw,14rem);
    clip-path:inset(0 0 0 4%);
  }
  .hero-ideas-mark {
    transform:rotate(15deg);
  }
}

/* Keep the wide desktop composition bounded. Safari reports very wide MacBook
   viewports, so allowing the service grid and booking panel to grow forever
   makes the paper artwork look stretched and leaves the copy too far apart. */
@media (min-width:1351px) {
  .services > .section-top,
  .services > .services-heading,
  .services > .service-grid {
    width: min(100%, 96rem);
    margin-inline: auto;
  }

  .issue-copy,
  .issue-copy.reveal,
  .issue-copy.reveal.is-visible {
    transform: none;
  }
}

/* Do not let the scroll-reveal transform alter absolute artwork on desktop.
   Safari can capture a wide page before an off-screen observer callback runs,
   which leaves these layers looking compressed or out of alignment. */
@media (min-width:851px) {
  .work-asset.reveal,
  .services .service-card > .reveal,
  .home-booking .form-panel > .reveal {
    opacity: 1;
    transform: none;
    filter: none;
  }
}

/* The supplied heart crop has one stray olive mark in its top edge; trim only
   that transparent margin so the heart itself remains untouched. */
.services > .symbol-heart {
  clip-path: inset(9% 0 0 0);
}

/* On the narrow iPhone layout, keep the Young Gravy credit clear of the
   artwork: the pointer sits just beneath him and the caption follows it.
   This is intentionally scoped to issue 002 on phone only. */
@media (max-width:600px) {
  #issue-002 .yung-gravy-note {
    flex-direction: column;
    align-items: center;
    gap: .35rem;
    animation: yung-gravy-wiggle 2.8s ease-in-out infinite;
  }

  #issue-002 .yung-gravy-note strong {
    order: 2;
    border-bottom: 2px solid currentColor;
  }

  #issue-002 .yung-gravy-arrow {
    order: 1;
    font-size: 0;
  }

  #issue-002 .yung-gravy-arrow::after {
    content: "↖";
    display: block;
    font: 400 1.65rem/.8 var(--hand);
    transform: translate(-.35rem, -.18rem);
  }
}

@keyframes yung-gravy-wiggle {
  0%, 100% { transform: rotate(-2deg); }
  50% { transform: rotate(2deg); }
}
