/* Overrides: SUZAKU logo sizing & spacing for PC/Tablet */

/* Reset browser default top margin to let hero touch very top */
html, body { margin: 0; }

/* Ensure the hero description text uses Noto Sans on all breakpoints */
.hero-description { font-family: 'Noto Sans', "Work Sans", Arial, sans-serif !important; }

/* Hero text: restore original desktop sizes to match base CSS */
/* Desktop (default) */
.fh5co-hero_eng .hero-headline { font-size: 42px !important; }
.fh5co-hero_eng .hero-tagline  { font-size: 42px !important; }
.fh5co-hero_eng .hero-description { font-size: 19px !important; }
.fh5co-hero_eng .langage a.btn-flat-border { font-size: 28px !important; }

@media screen and (min-width: 992px) {
  /* PC: revert to scaled titlecenter (scale 0.8); remove top margin */
  .titlediv { margin-bottom: 30px !important; }
  .fh5co-hero_eng .titlecenter { margin-top: 0 !important; transform: scale(0.8) !important; transform-origin: top center !important; }
  /* PC: keep image intrinsic, no auto-scaling */
  .titleimg { width: auto; height: auto; max-width: none; display: block; }
  /* PC: parent scaled; keep logo intrinsic (no extra scale) */
  .fh5co-hero_eng .titlediv .titleimg { transform: none !important; }
  /* PC: force true centering for SUZAKU logo container to avoid subtle right shift near ~1188px */
  .fh5co-hero_eng .titlediv { width: 100%; margin-left: 0; transform: none; display: flex; justify-content: center; align-items: center; text-align: center; }
  /* PC: prevent tagline from splitting around ~1192px */
  .fh5co-hero_eng .hero-tagline { white-space: nowrap !important; }
  /* PC: make hero-description content area 2/3 width, centered */
  .fh5co-hero_eng .hero-description {
    width: 60% !important;  /* 2/3 width */
    margin-left: auto;            /* center horizontally */
    margin-right: auto;
  }
  /* PC: set 50px so visual height is ~40px after 0.8 scale */
  .fh5co-hero_eng .langage a.btn-flat-border {
    /* Visual 40px under 0.8 scale => 50px before scale */
    height: 60px !important;
    /* Keep font size as configured */
    font-size: 28px !important;
    /* Increase horizontal padding to 1.5x (16px -> 24px) */
    padding: 0 80px !important;
  }
  /* PC: use base sizes (42/42/22) before 0.8 scale via global overrides */
  /* PC: reduce excessive bottom gap under CTAs */
  .fh5co-hero_eng .langage { margin-bottom: 40px !important; }
  /* PC: keep tagline on one line and center by intrinsic width */
  .fh5co-hero_eng .hero-tagline { white-space: nowrap !important; display: inline-block; }
}

/* Narrow range fix: subpixel centering tweak around ~1192px */
@media screen and (min-width: 1176px) and (max-width: 1208px) {
  .fh5co-hero_eng .hero-tagline { transform: translateX(-0.5px); }
}

