/* AMIX Web BENTO: 立体プッシュ and カード浮き上がり, with workshop outlines. */
.button.cta,.header-cta.cta,.mobile-contact.cta,.quick a.cta,.back-top.cta{
  --push-depth:6px;--push-base:var(--ink);
  display:inline-flex;align-items:center;justify-content:center;gap:0;
  min-height:48px;padding:13px 25px;border:2px solid var(--ink);border-radius:6px;
  text-align:center;font-weight:900;text-decoration:none;cursor:pointer;
  box-shadow:0 var(--push-depth) 0 var(--push-base);transform:translateY(0);
  transition:transform .1s ease,box-shadow .1s ease,filter .18s ease;
}
.header-cta.cta{--push-depth:5px;border-radius:999px;font-size:13px;padding:11px 23px}
.quick a.cta{--push-depth:4px;background:var(--paper);font-size:12px;margin:0 7px;padding:12px 10px}
.back-top.cta{--push-depth:4px;border-radius:50%;width:49px;height:49px;padding:0;min-height:0;font:700 17px var(--display)}
.mobile-contact.cta{display:none}
.contact select{
  appearance:none;-webkit-appearance:none;padding-right:46px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='m1 1 5 5 5-5' fill='none' stroke='%23192f32' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 18px center;background-size:12px 8px;cursor:pointer;
}
.button.cta:active,.header-cta.cta:active,.mobile-contact.cta:active,.quick a.cta:active,.back-top.cta:active{transform:translateY(var(--push-depth));box-shadow:0 0 0 var(--push-base)}
.service-panel.bento-card,.contact form.bento-card,.garage-image.bento-card{
  --card-angle:0deg;transform:translateY(0) rotate(var(--card-angle));
  transition:transform .25s ease,box-shadow .25s ease;
}
.garage-image.bento-card{--card-angle:2deg}
#panel-maintenance .service-type{font-size:clamp(48px,9.2vw,120px)}
.service-tabs button.bento-card{transition:transform .25s ease,box-shadow .25s ease,border-color .2s ease}
.service-panel.bento-card:focus-within,.contact form.bento-card:focus-within{outline:2px solid var(--yellow);outline-offset:5px}
@media(hover:hover) and (pointer:fine){
  .button.cta:hover:not(:active),.header-cta.cta:hover:not(:active),.mobile-contact.cta:hover:not(:active),.quick a.cta:hover:not(:active),.back-top.cta:hover:not(:active){filter:brightness(1.06);transform:translateY(-1px);box-shadow:0 calc(var(--push-depth) + 1px) 0 var(--push-base)}
  .service-panel.bento-card:hover,.contact form.bento-card:hover,.garage-image.bento-card:hover{transform:translateY(-5px) rotate(var(--card-angle));box-shadow:8px 12px 0 var(--ink)}
  .service-tabs button.bento-card:hover{transform:translateY(-4px);box-shadow:0 5px 0 var(--ink)}
}
@media(max-width:1050px) and (min-width:761px){.header-cta.cta{font-size:12px;padding-inline:17px}.quick a.cta{font-size:10px;margin-inline:5px}}
@media(max-width:760px){
  .header-cta.cta{display:none}.button.cta{padding:13px 21px;font-size:13px}.hero-copy .button.cta{padding:12px 20px;font-size:12px}
  .quick{gap:13px}.quick a.cta{margin:0;font-size:13px;padding:13px 16px}
  .mobile-contact.cta{display:flex;position:fixed;padding:12px 20px;--push-depth:4px;min-height:48px}
  .back-top.cta{width:42px;height:42px;font-size:15px}
}
@media(prefers-reduced-motion:reduce){
  .cta,.bento-card{transition:none!important}
  .service-panel.bento-card:hover,.contact form.bento-card:hover,.garage-image.bento-card:hover{transform:rotate(var(--card-angle))!important}
  .service-tabs button.bento-card:hover{transform:none!important}
}
