:root {
/* recurring color palette */
--brand-main: #1861bc; /*FP Blue*/
--text-neutral: #5b5750; /*warm grey*/
--neutral-subtle: #e9e8e7; /*light background grey*/
--bright: #d4f5f5; /*cyan*/
--slate: #567d99; /*slate blue*/
--statement: #0098dd; /*bolder blue*/
--bright: #7ed3f3; /*bright blue*/
--text-lush: #5d8c69; /* forest green for text */
--lush-subdued: #f1f9de; /* pale green for backgrounds */
--canvas-base: white;
/* TO DO: consolidate these */
}

/* fonts */
@import url('https://fonts.googleapis.com/css2?family=Murecho:wght@100..900&display=swap');
.murecho,
header.entry-header .entry-title {
  font-family: "Murecho", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

/* functional classes for language toggle JavaScript */
.js-lang {
}
.js-lang.js-hide {
  display: none;
}

/* nav menu language toggle button */
.menu-lang-toggle {
  display: inline list-item;
  color: white;
  border: 1.5px solid white;
  border-radius: 8px;
  font-size: 70%;
  text-align: center;
  vertical-align: middle;
  padding: 4px 6px;
  cursor: pointer;
  user-select: none;
  line-height: 1.2;
}

body {
  font-family: Arial, sans-serif;
  margin: 0;
  padding: 0;
  color: var(--text-neutral);
  background-color: var(--canvas-base);
}

.navbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: var(--brand-main);
  padding: 20px;
}

.navbar ul {
  padding-left: 0;
  list-style-type: none;
  word-wrap: break-word;
  width: 100%;
  text-align: center;
  line-height: 2.5;
}

.navbar li {
  display: inline-flex;
  margin: 0 15px;
}

.navbar a {
  color: var(--canvas-base);
  text-decoration: none;
}

.hero {
  background-color: #0098dd;
  color: var(--canvas-base);
  text-align: center;
  padding: 50px 20px;
}

.lg-cta-button {
  display: inline-flex;
  text-decoration: none;
  background-color: #d4f5f5;
  color: #1861bc;
  padding: 0.5em 1em;
  max-width: 85vw;
  overflow: visible;
  border-radius:128px; 
  font-size: 2em;
  word-break: keep-all;
}

section {
  padding: 40px 20px;
  text-align: center;
}

.feature, .strength {
  margin-bottom: 20px;
  background-color: #e9e8e7;
  padding: 20px;
  border-radius: 5px;
  border: 1px solid #567D99;
}
.bg-highlight {
  background-size: cover;
  background-repeat: no-repeat;
}
.bg-dof-01a {
  background-image: url('https://fluentplanet.jp/wp-content/uploads/2025/05/bg-dof-01a-half-q65.jpg');
}
.bg-dof-01b {
  background-image: url('https://fluentplanet.jp/wp-content/uploads/2025/05/bg-dof-01b-half-q65.jpg');
}
.bg-dof-01c {
  background-image: url('https://fluentplanet.jp/wp-content/uploads/2025/05/bg-dof-01c-half-q65.jpg');
}
.bg-dof-01d {
  background-image: url('https://fluentplanet.jp/wp-content/uploads/2025/05/bg-dof-01d-half-q65.jpg');
}
.bg-dof-01e {
  background-image: url('https://fluentplanet.jp/wp-content/uploads/2025/05/bg-dof-01e-half-q65.jpg');
}
.bg-dof-01f {
  background-image: url('https://fluentplanet.jp/wp-content/uploads/2025/05/bg-dof-01f-half-q65.jpg');
}
.bg-dof-01g {
  background-image: url('https://fluentplanet.jp/wp-content/uploads/2025/05/bg-dof-01g-half-q65.jpg');
}

footer {
  /*background-color: var(--text-neutral);*/
  color: var(--canvas-base);
  text-align: center;
  padding: 20px;
}

footer a {
  color: #d4f5f5;
}

@media (max-width: 768px) {
  .navbar ul {
    flex-direction: column;
  }
}

/* rough styles */
#body-cont ol,
#body-cont ul {
  width: 280px;
  margin-left: auto;
  margin-right: auto;
}
#body-cont ol li,
#body-cont ul li {
  margin-bottom: 20px;
}
.list-position-cont {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

#pricing-plans li {
  list-style-type: none;
  padding: 0;
  margin: 0;
  text-align: left;
}
.list-position-cont h3 {
  margin-bottom: 16px;
}
.text-ja .p-times {
  min-width: 100px;
}
.text-en .p-times {
  min-width: 50px;
}
.p-price {
  min-width: 150px;
}

#about div.info-cont {
  width: 100%;
}
#about div.info-cont ul li {
  list-style-type: none;
  padding: 0;
  margin: 0;
  text-align: left;
}

/* Testimonials */
#testimonials .testim-text {
  line-height: 1.25;
}
.quote-char {
  display: contents;
  font-size: 150%;
  vertical-align: middle;
  padding-right: 4px;
  font-family: arial, sans-serif;
}

.testim-cont {
  max-width: 570px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  margin-bottom: 30px;
}
section#testimonials .testim-cont {
  text-align: left;
}
/* odd/even text/pic ordering: */
.testim-cont:nth-child(odd) .testim-text { order: 2; }
.testim-cont:nth-child(odd) .testim-student-pic { order: 1; }
.testim-cont:nth-child(even) .testim-text { order: 1; }
.testim-cont:nth-child(even) .testim-student-pic { order: 2; }

