/*
 Theme Name:     Ro Rockett
 Theme URI:      https://www.rorockett.com
 Description:    The custom theme for Ro Rockett.
 Author:         JHCHOI Studio
 Author URI:     https://jhchoistudio.com
 Template:       Divi
*/

/* =Theme customization starts here
------------------------------------------------------- */

:root {
  /* min: 10.62px max: 9.68px */
  --text-body-xs: clamp(
    0.6637rem,
    calc(10.6193px - 0.00063756 * (100vw - 360px)),
    0.6048rem
  );
  /* min: 11.95px max: 12.1px */
  --text-body-sm: clamp(
    0.7467rem,
    calc(0.0001008 * (100vw - 360px) + 11.9467px),
    0.756rem
  );
  /* min: 13.44px max: 15.12px */
  --text-body-ms: clamp(
    0.84rem,
    calc(0.00113736 * (100vw - 360px) + 13.44px),
    0.945rem
  );
  /* min: 14.52px max: 17.01px */
  --text-body-m: clamp(
    0.9072rem,
    calc(0.00174972 * (100vw - 360px) + 14.5163px),
    1.0631rem
  );
  /* min: 15.12px max: 18.9px */
  --text-body-l: clamp(
    0.945rem,
    calc(0.00255864 * (100vw - 360px) + 15.12px),
    1.1813rem
  );
  /* min: 17.01px max: 23.63px */
  --text-1: clamp(
    1.0631rem,
    calc(0.0044772 * (100vw - 360px) + 17.01px),
    1.4765rem
  );
  /* min: 19.14px max: 29.4px */
  --text-2: clamp(
    1.196rem,
    calc(0.00703584 * (100vw - 360px) + 19.1363px),
    1.8457rem
  );
  /* min: 26.46px max: 31.92px */
  --text-3: clamp(
    1.6538rem,
    calc(0.00875028 * (100vw - 360px) + 26.46px),
    1.995rem
  );
  /* min: 21.53px max: 36.96px */
  --text-4: clamp(
    1.3455rem,
    calc(0.01041348 * (100vw - 360px) + 21.5283px),
    2.3072rem
  );
  /* min: 24.22px max: 46.2px */
  --text-5: clamp(
    1.5137rem,
    calc(0.01483776 * (100vw - 360px) + 24.2193px),
    2.8839rem
  );

  --menu-size: clamp(
    0.7825rem,
    calc(0.00174972 * (100vw - 360px) + 12.5163px),
    0.9381rem
  );

  --global-padding: clamp(2rem, 0.857rem + 5.714vw, 6rem);

  --vertical-padding: clamp(5rem, calc(11.887vw - 0.698rem), 10rem);
  --vertical-padding-1-2: clamp(2.5rem, calc(5.9435vw - 0.349rem), 5rem);
  --vertical-padding-3-4: clamp(3.75rem, calc(8.91525vw - 0.5235rem), 7.5rem);
}
body.et_divi_theme {
  font-size: var(--text-body-ms);
}
#main-content,
.et-db #et-boc .et-l .et_pb_section {
  background: none;
  background-color: none;
}
#header.et_pb_sticky {
  background: #FFF;
}
#main-content,
.et-db #et-boc .et-l .et_pb_section.et_pb_sticky,
#header.et_pb_sticky {
  background: #FFF !important;
}

#header a.current-page,
#header a.current-page-ancestor {
  font-weight: 600;
}

body.light-nav:not(.et-vb-root-ancestor):not(.et-fb) .et-l--header {
  position: absolute;
  width: 100%;
}
body.light-nav:not(.et-vb-root-ancestor):not(.et-fb) .et-l--header a.et_pb_link,
body.light-nav:not(.et-vb-root-ancestor):not(.et-fb)
  .et_pb_section_0_tb_header:not(.et_pb_sticky)
  .et_pb_menu_0_tb_header
  .mobile_nav
  .mobile_menu_bar:before {
  color: #fff;
}
body.light-nav:not(.et-vb-root-ancestor):not(.et-fb) .et-l--header #logo-dark {
  display: none;
}
body.light-nav:not(.et-vb-root-ancestor):not(.et-fb) .et-l--header #logo-light {
  display: block;
}
body.light-nav:not(.et-vb-root-ancestor):not(.et-fb)
  .et-l--header
  .et_pb_sticky
  a,
body.light-nav:not(.et-vb-root-ancestor):not(.et-fb)
  .mobile_nav.opened
  .mobile_menu_bar:before {
  color: #333 !important;
}
body.light-nav:not(.et-vb-root-ancestor):not(.et-fb)
  .et-l--header
  .et_pb_sticky
  #logo-dark {
  display: block;
}
body.light-nav:not(.et-vb-root-ancestor):not(.et-fb)
  .et-l--header
  .et_pb_sticky
  #logo-light,
body:not(.light-nav):not(.et-vb-root-ancestor):not(.et-fb)
  .et-l--header
  #logo-light {
  display: none;
}
body.mobile-menu-open {
  overflow: hidden;
}
/* dark logo always on opened mobile menu */
body.mobile-menu-open .et-l--header #logo-dark {
  display: block !important;
}
body.mobile-menu-open .et-l--header #logo-light {
  display: none !important;
}

/* Swap icon from hamburger to X on mobile menu open */
.mobile_nav.opened .mobile_menu_bar:before {
  content: "M";
}