@media screen and (min-width: 768px) and (max-width: 991.98px) {
  /* Tablet: show only the targeted manual line-break in the hero tagline */
  br.br-hero-break { display: inline !important; }
  /* Tablet: top alignment and centered horizontally */
  .fh5co-hero_eng .titlecenter { margin-top: 0 !important; padding-left: 0 !important; padding-right: 0 !important; display: block !important; width: 100% !important; }
  /* Bleed titlediv to full viewport width and center */
  .fh5co-hero_eng .titlediv {
    margin-bottom: 12px !important;
    width: 100%;
    margin-left: 0;
    transform: none;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
  }
  /* Tablet: fill viewport width; container height matches image */
  .fh5co-hero_eng .titlediv .titleimg {
    width: 100%;
    max-width: none;
    height: auto;
    display: block;
    margin: 0 auto;
    transform: none;
  }
  /* Tablet: make CTA button close to PC effective size */
  .fh5co-hero_eng .langage a.btn-flat-border {
    height: 48px !important;      /* PC 60px at 0.8 scale = 48px */
    font-size: 22px !important;   /* PC 28px at 0.8 scale ≈ 22.4px */
    padding: 0 56px !important;
  }
  /* Fix extra space under slideshow: neutralize large min-height */
  .fh5co-hero_eng { min-height: 0 !important; height: auto !important; overflow: hidden; padding-bottom: 0 !important; }
  /* Tablet: prevent text clipping by letting hero grow and widening side paddings */
  .backvideo { height: auto !important; min-height: 720px !important; }
  .fh5co-hero_eng { overflow: visible !important; }
  /* Tablet: make hero texts span full width of .text-center */
  .fh5co-hero_eng .text-center { width: 100%; }
  .fh5co-hero_eng .hero-subtexts,
  .fh5co-hero_eng .langage {
    width: 100%;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0;
    margin-right: 0;
    box-sizing: border-box;
  }
  .fh5co-hero_eng .langage { margin-bottom: 24px !important; }
  /* Tablet: restore original sizes from base CSS */
  .fh5co-hero_eng .hero-headline { font-size: 32px !important; }
  .fh5co-hero_eng .hero-tagline  {
    font-size: 32px !important;
    margin-top: 80px !important;
    /* Ensure wrapping on tablets even without spaces (override keep-all) */
    white-space: normal !important;
    word-break: normal;          /* reset from keep-all */
    overflow-wrap: anywhere;     /* allow breaks anywhere if needed */
    line-break: loose;           /* more permissive CJK line breaking */
  }
  .fh5co-hero_eng .hero-description { font-size: 16px !important; }
}

/* Smartphone: center and enlarge logo */
@media screen and (max-width: 767.98px) {
  /* Smartphone: thin out borders from 2px to 1px */
  .m_img { border-width: 1px !important; }
  .support_wrap { border-width: 1px !important; }
  .nav_center nav li a span { border-bottom-width: 1px !important; }
  .fh5co-hero .fh5co-intro p a,
  .fh5co-parallax .fh5co-intro p a { border-bottom-width: 1px !important; }
  .btn-primary { border-width: 1px !important; }
  input,
  select,
  textarea { border-width: 1px !important; }
  /* Add top margin; keep side padding only on titlecenter */
  .fh5co-hero_eng .titlecenter { margin-top: 48px !important; padding-left: 6vw !important; padding-right: 6vw !important; }
  .fh5co-hero_eng .titlediv {
    /* Widen vertical spacing around SUZAKU logo (doubled) */
    margin-top: 120px !important;
    margin-bottom: 90px !important;
    width: 100vw;
    margin-left: 50%;
    transform: translateX(-50%);
    overflow: hidden; /* prevent horizontal scroll when overscanning image */
  }
  .fh5co-hero_eng .titlediv .titleimg {
    width: 115vw !important; /* enlarge further on smartphone */
    max-width: none !important;
    height: auto;
    display: block;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
  }
  /* Fix extra space under slideshow: neutralize large min-height */
  .fh5co-hero_eng { min-height: 0 !important; height: auto !important; overflow: hidden; }
  /* Smartphone: hero-subtexts padding restored; buttons remain edge-to-edge */
  .fh5co-hero_eng .hero-subtexts {
    padding-left: 2vw !important;
    padding-right: 2vw !important;
    width: auto;
    margin-left: 0;
    transform: none;
    box-sizing: border-box;
  }
  .fh5co-hero_eng .langage {
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100vw;
    margin-left: 50%;
    transform: translateX(-50%);
    box-sizing: border-box;
  }
  .fh5co-hero_eng .langage { margin-bottom: 82px !important; }
  /* Smartphone: enlarge headline and tagline (1.5em) */
  .fh5co-hero_eng .hero-headline { font-size: 1.5em !important; line-height: 1.35; }
  .fh5co-hero_eng .hero-tagline  {
    font-size: 1.5em !important;
    line-height: 1.35;
    /* Ensure wrapping on smartphones even without spaces (override keep-all) */
    white-space: normal !important;
    word-break: normal;          /* reset from keep-all */
    overflow-wrap: anywhere;     /* allow breaks anywhere if needed */
    line-break: loose;           /* more permissive CJK line breaking */
  }
  .fh5co-hero_eng .hero-description { font-size: 0.8em !important; }
  .fh5co-hero_eng .langage a.btn-flat-border {
    font-size: 1em !important;
    height: 44px !important;
    padding: 0 40px !important;
  }
}