.testim-student-pic {
  width: 120px;
  min-width: 120px;
  height: 150px;
  background-color: #ddd; /*placeholder fill*/
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  margin-left: 10px;
  margin-right: 10px;
  border-radius: 4px;
}
.testim-student-pic#t-student-01 {background-image: url("https://fluentplanet.jp/wp-content/uploads/2025/08/student-01.jpg");}
.testim-student-pic#t-student-02 {background-image: url("https://fluentplanet.jp/wp-content/uploads/2025/08/student-02.jpg");}
.testim-student-pic#t-student-03 {background-image: url("https://fluentplanet.jp/wp-content/uploads/2025/08/student-03.jpg");}

.testim-cont .quote-src {
  border-top: 1px solid #ddd;
  padding-top: 6px;
  line-height: 3;
  font-size: 85%;
  color: #aaa;
  text-align: center;
}


.w-wrap {
  /*display: inline-flex;
  flex-wrap: wrap;*/
}
.w-wrap * w {
  display: inline-flex;
}


/* WP Astra theme overrides */
:root {
  --ast-global-color-2: #1861bc;
}
.navbar {
  padding: 0px;
}
/*.ast-site-identity {
  padding: 1em 1em;
}*/
.ast-container, .ast-container-fluid {
  padding-left: 0px;
  padding-right: 0px;
}
div.entry-content.clear {
  
}
header.entry-header .entry-title {
  text-align: center;
  font-size: 4.5vw; /* has responsive override */
  color: var(--bright);
}
.site-description, .site-title {
  margin-left: 2vw;
  font-size: 3.5vw; /* has responsive override */
}

/* not overrides per se, but original customiztion */
:root {
  --custom-global-color-subdued: #88aedd;
}
.site-title a, .site-title a:focus, .site-title a:hover, .site-title a:visited { /* site domain at page top */
  color: var(--custom-global-color-subdued);
}

#ast-desktop-header {
  display: flex;
}

/* contact form */
div.fluentform {
  padding-left: 7vw;
  padding-right: 7vw;
}

.top-para {
  padding-left: 7vw;
  padding-right: 7vw;
}

/* info divs (created mainly for the About section) */
.info-cont {
  display: flex;
  flex-direction: column;
}
.info-cont .info-row {
  display: flex;
  flex-direction: column; /* default for mobile width */
}
.info-cont .info-row .info-cell {
  padding: 24px;
}


/* services list */
div.serv-list-cont {
  background-color: #E0EFF2;
  border: 4px solid #0098DD;
  border-radius: 32px;
  display: block;
  margin-left: auto;
  margin-right: auto;
  max-width: 420px;
}
div.serv-list-cont h2 {
  border: 8px solid #E0EFF2;
  background-color: white;
  border-radius: 32px;
  margin-top: -20px;
  width: fit-content;
  display: inline-block;
  padding-left: 20px;
  padding-right: 20px;
  padding-top: 4px;
  padding-bottom: 4px;
  text-align: center;
  color: #939598;
}
div.serv-list-cont ul {
  list-style-type: circle;
  text-align: left;
  color: #0098DD;
  font-weight: 600;
  font-size: 1.1em;
}


/* IMAGES */
img.main-imagery {
  display: block;
  width: 100%;
  max-width: 960px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 40px;
  margin-bottom: 40px;
  border-radius: unset;
  box-shadow: 1px 3px 9px 0px rgba(24,97,188,0.26);
}

.w-wrap.wrap-color2 {
  /*background-color: #f0ffd0;*/
  /*background-color: #ecf4d9;*/
  background-color: var(--lush-subdued);
  color: var(--text-lush);
}
.w-wrap.wrap-color2 h1,
.w-wrap.wrap-color2 h2,
.w-wrap.wrap-color2 h3,
.w-wrap.wrap-color2 h4,
.w-wrap.wrap-color2 h5,
.w-wrap.wrap-color2 h6 {
  color: #339d7a;
}

.social-cont-lg {
  display: flex;
  justify-content: space-evenly;
  margin-top: 16px;
  max-height: 90px; /*resp*/
}
.social-cont-lg .social-text-cont {
  margin-top: auto;
  margin-bottom: auto;
}
.social-cont-lg .social-text-cont p {
  margin-top: 0;
  margin-bottom: 0;
}
a.subdued-link,
a.subdued-link:link,
a.subdued-link:visited {
  transition: color 1s;
  color: var(--bright);
}
a.subdued-link:hover {
  color: var(--text-neutral);
}
a.subdued-link:focus,
a.subdued-link:active {
  transition: color 0.15s;
  color: var(--statement);
}

img.qr-code {
  width: 90px;
  height: 90px;
}

/* RESPONSIVE */

@media (min-width: 768px) /*md*/ {
  .info-cont .info-row {
    flex-direction: row;
  }
  .info-cont .info-row .info-cell {
    width: 50%; /* two-column */
  }

  header.entry-header .entry-title {
    text-align: center;
    font-size: 3.5vw;
  }

  .site-description, .site-title {
    margin-left: 2vw;
    font-size: 2.5vw;
  }

  img.main-imagery {
    width: calc(100% - 40px);
    border-radius: 16px;
  }

  .social-cont-lg {
    max-height: 135px;
  }

  img.qr-code {
    width: 135px;
    height: 135px;
  }

}