/* Victoria Unikel — tablet & phone fixes (custom layer over the original theme) */

/* ============ TABLET + PHONE (≤1018px) ============ */
@media (max-width: 1018px) {

  /* hide the duplicated in-page horizontal menu — the burger menu covers it */
  .tdc-content-wrap .tdb_header_menu,
  .tdc-content-wrap .td_block_wrap.tdb_header_menu { display: none !important; }

  /* section title always ABOVE the images: stack columns, text column first */
  #tdi_65 > .vc_row,
  #tdi_89 > .vc_row,
  #tdi_102 > .vc_row { display: flex !important; flex-direction: column; }

  #tdi_65 > .vc_row > .vc_column,
  #tdi_89 > .vc_row > .vc_column,
  #tdi_102 > .vc_row > .vc_column {
    width: 100% !important; float: none !important; position: relative; z-index: 1;
  }

  /* background layer must stay behind the columns once the row is flex */
  #tdi_65 > .vc_row > .td-element-style,
  #tdi_89 > .vc_row > .td-element-style,
  #tdi_102 > .vc_row > .td-element-style {
    position: absolute !important; top: 0; left: 0; right: 0; bottom: 0; z-index: 0 !important;
  }

  #tdi_65 .tdi_71,
  #tdi_89 .tdi_95,
  #tdi_102 .tdi_105 { order: -1; }

  /* custom flex sections: text first, picture after */
  .vu-exo-desc > .vc_row > .vc_column > .wpb_wrapper > div,
  .vu-music > .vc_row > .vc_column > .wpb_wrapper > div {
    flex-direction: column-reverse !important;
    gap: 26px !important;
  }

  /* images never taller than a screen */
  .tdm-image, .tdm-inline-image-wrap img, .vu-music img, .vu-exo-desc img {
    width: 100% !important; height: auto !important;
  }
  .tdc-row iframe { max-width: 100% !important; }
}

/* ============ PHONE (≤767px) ============ */
@media (max-width: 767px) {

  /* spacing: sections breathe, nothing collides */
  .tdc-row { padding-left: 0 !important; padding-right: 0 !important; }
  .tdc-row .vc_row.td-pb-row { padding-top: 10px; padding-bottom: 10px; }
  .tdc-row .tdm_block { margin-bottom: 16px !important; }
  .tdc-row .vc_column { margin-bottom: 0 !important; }
  .tdc-row .tdm_block_column_title { margin-top: 30px !important; }
  .tdm-title { margin-bottom: 6px !important; }

  /* no negative offsets pulling blocks on top of each other */
  .tdc-row [class*="tdi_"] { margin-top: 0 !important; }
  .vu-exo-title .tdm_block_column_title { padding-top: 34px !important; }

  /* typography */
  .tdm-descr, p.tdm-descr { font-size: 17px !important; line-height: 1.55 !important; }
  .tdm-title { font-size: 30px !important; line-height: 1.2 !important; }
  h1 { font-size: 30px !important; line-height: 1.2 !important; }

  /* comfortable side padding for text */
  .tdc-row .wpb_wrapper > .tdm_block_inline_text { padding-left: 18px !important; padding-right: 18px !important; }
  .vu-exo-desc > .vc_row > .vc_column > .wpb_wrapper > div,
  .vu-music > .vc_row > .vc_column > .wpb_wrapper > div { padding-left: 18px !important; padding-right: 18px !important; }
}

/* ============ TABLET ONLY (768–1018px) ============ */
@media (min-width: 768px) and (max-width: 1018px) {
  .tdc-row .vc_column { padding-left: 20px !important; padding-right: 20px !important; }
  .tdm-descr, p.tdm-descr { font-size: 18px !important; }
  .vu-music img, .vu-exo-desc img { max-width: 360px; margin: 0 auto; }
  .tdc-row .tdm_block_inline_image { text-align: center; }
  .tdc-row .tdm-inline-image-wrap { max-width: 560px; margin: 0 auto; }
}

