/* Approved UX layout: reuse the approved typography and palette. */
/* Review 2026-09-09: spacing and subject-centred tablet crop. */
#service .c-card__title { margin-bottom: 18px; }
.p-car-gallery__zoom { position: relative; }
.p-car-gallery__zoom::before, .p-car-gallery__zoom::after { content: ""; position: absolute; top: 50%; left: 50%; width: 16px; height: 1.5px; background: currentColor; transform: translate(-50%, -50%); }
.p-car-gallery__zoom::after { transform: translate(-50%, -50%) rotate(90deg); }
@media (min-width: 601px) and (max-width: 1100px) {
  .p-ctaband--photo { min-height: 0; display: block; padding-top: calc(clamp(360px, 60vw, 600px) + 28px); background-image: none; background-color: #103438; }
  .p-ctaband--photo::before { inset: 0 0 auto; height: clamp(360px, 60vw, 600px); background-image: linear-gradient(0deg,#103438 0%,transparent 18%),url('../img/design/consultation-scene.jpg'); background-size: 100% 100%,180% auto; background-position: center,right 48%; background-repeat: no-repeat; opacity: 1; }
  .p-ctaband--photo .c-title,.p-ctaband--photo .p-ctaband__lead { max-width: 100%; }
}
.ux-menu { position: relative; color: #b0eff0; }
.ux-menu summary { cursor: pointer; list-style: none; min-height: 44px; display:flex; align-items:center; gap:12px; padding:8px 12px; border:1px solid #477d81; font-size:13px; }
.ux-menu summary::-webkit-details-marker { display:none; }
.p-header .ux-menu summary { color:#c2f2f1; background:#09282d; }
.ux-menu nav { position:absolute; right:0; top:calc(100% + 12px); width:min(290px,85vw); background:#09282d; border:1px solid #477d81; padding:12px; box-shadow:0 14px 35px #00161c44; }
.ux-menu nav a { display:block; padding:14px 12px; color:white; border-bottom:1px solid #315257; text-decoration:none; }
.ux-menu nav a:hover { background:#17434b; }
.ux-shortcuts { display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; }
.ux-shortcuts a { border-bottom:1px solid #27848c; padding:12px 8px; color:#166d77; font-size:14px; font-weight:600; text-decoration:none; }
#service { padding-block:64px; }
#service .p-service__card { padding-bottom:20px; }
#service .p-service__photo { height:150px; min-height:0; aspect-ratio:16/9; }
#service .c-card__text { font-size:13px; line-height:1.8; }
.ux-decision { margin:24px 0 18px; padding:18px 20px; background:#e5eeea; border-left:3px solid #20818b; }
.ux-decision p { margin:0 0 8px; font-size:14px; line-height:1.8; }
.ux-decision .ux-decision__label { font-size:12px; font-weight:700; color:#146b75; letter-spacing:.08em; }
.ux-decision a { color:#146b75; font-size:13px; }
.ux-decision .c-note { margin-top:12px; font-size:12px; }
.ux-photo-help { font-size:12px; color:#526365; line-height:1.8; margin:12px 0 20px; }
.ux-gallery-actions { display:flex; align-items:center; justify-content:flex-end; gap:16px; margin-top:20px; flex-wrap:wrap; }
.ux-gallery-actions button,.ux-send-guide button { font:inherit; font-size:13px; padding:12px 18px; min-height:44px; border:1px solid #20818b; color:#146b75; background:transparent; cursor:pointer; }
.ux-gallery-actions button:hover { background:#e2eeea; }
.p-car-gallery.is-grid .p-car-gallery__rail { overflow:visible; display:block; }
.p-car-gallery.is-grid .p-car-gallery__group:first-child { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
.p-car-gallery.is-grid .p-car-gallery__group[aria-hidden] { display:none; }
.p-car-gallery.is-grid .p-car-gallery__card { width:100%; min-width:0; }
.p-car-gallery.is-grid .p-car-gallery__toggle,.p-car-gallery.is-grid .p-car-gallery__hint { display:none; }
.ux-send-guide { text-align:left; max-width:600px; margin:26px auto; padding:22px; border:1px solid #699da2; background:#06232b; color:#e4f4f3; font-size:14px; }
.ux-send-guide>p { font-weight:700; margin:0 0 12px; }
.ux-send-guide ol { padding-left:24px; line-height:2; }
.ux-send-guide summary { cursor:pointer; padding:12px 0; }
.ux-send-guide textarea { width:100%; background:#f3f5f1; color:#142c31; padding:12px; font:inherit; margin:12px 0; resize:vertical; }
.ux-send-guide button { color:white; border-color:#81c6c8; }
.ux-send-guide [role=status] { font-size:12px; margin-top:10px; }
.p-gallery-dialog .ux-lightbox-cta { display:block; width:fit-content; margin:18px auto 0; padding:12px 20px; font-size:13px; }
:is(.ux-menu,.ux-shortcuts,.ux-gallery-actions,.ux-send-guide) :is(a,button,summary):focus-visible { outline:3px solid #ff704f; outline-offset:3px; }
:is(.ux-menu,.ux-gallery-actions,.ux-send-guide) button:active { transform:translateY(1px); }
[id] { scroll-margin-top:100px; }
@media(max-width:800px) {
  .p-header__instagram { display:none; }
  .p-header__inner { gap:10px; }
  .p-header__logo { width:110px; flex-shrink:1; }
  .p-header__cta { gap:8px; }
  .p-header__cta .c-btn { font-size:11px; min-height:44px; padding:10px; }
  .ux-menu summary { font-size:11px; padding:8px; gap:5px; }
  #service { padding-block:42px; }
  #service .p-service__grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 14px; }
  #service .p-service__photo { height:auto; aspect-ratio:4/3; }
  #service .c-card__title { font-size:16px; line-height:1.6; }
  #service .c-card__text { display:none; }
  #service .p-service__link { font-size:12px; }
  .ux-shortcuts { gap:4px 12px; }
  .ux-shortcuts a { font-size:12px; }
  .ux-gallery-actions { align-items:stretch; flex-direction:column; }
  .p-car-gallery.is-grid .p-car-gallery__group:first-child { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .p-car-gallery.is-grid .p-car-gallery__caption { font-size:11px; align-items:start; }
  .p-car-gallery.is-grid .p-car-gallery__zoom { width:26px; height:26px; font-size:18px; }
}