/*
 * ZOOTRIPPER 3.7 — Final visual audit
 * Structural collision fixes and a darker masculine mid-century finish.
 */
:root{
  --fa-black:#24251f;
  --fa-charcoal:#303128;
  --fa-olive:#565d43;
  --fa-olive-dark:#424837;
  --fa-rust:#a94f34;
  --fa-tobacco:#684a36;
  --fa-mustard:#b88b32;
  --fa-bone:#eee6d5;
  --fa-cream:#ded3bd;
  --fa-muted:#7b766a;
}

/* Decorative collision audit: no background ornament may cross live text. */
.page-hero:after,
.content-section:not(.dark-panel):before,
.cta:before,
.seo-intro:after,
.hhf-word:after,
.intro:before,
.works-home:before,
.service-closing:before,
.price-honesty:before{display:none!important;content:none!important}

/* The source pseudo-element was absolute; reset every positioning property. */
.service-catalog-copy li:before{
  content:""!important;
  position:static!important;
  inset:auto!important;
  display:inline-block!important;
  width:5px!important;
  height:5px!important;
  margin:0 .72rem .12rem 0!important;
  padding:0!important;
  background:var(--fa-rust)!important;
  border:0!important;
  border-radius:0!important;
  transform:none!important;
  vertical-align:middle!important;
}
.service-catalog-copy li{padding-left:0!important;overflow:visible}

/* Any inherited label line is removed before drawing the intentional square. */
.section-label:after,.section-label>span:after{display:none!important;content:none!important}

