/* card-redesign-tablet.css — TASK-013 companion override, tablet range only.
 *
 * Loaded in src/app/page.tsx AFTER the captured Divi stylesheets pos-17.css
 * and pos-18.css (which are injected inline at the end of the body markup),
 * so it wins by source order on !important ties.
 *
 * Root cause: pos-17.css hides the three intro icons in the 768-980px
 * tablet range:
 *   @media only screen and (min-width:768px) and (max-width:980px) {
 *     .et_pb_image_0,.et_pb_image_1,.et_pb_image_2 { display:none!important }
 *   }
 * This is captured Divi output; on the original site the icons were likely
 * intentional decorative accents that the capture preserved. The redesign
 * keeps them visible across all viewports, so restore display here.
 *
 * Selector targets the actual DOM path: .et_pb_section_1 > .et_pb_row_1
 * (the icon row is a sibling of the #paketwisata row, not a child).
 * No !important needed for display — this file loads after pos-18, so on a
 * display:none tie we win by source order.
 *
 * Also overrides Divi's default tablet layout that stacks the three 1/3
 * columns vertically in the 768-980 range (which would overlap the icons
 * once they are re-shown). Keeping them side by side in a flex row so the
 * icon row matches the intro heading width and the icons do not collide.
 * Padding-right:76% on each image module is also overridden, because that
 * is what forces the icons to the left edge of each stacked column. */
@media only screen and (min-width:768px) and (max-width:980px) {
  .et_pb_section_1 > .et_pb_row_1 .et_pb_image_0,
  .et_pb_section_1 > .et_pb_row_1 .et_pb_image_1,
  .et_pb_section_1 > .et_pb_row_1 .et_pb_image_2 {
    display: block !important;
    padding-right: 0;
    text-align: center;
  }
  /* Keep the three 1/3 columns side by side instead of stacking. */
  .et_pb_section_1 > .et_pb_row_1 {
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    gap: 32px;
  }
  .et_pb_section_1 > .et_pb_row_1 > .et_pb_column_1_3 {
    width: auto;
    max-width: none;
    flex: 0 0 auto;
  }
  .et_pb_section_1 > .et_pb_row_1 .et_pb_image_wrap img {
    width: 120px;
    height: auto;
  }
}