/**
 * A4 print styles — index.html / recruit.html
 * カード・グリッドレイアウトを可読性を保ちつつ画面表示に近づけて再現
 */

@page {
  size: A4 portrait;
  margin: 14mm 12mm 16mm;
}

@media print {
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }

  html {
    font-size: 10pt;
    scroll-behavior: auto;
  }

  body {
    color: #0f172a !important;
    background: #fff !important;
    line-height: 1.65;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  /* ── Hide: 印刷に不要な操作UIのみ（非表示のメニュー・スライダー操作等） ── */
  #mobile-menu,
  .back-to-top,
  .nav-dropdown-panel,
  #recruit-fv-dots,
  .recruit-tablist,
  .message-tabpanel__switch,
  .recruit-carousel-btn,
  .works-carousel-btn,
  .fv-dot {
    display: none !important;
  }

  /* ── Header ── */
  .site-header-spacer {
    display: none !important;
  }

  .site-header {
    position: static !important;
    background: #fff !important;
    border-bottom: 1px solid #cbd5e1 !important;
    backdrop-filter: none !important;
  }

  .site-header .header-bar {
    height: auto !important;
    padding-block: 0.5rem !important;
  }

  .site-header .header-badge {
    display: inline-flex !important;
    border: 1px solid #155c89 !important;
    background: rgba(21, 92, 137, 0.06) !important;
    color: #155c89 !important;
  }

  .site-header .header-menu-btn {
    display: none !important;
  }

  .site-header .header-nav {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0.25rem 0.5rem !important;
    font-size: 8pt !important;
  }

  /* ── Layout ── */
  .l-inner {
    max-width: none !important;
    padding-inline: 0 !important;
  }

  .section-padding {
    padding-block: 1.15rem !important;
  }

  .sticky,
  .fixed {
    position: static !important;
  }

  .overflow-hidden {
    overflow: visible !important;
  }

  /* ── Links ── */
  a {
    color: inherit !important;
  }

  a[href^="http"] {
    text-decoration: underline !important;
  }

  a[href^="#"]::after,
  a[href^="javascript"]::after {
    content: none !important;
  }

  /* ── Page breaks ── */
  h1, h2, h3, h4 {
    break-after: avoid;
    page-break-after: avoid;
  }

  section {
    break-inside: auto;
    page-break-inside: auto;
  }

  article,
  .interview-story-card,
  .message-tabpanel,
  .shift-card,
  .work-row-card,
  .step-card,
  .blog-card,
  .anzen-gallery__item,
  .recruitment-table,
  .site-footer,
  tr {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  .interview-figure:not(.interview-figure--float-right):not(.interview-figure--float-left) {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  #message .message-tabpanel + .message-tabpanel {
    break-before: page;
    page-break-before: always;
    margin-top: 0 !important;
  }

  /* ══════════════════════════════════════
     Card base styles
     ══════════════════════════════════════ */
  .work-row-card,
  .step-card,
  .blog-card,
  .interview-story-card,
  #company article,
  #services article,
  #works-track > article {
    border: 1px solid #cbd5e1 !important;
    border-radius: 2px !important;
    background: #fff !important;
    overflow: hidden !important;
  }

  .step-card {
    border-top: 3px solid #155c89 !important;
    background: #f8fafc !important;
  }

  .shift-card {
    border-radius: 24px !important;
    padding: 0.85rem 1rem !important;
  }

  .shift-card--day {
    background: #fff !important;
    border: 2px solid rgba(21, 92, 137, 0.42) !important;
    color: #0f172a !important;
  }

  .shift-card--night {
    background: #0f172a !important;
    border: 2px solid #334155 !important;
    color: #fff !important;
  }

  .shift-card--night .text-white,
  .shift-card--night .day-timeline__title,
  .shift-card--night .day-timeline__time,
  .shift-card--night .day-timeline__note,
  .shift-card--night .service-card-title {
    color: #fff !important;
  }

  .message-tabpanel {
    background: linear-gradient(180deg, #f8fbfd 0%, #eef5fa 100%) !important;
    border: 1px solid rgba(21, 92, 137, 0.22) !important;
    border-radius: 8px !important;
    margin-bottom: 1rem !important;
    padding: 1rem !important;
  }

  .recruit-teaser-card {
    background: rgba(255, 255, 255, 0.92) !important;
    border: 1px solid rgba(255, 255, 255, 0.85) !important;
    border-radius: 2px !important;
    padding: 0.65rem !important;
  }

  .recruit-teaser-card__title {
    color: #0f172a !important;
    font-size: 9.5pt !important;
    font-weight: 700 !important;
    margin-bottom: 0.35rem !important;
  }

  .recruit-teaser-card__text {
    color: #334155 !important;
    font-size: 9pt !important;
    line-height: 1.55 !important;
  }

  /* ── Section backgrounds ── */
  .section-with-bg__image,
  .section-with-bg__scrim,
  .section-with-bg__backdrop {
    display: none !important;
  }

  .section-with-bg {
    background: #fff !important;
  }

  #culture {
    background: #155c89 !important;
    color: #fff !important;
  }

  #culture .section-header .text-white,
  #culture .section-header .text-white\/80,
  #culture h2,
  #culture .text-label-en {
    color: #fff !important;
  }

  #culture > img[aria-hidden="true"] {
    display: none !important;
  }

  #recruit {
    background: #155c89 !important;
    color: #fff !important;
  }

  #recruit .recruit-section-bg {
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    opacity: 1 !important;
  }

  #recruit .recruit-section-bg::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    background: rgba(21, 92, 137, 0.82) !important;
  }

  #recruit .recruit-section-bg img {
    object-fit: cover !important;
    width: 100% !important;
    height: 100% !important;
  }

  #recruit > .l-inner {
    position: relative !important;
    z-index: 2 !important;
  }

  #recruit h2,
  #recruit .text-label-en,
  #recruit .section-lead,
  #recruit .text-white,
  #recruit .text-white\/80 {
    color: #fff !important;
  }

  #recruit #recruit-carousel {
    break-inside: avoid !important;
    page-break-inside: avoid !important;
  }

  /* ── Tab panels ── */
  .message-tabpanel.hidden,
  [role="tabpanel"].hidden {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* ══════════════════════════════════════
     Print grid layouts（Tailwind md/lg は印刷時に効かないため明示指定）
     ══════════════════════════════════════ */

  /* 共通：グリッド子の幅リセット */
  main .grid > *,
  #contact .grid > * {
    width: auto !important;
    max-width: none !important;
    margin-bottom: 0 !important;
  }

  /* index — Trust 3列 */
  #company .section-header .grid {
    display: block !important;
  }

  #company .l-inner > .grid:last-child {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 0.55rem !important;
  }

  /* index — 事業内容 上段2列 + 下段3列 */
  #services .services-card-grid {
    display: grid !important;
    grid-template-columns: repeat(6, 1fr) !important;
    gap: 0.55rem !important;
  }

  #services .services-card-grid > article:nth-child(1),
  #services .services-card-grid > article:nth-child(2) {
    grid-column: span 3 !important;
  }

  #services .services-card-grid > article:nth-child(3),
  #services .services-card-grid > article:nth-child(4),
  #services .services-card-grid > article:nth-child(5) {
    grid-column: span 2 !important;
  }

  /* index — 採用ティザー 3列 */
  #recruit-teaser-cards {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 0.5rem !important;
    padding-top: 0.75rem !important;
  }

  /* index — 採用セクション 本文+画像 */
  #recruit > .l-inner > .grid {
    display: grid !important;
    grid-template-columns: 1.2fr 0.8fr !important;
    gap: 0.75rem !important;
    align-items: start !important;
  }

  /* index — お知らせ */
  #news .grid {
    display: grid !important;
    grid-template-columns: 1fr 2fr !important;
    gap: 1rem !important;
  }

  /* index — お問い合わせ 3列 */
  #contact .grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 0.75rem !important;
  }

  #contact .divide-y > * {
    border: none !important;
    padding-block: 0.25rem !important;
  }

  /* recruit — 日勤/夜勤 2列 */
  #shift .grid.grid-cols-1.lg\:grid-cols-2,
  #shift > .l-inner > .grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.65rem !important;
  }

  /* recruit — 夜勤リアル テキスト+画像 */
  .shift-night-real__gallery {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.4rem !important;
  }

  article[aria-labelledby="night-shift-real-heading"] .grid {
    display: grid !important;
    grid-template-columns: 1.1fr 0.9fr !important;
    gap: 0.65rem !important;
    align-items: start !important;
  }

  /* recruit — 仕事紹介カード（テキスト+画像2枚） */
  .work-row-card > .grid {
    display: grid !important;
    grid-template-columns: 5fr 3fr 4fr !important;
    gap: 0 !important;
    min-height: 7.5rem !important;
    align-items: stretch !important;
  }

  .work-row-card__media {
    position: relative !important;
    min-height: 7rem !important;
    overflow: hidden !important;
    border-left: 1px solid #e2e8f0 !important;
  }

  .work-row-card__media img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
  }

  /* recruit — 3ヶ月ステップ 3列 */
  main ol.grid:has(.step-card) {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 0.5rem !important;
  }

  .step-card {
    font-size: 8.5pt !important;
  }

  .step-card .service-card-title {
    font-size: 9pt !important;
    line-height: 1.35 !important;
  }

  .step-card .aspect-\[4\/3\] {
    aspect-ratio: 4 / 3 !important;
  }

  /* recruit — インタビューヒーロー */
  .interview-hero {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 0.75rem !important;
    align-items: start !important;
    margin-bottom: 1rem !important;
  }

  .interview-hero__photo,
  .interview-hero__aside {
    width: 6.5cm !important;
    max-width: 6.5cm !important;
  }

  .interview-hero__photo img {
    object-fit: contain !important;
  }

  /* recruit — 釣り部ブログ 3列（5枚は2行） */
  #culture .grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 0.45rem !important;
  }

  /* 安全教育ギャラリー 3列 */
  .anzen-gallery {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 0.4rem !important;
  }

  /* 施工実績 2列 */
  #works-track {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.5rem !important;
    overflow: visible !important;
    padding-inline: 0 !important;
  }

  #works-track > article {
    width: auto !important;
    max-width: none !important;
  }

  /* フッター 2列 */
  .site-footer__grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 1rem !important;
  }

  .site-footer__grid > :last-child {
    grid-column: 1 / -1;
  }

  /* ── Card media / images ── */
  img,
  picture {
    max-width: 100% !important;
    break-inside: avoid;
    page-break-inside: avoid;
  }

  .aspect-\[16\/10\] img,
  .aspect-\[4\/3\] img,
  .service-card-hero img,
  .blog-card img,
  #company article img,
  .step-card img {
    object-fit: cover !important;
  }

  .service-card-hero {
    position: relative !important;
    aspect-ratio: 16 / 10 !important;
    overflow: hidden !important;
  }

  .service-card-hero .absolute.bottom-0 {
    position: absolute !important;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.65)) !important;
  }

  .service-card-hero .service-card-title {
    color: #fff !important;
  }

  .service-card-detail.bg-\[\#f8fafc\] {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
  }

  /* ── Tables ── */
  .recruitment-table {
    font-size: 8.5pt !important;
    width: 100% !important;
  }

  .recruitment-table th {
    background: #f1f5f9 !important;
  }

  .recruitment-table th,
  .recruitment-table td {
    border: 1px solid #94a3b8 !important;
    padding: 0.35rem 0.5rem !important;
  }

  /* ── Forms ── */
  #entry-form {
    display: block !important;
    border: 1px solid #94a3b8 !important;
    border-radius: 2px !important;
    padding: 1rem !important;
    background: #fff !important;
    break-inside: avoid;
    page-break-inside: avoid;
  }

  #entry-form .form-input {
    border: 1px solid #94a3b8 !important;
    background: #fff !important;
    padding: 0.5rem !important;
    width: 100% !important;
  }

  #entry-form textarea.form-input {
    min-height: 4rem !important;
  }

  #entry-form .entry-form-notice {
    border: 1px solid #94a3b8 !important;
    background: #f8fafc !important;
    padding: 0.65rem !important;
  }

  .submit-btn {
    display: inline-block !important;
    background: #155c89 !important;
    color: #fff !important;
    border: 1px solid #155c89 !important;
    padding: 0.5rem 1.25rem !important;
    font-weight: 700 !important;
    border-radius: 2px !important;
    text-decoration: none !important;
  }

  /* ── Footer ── */
  .site-footer {
    background: #f8fafc !important;
    border-top: 1px solid #cbd5e1 !important;
    padding-block: 1rem !important;
  }

  .site-footer__brand {
    height: auto !important;
  }

  .site-footer__blog-btn {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.375rem !important;
    align-self: flex-start !important;
    margin-top: auto !important;
    padding: 0.5rem 1rem 0.5rem 2.1rem !important;
    background-color: #155c89 !important;
    color: #fff !important;
    font-size: 8.5pt !important;
    font-weight: 700 !important;
    border-radius: 2px !important;
    text-decoration: none !important;
    overflow: visible !important;
  }

  .site-footer__blog-btn-icon-wrap {
    position: absolute !important;
    left: -0.7rem !important;
    top: 50% !important;
    width: 2.5rem !important;
    height: 2.5rem !important;
    transform: translateY(-50%) rotate(-12deg) scale(0.92) !important;
    animation: none !important;
    filter: none !important;
  }

  .site-footer__blog-btn-icon {
    animation: none !important;
  }

  .site-footer__blog-btn-text,
  .site-footer__blog-btn .text-white {
    color: #fff !important;
  }

  /* ── CTA・リンクボタン ── */
  .header-cta,
  .recruit-cta-btn,
  .recruit-hero a[href="#entry"],
  .card-more-link,
  #culture .text-center > a,
  .blog-card .text-caption.font-bold {
    display: inline-flex !important;
    text-decoration: none !important;
  }

  .header-cta,
  .recruit-cta-btn,
  .submit-btn {
    background: #155c89 !important;
    color: #fff !important;
    border: 1px solid #155c89 !important;
    padding: 0.4rem 0.85rem !important;
    font-weight: 700 !important;
    border-radius: 2px !important;
  }

  .recruit-cta-btn--outline {
    background: transparent !important;
    color: #fff !important;
    border: 2px solid rgba(255, 255, 255, 0.85) !important;
  }

  .recruit-cta-row {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 0.5rem !important;
    margin-top: 0.75rem !important;
  }

  .recruit-hook-wrap {
    display: flex !important;
    justify-content: center !important;
    margin-bottom: 0.5rem !important;
  }

  .recruit-hook-bubble {
    display: inline-flex !important;
    align-items: center !important;
    background: #fff !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 9999px !important;
    padding: 0.5rem 1rem 0.5rem 3.5rem !important;
    position: relative !important;
  }

  .recruit-hook-icon-wrap {
    position: absolute !important;
    left: -0.5rem !important;
    top: 50% !important;
    width: 3rem !important;
    height: 3rem !important;
    transform: translateY(-50%) rotate(-12deg) !important;
    animation: none !important;
  }

  .recruit-hook-icon {
    animation: none !important;
  }

  .recruit-hook-text {
    color: #0f172a !important;
    font-size: 9pt !important;
    font-weight: 900 !important;
  }

  .card-more-link {
    color: #155c89 !important;
    font-weight: 700 !important;
    margin-top: 0.5rem !important;
  }

  #contact a.rounded-full {
    display: inline-flex !important;
    background: #155c89 !important;
    color: #fff !important;
    border-radius: 9999px !important;
    width: 2.25rem !important;
    height: 2.25rem !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* ── Decorative ── */
  .section-watermark,
  .section-watermark-bg {
    opacity: 0.1 !important;
  }

  .section-deco-en {
    color: #64748b !important;
  }

  .efforts-block-heading {
    border-left: 3px solid #155c89 !important;
    border-bottom: 1px solid rgba(21, 92, 137, 0.18) !important;
    padding-bottom: 0.5rem !important;
    margin-bottom: 0.75rem !important;
  }

  /* ── Interview floats ── */
  .interview-prose,
  .doc-prose.interview-prose {
    overflow: visible !important;
  }

  .interview-prose::after {
    content: "" !important;
    display: table !important;
    clear: both !important;
  }

  .interview-figure--float-right.interview-figure--side {
    float: right !important;
    width: min(42%, 9.5cm) !important;
    max-width: 9.5cm !important;
    margin: 0.2rem 0 0.75rem 1rem !important;
    border: 1px solid #cbd5e1 !important;
  }

  .interview-figure--float-left.interview-figure--side {
    float: left !important;
    width: min(42%, 9.5cm) !important;
    max-width: 9.5cm !important;
    margin: 0.2rem 1rem 0.75rem 0 !important;
    border: 1px solid #cbd5e1 !important;
  }

  .interview-figure--float-left.interview-figure--side {
    margin-left: 0 !important;
    margin-right: 1rem !important;
  }

  .interview-figure--float-right.interview-figure--side {
    margin-left: 1rem !important;
    margin-right: 0 !important;
  }

  .interview-figure__media img {
    object-fit: cover !important;
  }

  .interview-figure--sharp .interview-figure__media {
    display: contents !important;
  }

  .img-sharp {
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
  }

  .interview-figure--sharp {
    overflow: visible !important;
  }

  /* ══════════════════════════════════════
     index.html — First View
     ══════════════════════════════════════ */
  .fv-section,
  .fv-grid {
    min-height: auto !important;
  }

  .fv-grid {
    display: block !important;
  }

  .fv-left,
  .fv-right,
  .fv-copy-animate {
    order: unset !important;
    position: relative !important;
    width: 100% !important;
    min-height: 0 !important;
    border: none !important;
    padding-inline: 0 !important;
  }

  .fv-copy-animate {
    padding-block: 0.75rem 0 !important;
    pointer-events: auto !important;
  }

  .fv-copy-animate h1,
  .fv-copy-animate h1 .fv-copy-line,
  .fv-copy-animate p {
    opacity: 1 !important;
    transform: none !important;
    color: #0f172a !important;
  }

  .fv-left-images {
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0.5rem !important;
  }

  #fv-left-carousel-1,
  .fv-left-carousel-2-wrap,
  #fv-left-carousel-2 {
    position: relative !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    opacity: 1 !important;
    transform: none !important;
    aspect-ratio: 2 / 1 !important;
    overflow: hidden !important;
  }

  .fv-left-accent {
    display: none !important;
  }

  .fv-left-slide[aria-hidden="true"],
  .fv-slide[aria-hidden="true"] {
    display: none !important;
  }

  .fv-left-slide[aria-hidden="false"],
  .fv-slide[aria-hidden="false"] {
    position: relative !important;
    opacity: 1 !important;
    inset: auto !important;
  }

  .fv-right {
    opacity: 1 !important;
    transform: none !important;
    min-height: auto !important;
    margin-bottom: 0.5rem !important;
  }

  #fv-carousel {
    position: relative !important;
    inset: auto !important;
    aspect-ratio: 16 / 10 !important;
    overflow: hidden !important;
  }

  #fv-caption {
    position: relative !important;
    background: none !important;
    padding: 0.25rem 0 0 !important;
    width: 100% !important;
  }

  #fv-caption .fv-caption-slide {
    position: relative !important;
    color: #475569 !important;
    opacity: 1 !important;
    white-space: normal !important;
  }

  #fv-caption .fv-caption-slide[aria-hidden="true"] {
    display: none !important;
  }

  /* ══════════════════════════════════════
     recruit.html — Hero
     ══════════════════════════════════════ */
  .recruit-hero {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  .recruit-fv-carousel {
    aspect-ratio: 1920 / 640 !important;
    overflow: hidden !important;
  }

  .recruit-fv-slide[aria-hidden="true"] {
    display: none !important;
  }

  .recruit-fv-slide[aria-hidden="false"] {
    position: relative !important;
    opacity: 1 !important;
    inset: auto !important;
  }

  .recruit-fv-slide img {
    object-fit: contain !important;
  }

  .recruit-hero__overlay {
    position: relative !important;
    inset: auto !important;
    padding: 0.75rem 0 0 !important;
  }

  .recruit-hero__overlay .l-inner {
    padding: 0 !important;
  }

  .recruit-hero__copy::before {
    display: none !important;
  }

  .recruit-hero__label,
  .recruit-hero__heading,
  .recruit-hero__lead {
    color: #0f172a !important;
  }

  .recruit-hero a[href="#entry"] {
    display: inline-block !important;
    margin-top: 0.5rem !important;
    padding: 0.35rem 0.75rem !important;
    border: 1px solid #155c89 !important;
    background: #fff !important;
    color: #155c89 !important;
    text-decoration: none !important;
  }
}