.et_pb_module .mobile_menu_bar:before {
  top: 0;
}
#mobile_menu1,
.et-db #et-boc .et-l #mobile_menu1 {
  /* background: #e8e8e1; */
  border: none;
  height: 100vh;
  left: 0;
  overflow-y: scroll;
  padding: 6rem 2rem 0;
  position: fixed;
  top: 0;
  width: 100vw;
}
.admin-bar .et_pb_section:not(.et_pb_sticky) #mobile_menu1 {
  top: 32px;
}
.et_pb_menu__wrap .mobile_menu_bar {
  z-index: 99999;
}
#mobile_menu1 li a,
.et-db #et-boc .et-l #mobile_menu1 li a {
  border: none;
  color: #333;
  padding: 1rem;
  text-align: center;
}
#mobile_menu1 li a:hover,
.et-db #et-boc .et-l #mobile_menu1 li a:hover {
  background: none;
  color: #333;
  opacity: 1;
}
.et-db #et-boc .et-l #mobile_menu1 li.social-links > a {
  display: none;
}
.et-db #et-boc .et-l #mobile_menu1 li.social-links ul {
  display: flex !important;
  justify-content: center;
  margin-top: 1.5rem;
  padding: 0;
}
.et-db #et-boc .et-l #mobile_menu1 li.social-links ul li {
  padding: 0 !important;
}
.et-db #et-boc .et-l #mobile_menu1 li.social-links ul a {
  color: transparent;
  display: inline-block;
  font-size: 0;
  height: 32px;
  position: relative;
  width: 32px;
}
.et-db #et-boc .et-l #mobile_menu1 li.social-links ul a:before {
  color: #333;
  direction: ltr;
  display: block;
  font-family: ETmodules;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-style: normal;
  font-variant: normal;
  font-weight: 400;
  height: 32px;
  left: 0;
  line-height: 32px;
  position: absolute;
  speak: none;
  text-shadow: 0 0;
  text-transform: none;
  top: 0;
  transition: color 0.3s;
  width: 32px;
  z-index: 10;
}
.et-db #et-boc .et-l #mobile_menu1 li.social-links .instagram a:before {
  content: "";
}
.et-db #et-boc .et-l #mobile_menu1 li.social-links .linkedin a:before {
  content: "\E09D";
}
#logo {
  z-index: 3 !important;
}
#menu {
  z-index: 1;
}
.et_pb_menu__wrap {
  background: none;
}
#page-container .et_pb_menu_0_tb_header.et_pb_menu,
.et-db #et-boc .et-l .et_pb_menu_0_tb_header.et_pb_menu {
  background: none !important;
}
.et_pb_section {
  background: none;
}

/* Divi accordion (e.g. /people/)
------------------------------------------------------- */
/* Divi hides the title icon on open items; keep the module's (plus) icon and
   rotate it to an ×. The icon settings below mirror the module's closed-state
   icon settings, which only apply to .et_pb_toggle_close. */
.et_pb_accordion .et_pb_toggle_title:before {
  transition: transform 0.3s ease;
}
.et_pb_accordion .et_pb_accordion_item.et_pb_toggle_open > .et_pb_toggle_title:before {
  display: block !important;
  font-family: "ETmodules" !important;
  content: "\4c" !important;
  font-weight: 400 !important;
  color: var(--gcid-primary-color);
  font-size: 22px;
  line-height: 22px;
  right: -3px;
  transform: rotate(45deg);
}
/* All items closed on load: app.js swaps the classes; this prevents a flash of
   Divi's default first-item-open state before the JS runs. */
body:not(.rr-accordion-ready):not(.et-vb-root-ancestor):not(.et-fb)
  .et_pb_accordion
  .et_pb_accordion_item.et_pb_toggle_open
  .et_pb_toggle_content {
  display: none;
}

/* Contact page form submit buttons (Gravity Forms + Mailchimp)
   Styled to match the Divi button on /news/ (.et_pb_button_0): transparent,
   text + ETmodules arrow, underline on hover.
------------------------------------------------------- */
#main-content .gform_wrapper button#gform_submit_button_1,
.mc-form button[type="submit"],
.mc-form input[type="submit"] {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #333 !important;
  cursor: pointer;
  display: inline-block !important;
  font-family: inherit;
  font-size: var(--text-body-m) !important;
  font-weight: 500 !important;
  height: auto !important;
  line-height: 1.7em !important;
  min-height: 0;
  padding: 0.3em 2em 0.3em 0 !important;
  text-decoration: none;
  text-transform: none;
  transition: background-color 300ms ease;
  width: auto !important;
}
#main-content .gform_wrapper button#gform_submit_button_1:hover,
#main-content .gform_wrapper button#gform_submit_button_1:focus,
.mc-form button[type="submit"]:hover,
.mc-form button[type="submit"]:focus,
.mc-form input[type="submit"]:hover,
.mc-form input[type="submit"]:focus {
  background: transparent !important;
  color: #333 !important;
  outline: none;
  text-decoration: underline;
}
/* Arrow icon (same glyph as the Divi button's data-icon="$") */
#main-content .gform_wrapper button#gform_submit_button_1:after,
.mc-form button[type="submit"]:after {
  color: #333 !important;
  content: "$";
  display: inline-block;
  font-family: "ETmodules" !important;
  font-size: inherit;
  font-weight: 400;
  line-height: 1em;
  margin-left: 0.3em;
  text-decoration: none;
}