/* ================= Companies page ================= */
.vu-biz { background:#000; padding:70px 0 80px; }
.vu-biz-wrap { max-width:1200px; margin:0 auto; padding:0 24px; }
.vu-biz-h1 { color:#fff; font-family:'Headland One',serif; font-weight:400; font-size:46px; line-height:1.15; margin:0; }
.vu-biz-rule { width:80px; height:2px; background:#dd0000; margin:22px 0 30px; }
.vu-biz-lead { color:#c9c9c9; font-family:'Albert Sans',sans-serif; font-size:19px; line-height:1.65; font-weight:300; max-width:860px; margin:0 0 54px; }
.vu-biz-lead strong { color:#fff; }
.vu-biz-lead a { color:#dd0000; }

.vu-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.vu-card { background:#141414; border:1px solid #232323; border-radius:10px; padding:32px 28px 30px; display:flex; flex-direction:column; transition:transform .2s ease, border-color .2s ease, background .2s ease; }
.vu-card:hover { transform:translateY(-4px); border-color:#3d0b0b; background:#171313; }
.vu-card-logo { height:58px; display:flex; align-items:center; margin-bottom:20px; }
.vu-card-logo img { max-height:54px; width:auto; max-width:200px; }
.vu-wordmark { font-family:'Headland One',serif; font-size:23px; color:#dd0000; letter-spacing:.03em; }
.vu-card-role { font-family:'Noto Sans',sans-serif; font-weight:700; font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; color:#dd0000; margin:0; }
.vu-card-name { font-family:'Headland One',serif; font-weight:400; font-size:23px; color:#fff; margin:9px 0 0; line-height:1.25; }
.vu-card-sector { font-family:'Noto Sans',sans-serif; font-size:11.5px; letter-spacing:.11em; text-transform:uppercase; color:#8a8a8a; margin:7px 0 0; }
.vu-card-desc { color:#c2c2c2; font-family:'Albert Sans',sans-serif; font-size:15.5px; line-height:1.6; font-weight:300; margin:16px 0 22px; flex:1; }
.vu-visit { font-family:'Noto Sans',sans-serif; font-weight:700; font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; color:#dd0000; text-decoration:none; }
.vu-visit:hover { color:#ff2020; }
.vu-soon { color:#6a6a6a; }
.vu-biz-cta { text-align:center; margin-top:56px; }
.vu-btn { display:inline-block; font-family:'Noto Sans',sans-serif; font-weight:700; font-size:12px; letter-spacing:.15em; text-transform:uppercase; color:#fff; background:#dd0000; padding:16px 38px; border-radius:2px; text-decoration:none; }
.vu-btn:hover { background:#ff1010; color:#fff; }

@media (max-width:1018px){ .vu-grid { grid-template-columns:repeat(2,1fr); } .vu-biz-h1{ font-size:38px; } }
@media (max-width:767px){
  .vu-grid { grid-template-columns:1fr; gap:18px; }
  .vu-biz { padding:44px 0 56px; }
  .vu-biz-h1 { font-size:32px; }
  .vu-biz-lead { font-size:17px; margin-bottom:36px; }
  .vu-card { padding:26px 22px; }
}

/* parent company card — visually leads the grid */
.vu-card-parent { grid-column: 1 / -1; background:#170d0d; border-color:#3d0b0b; }
.vu-card-parent .vu-card-logo { height:70px; }
.vu-card-parent .vu-card-logo img { max-height:66px; max-width:260px; }
.vu-card-parent .vu-card-name { font-size:28px; }
.vu-card-parent .vu-card-desc { max-width:760px; font-size:16.5px; }
@media (max-width:767px){ .vu-card-parent .vu-card-name{ font-size:24px; } }

/* ================= Press page ================= */
.vu-press-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.vu-press-card { display:flex; flex-direction:column; background:#141414; border:1px solid #232323; border-radius:10px; overflow:hidden; text-decoration:none; transition:transform .2s ease, border-color .2s ease; }
.vu-press-card:hover { transform:translateY(-4px); border-color:#3d0b0b; }
.vu-press-thumb { background:#0b0b0b; aspect-ratio:4/3; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.vu-press-thumb img { width:100%; height:100%; object-fit:contain; }
.vu-press-body { padding:20px 20px 22px; display:flex; flex-direction:column; flex:1; }
.vu-press-pub { font-family:'Noto Sans',sans-serif; font-weight:700; font-size:12.5px; letter-spacing:.06em; color:#fff; margin:0; }
.vu-press-text { color:#bdbdbd; font-family:'Albert Sans',sans-serif; font-size:14.5px; line-height:1.55; font-weight:300; margin:10px 0 0; flex:1; }
.vu-press-date { color:#7d7d7d; font-family:'Noto Sans',sans-serif; font-size:11.5px; letter-spacing:.05em; margin:12px 0 0; }
.vu-press-card .vu-visit { margin-top:14px; }

@media (max-width:1140px){ .vu-press-grid { grid-template-columns:repeat(3,1fr); } }
@media (max-width:1018px){ .vu-press-grid { grid-template-columns:repeat(2,1fr); gap:18px; } }
@media (max-width:767px){ .vu-press-grid { grid-template-columns:1fr; } }

/* ===== no horizontal scroll on tablets/phones =====
   the theme gives its header/footer rows -15px side margins, which makes them
   wider than the viewport once the container stops being 1200px wide          */
@media (max-width: 1140px) {
  .tdc-row > .vc_row.td-pb-row { margin-left: 0 !important; margin-right: 0 !important; }
  .td-search-background, .td-menu-background { max-width: 100vw; }
}

/* ===== inline image blocks collapse to 0×0 on phones in the original theme =====
   (homepage Art section: the pictures simply disappeared)                        */
@media (max-width: 1018px) {
  .tdm_block_inline_image,
  .tdm_block_inline_image .tdc-inline-block-wrap,
  .tdm-inline-image-wrap {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    overflow: visible !important;
  }
  .tdm-inline-image-wrap img,
  .tdm_block_inline_image img,
  img.tdm-image {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 auto 14px;
  }
}