/* Stronger overall surface hierarchy. Mustard is now an accent, not a room. */
body{background-color:var(--fa-bone)!important;color:var(--fa-black)!important}
.site-header,.site-header>.zt-menu-panel,.site-footer{background:var(--fa-black)!important}
.page-hero{
  background:var(--fa-charcoal)!important;
  color:var(--fa-bone)!important;
}
.page-hero>p{color:#c77250!important}
.page-hero>div{color:rgba(238,230,213,.66)!important}
.page-hero h1{color:var(--fa-bone)!important}

/* Make all standard headings one muscular voice. Bookshop remains separate. */
body h1,body h2,body h3,body h4{
  font-family:var(--zt-font-jp)!important;
  font-style:normal!important;
  font-synthesis:none!important;
}
body h1,body h2{font-weight:600!important}
body h3,body h4{font-weight:600!important}
.ym-shop h1,.ym-shop h2,.ym-shop h3,.ym-single h1,.ym-single h2,.ym-single h3,
.home-yokomichi-name,.home-yokomichi h2{
  font-family:"Shippori Mincho","Yu Mincho","Hiragino Mincho ProN",serif!important;
  font-weight:400!important;
}

/* Long-form and special page headings that escaped the previous type map. */
.service-belief h2,.service-catalog h2,.service-fit h2,.service-team h2,
.service-flow h2,.service-aftercare h2,.service-closing h2,
.price-principle h2,.price-plans h2,.price-choose h2,.price-breakdown h2,
.price-included h2,.price-options h2,.running-cost h2,.price-over-million h2,
.price-honesty h2,.price-faq-link h2,.faq-directory h2,.faq-group h2,
.contact-trust h2,.contact-guide h2,.founder-story h2,.editorial-split h2,
.activity-intro h2,.activity-story h2,.activity-program h2,.activity-impact h2,
.zt-guide-hero h1,.zt-guide-layout h2,.zt-guide-cta h2{
  font-family:var(--zt-font-jp)!important;
  font-weight:600!important;
  font-style:normal!important;
  font-feature-settings:"palt" 1;
  letter-spacing:-.042em!important;
  line-height:1.32!important;
}
.service-closing h2{max-width:11em!important;font-size:clamp(2.7rem,4.2vw,4.7rem)!important}
.service-closing p{max-width:42rem!important}
.price-honesty h2{font-size:clamp(2.3rem,3.45vw,3.8rem)!important}
.faq-directory h2{font-size:clamp(2.7rem,4.2vw,4.65rem)!important}
.activity-intro h2,.activity-story h2,.activity-program h2,.activity-impact h2{font-size:clamp(2.45rem,3.7vw,4.1rem)!important}

/* SERVICE ending: one deliberate, left-aligned project invitation. */
.service-closing{
  min-height:0!important;
  padding:clamp(6rem,9vw,9rem) clamp(1.4rem,8vw,8rem)!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(240px,.42fr)!important;
  gap:clamp(3rem,8vw,8rem)!important;
  align-items:end!important;
  text-align:left!important;
  background:var(--fa-charcoal)!important;
  color:var(--fa-bone)!important;
}
.service-closing small{grid-column:1/-1;color:#c77250!important}
.service-closing h2{grid-column:1;margin:0!important;color:var(--fa-bone)!important}
.service-closing p{grid-column:1;margin:1.6rem 0 0!important;color:rgba(238,230,213,.66)!important}
.service-closing a{
  grid-column:2;
  grid-row:2/4;
  justify-self:end;
  align-self:end;
  margin:0!important;
  padding:1.15rem 1.3rem!important;
  border:0!important;
  background:var(--fa-rust)!important;
  color:#fff!important;
  border-radius:3px 18px 3px 11px;
  font-size:.74rem!important;
  font-weight:600;
}
.service-closing a:hover{background:var(--fa-mustard)!important;color:var(--fa-black)!important}

/* Global CTA: compact, dark and rugged instead of a full mustard billboard. */
.cta{
  min-height:0!important;
  padding:clamp(5rem,7.5vw,7.5rem) clamp(1.4rem,7vw,7rem)!important;
  background:var(--fa-olive-dark)!important;
  color:var(--fa-bone)!important;
}
.cta h2{
  max-width:11em!important;
  margin:clamp(1.6rem,3vw,2.7rem) 0 1.5rem!important;
  color:var(--fa-bone)!important;
  font-size:clamp(2.5rem,3.8vw,4.25rem)!important;
  line-height:1.3!important;
}
.cta-copy>small{color:#d29367!important}
.cta-copy>small:before{display:none!important;content:none!important}
.cta-copy>p{color:rgba(238,230,213,.64)!important}
.cta>a{
  width:clamp(138px,12vw,170px)!important;
  height:clamp(138px,12vw,170px)!important;
  padding:1.35rem!important;
  background:var(--fa-rust)!important;
  border-radius:3px 22px 3px 14px!important;
  transform:none!important;
}
.cta>a:hover{background:var(--fa-mustard)!important;color:var(--fa-black)!important;transform:none!important}

/* Replace overly soft panels with denser workshop colours. */
.intro{background:#c7baa0!important}
.service-home,.service-aftercare{background:var(--fa-olive)!important}
.works-home,.service-catalog,.journal-home{background:var(--fa-bone)!important}
.answer-block,.price-honesty{background:#aaa78f!important}
.numbers{background:var(--fa-tobacco)!important;color:var(--fa-bone)!important}
.price-plans article:nth-child(2),.price-honesty{background:#a9a48a!important}
.faq-directory,.faq-catalog{background:var(--fa-bone)!important}

/* Cards: less friendly/puffy, more catalogue-like. */
.service-catalog article,.service-fit-grid article,.price-plans article,
.price-choose-grid article,.running-cost-grid article,.contact-trust-grid article,
.faq-items details,.journal-home .post-row,.values article{
  border-radius:2px 12px 2px 7px!important;
  box-shadow:none!important;
}
.service-catalog article{background:#ded4c1!important}
.service-catalog article:nth-child(even){background:#c8c1aa!important}
.service-catalog header span,.service-catalog header small{position:relative;z-index:1}

/* Editorial rules must never run through copy. */
.article-body h2:after{display:none!important;content:none!important}
.article-body h2{padding-bottom:0!important;border:0!important}
.article-body h3{padding-left:0!important;border:0!important}
.zt-marker{background:linear-gradient(transparent 72%,rgba(184,139,50,.45) 72%)!important}
.zt-box,.zt-summary,.zt-pros,.zt-cons,.zt-column,.zt-link-card{border-color:rgba(41,42,36,.22)!important}

/* Form and navigation dimensions audited to prevent label collisions. */
.archive-tools input,.faq-search input,.contact-form input,.contact-form textarea,.contact-form select{font-size:16px!important}
.faq-search i{flex:0 0 auto}
.contact-purpose label{min-height:48px;align-items:center}
.contact-form legend{line-height:1.55!important}
.zt-menu-primary a,.zt-menu-guides a{min-width:0}
.zt-menu-primary strong,.zt-menu-guides a span{overflow-wrap:anywhere}

/* No accidental horizontal overflow from translated/oversized accents. */
main,.page-hero,.service-page-pro,.price-page-pro,.faq-page,.contact-page,
.activity-page,.journal-archive,.work-archive-pro,.zt-guide-page,.zt-single-main{overflow-x:clip}

@media(max-width:900px){
  .service-closing{grid-template-columns:1fr!important}
  .service-closing small,.service-closing h2,.service-closing p,.service-closing a{grid-column:1!important;grid-row:auto!important}
  .service-closing a{justify-self:start;margin-top:1rem!important}
}

@media(max-width:700px){
  .page-hero{padding-top:7.25rem!important;padding-bottom:4.5rem!important}
  .page-hero h1{font-size:clamp(2.35rem,10.5vw,3.35rem)!important;line-height:1.28!important}
  .service-closing{padding:5rem 1.35rem!important;gap:1.8rem!important}
  .service-closing h2{font-size:clamp(2.2rem,10vw,3.05rem)!important}
  .service-closing p{margin-top:0!important;font-size:.82rem!important;line-height:1.95!important}
  .service-closing a{width:100%;text-align:center;border-radius:2px 13px 2px 8px!important}
  .cta{display:block!important;padding:4.75rem 1.35rem!important}
  .cta h2{font-size:clamp(2.15rem,9.6vw,2.95rem)!important}
  .cta>a{margin:2.5rem 0 0 auto!important}
  .service-catalog-copy ul{grid-template-columns:1fr!important}
  .service-catalog-copy li:before{margin-right:.6rem!important}
  .faq-search input{height:54px!important}
}

/* 3.7.1 contrast audit: light surfaces always use dark live type. */
.activity-intro,
.activity-story,
.activity-program,
.faq-directory,
.faq-catalog,
.contact-trust{
  color:var(--fa-black)!important;
}
.activity-story h2,
.activity-story p,
.activity-intro h2,
.activity-intro p:not(.activity-index),
.activity-program h2,
.activity-program p,
.faq-directory h2,
.faq-directory-head p,
.contact-trust h2,
.contact-trust-grid h3{
  color:var(--fa-black)!important;
}
.activity-story p,
.activity-intro p:not(.activity-index),
.activity-program p,
.faq-directory-head p,
.contact-trust-grid p{
  color:#5f5a50!important;
}
.activity-story header small,
.activity-index,
.activity-program small,
.faq-directory-head small,
.contact-trust small,
.contact-trust-grid span{
  color:var(--fa-rust)!important;
}
.contact-trust-grid article{
  background:#e2d8c4!important;
  color:var(--fa-black)!important;
}
.contact-trust-grid{
  border:0!important;
  background:transparent!important;
}
.activity-story blockquote{color:var(--fa-rust)!important}

/* Dark activity panels retain the inverse palette. */
.activity-impact,
.activity-impact h2,
.activity-impact h3{color:var(--fa-bone)!important}
.activity-impact p{color:rgba(238,230,213,.68)!important}