/* Overrides for the live page only. ogindex.html does not load this file, so
   the archive copy keeps the old behaviour exactly.

   The template's hero was built for desktop. On a phone the headline ran off
   the screen, the second button was cut off, and the sign-up panel vanished.
   These rules fix that. Loaded last, after responsive.css. */

/* the headline: let it wrap, and scale with the viewport */
.home_slider_title{
  font-size: clamp(22px, 4.2vw, 48px);
  line-height: 1.25;
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
  overflow-wrap: break-word;
}

/* On desktop the sign-up panel is absolutely positioned at the right, about
   380px wide. The headline used to clear it only because it carried hardcoded
   <br> tags, which broke the phone layout. The tags are gone, so the headline
   is given a width that clears the panel instead. */
@media (min-width: 992px){
  .home_slider_title{
    max-width: calc(100% - 430px);
    margin-left: 0;
    text-align: left;
  }
  .hero_actions{
    max-width: calc(100% - 430px);
    margin-left: 0;
    justify-content: flex-start;
  }
}

/* the two buttons: a wrapping row instead of a fixed-width table */
.hero_actions{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
  margin: 26px auto 0;
  max-width: 650px;
}
.hero_actions .view_button_orange{ margin: 0; }

/* the sign-up panel: it is absolutely positioned on desktop. Below 991px it
   becomes a normal block so it stays on screen. */
@media (max-width: 991px){
  .counter_form{
    position: static !important;
    width: 100% !important;
    max-width: 380px;
    margin: 30px auto 0;
    padding-right: 0;
  }
  .home_slider_content{ padding-bottom: 30px; }
}

/* nothing may push the page sideways on a phone */
@media (max-width: 767px){
  html, body{ overflow-x: hidden; }
  .home_slider_title{ padding: 0 6px; }
  .hero_actions{ gap: 12px; }
  .hero_actions a{ font-size: 13px; }
}

/* ---- content sections added 2026-09-23 ---------------------------------- */

.pp_section{ padding: 70px 0; }
.pp_section.alt{ background: #f5f8fa; }
.pp_section .section_subtitle p{ max-width: 720px; margin: 0 auto; }

/* stat tiles: reuse .feature */
.pp_stat{ font-family: 'Roboto Slab', serif; font-size: 40px; font-weight: 700;
          color: #14bdee; line-height: 1; }
.pp_stat_cap{ display:block; margin-top:10px; font-size:15px; color:#384158; font-weight:500; }

/* three-part format */
.pp_part{ background:#fff; border:1px solid #e5e5e7; border-radius:6px; padding:26px 24px; height:100%; }
.pp_part h3{ font-family:'Roboto Slab',serif; font-size:19px; color:#384158; margin:0 0 4px; }
.pp_part .pp_time{ color:#14bdee; font-weight:500; font-size:14px; margin-bottom:14px; }
.pp_part ul{ list-style:none; padding:0; margin:0; }
.pp_part li{ font-size:14px; line-height:1.55; padding:6px 0; border-top:1px solid #eef1f4; color:#595959; }
.pp_part li span{ float:right; color:#8a8f9c; font-size:13px; padding-left:10px; }
.pp_part li.pp_new::after{ content:"new"; float:right; font-size:11px; font-weight:700;
          color:#0c9ec8; background:#e7f7fd; border-radius:999px; padding:2px 8px; margin-left:8px; }

/* tables */
.pp_table_wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
table.pp_table{ width:100%; border-collapse:collapse; background:#fff; font-size:15px;
                border:1px solid #e5e5e7; border-radius:6px; overflow:hidden; }
table.pp_table th, table.pp_table td{ padding:12px 14px; text-align:center; border-bottom:1px solid #eef1f4; }
table.pp_table th{ background:#384158; color:#fff; font-weight:500; font-size:14px; }
table.pp_table td:first-child, table.pp_table th:first-child{ text-align:left; font-weight:500; color:#384158; }
table.pp_table tr:last-child td{ border-bottom:0; }
table.pp_table td.pp_num{ font-family:'Roboto Slab',serif; font-weight:700; color:#14bdee; font-size:17px; }
.pp_note{ font-size:13px; color:#8a8f9c; line-height:1.6; margin:14px 0 0; }
.pp_note a{ color:#0c9ec8; }

/* accepted-by tiles */
.pp_country{ background:#fff; border:1px solid #e5e5e7; border-radius:6px; padding:22px; height:100%; }
.pp_country h3{ font-family:'Roboto Slab',serif; font-size:18px; color:#384158; margin:0 0 6px; }
.pp_country .pp_big{ font-family:'Roboto Slab',serif; font-size:30px; font-weight:700; color:#14bdee; line-height:1.1; }
.pp_country p{ font-size:14px; color:#595959; margin:8px 0 0; line-height:1.55; }

/* booking list */
.pp_facts{ list-style:none; padding:0; margin:0; max-width:760px; margin:0 auto; }
.pp_facts li{ position:relative; padding:12px 0 12px 28px; border-top:1px solid #e5e5e7; font-size:15px; color:#595959; line-height:1.6; }
.pp_facts li:last-child{ border-bottom:1px solid #e5e5e7; }
.pp_facts li::before{ content:""; position:absolute; left:4px; top:20px; width:10px; height:10px; border-radius:50%; background:#14bdee; }

.pp_disclaimer{ font-size:13px; color:#8a8f9c; line-height:1.6; max-width:820px; margin:0 auto; text-align:center; }

@media (max-width: 991px){
  .pp_section{ padding:50px 0; }
  .pp_part, .pp_country{ margin-bottom:20px; height:auto; }
}

/* the IELTS table has no header row; its first row is the PTE scale */
table.pp_table tr.pp_lead td{ background:#f5f8fa; border-bottom:2px solid #e5e5e7; }

/* five-column tables must fit a 390px phone without scrolling */
@media (max-width: 480px){
  table.pp_table{ font-size:13px; }
  table.pp_table th, table.pp_table td{ padding:9px 5px; }
  table.pp_table td.pp_num{ font-size:15px; }
  table.pp_table td:first-child, table.pp_table th:first-child{ font-size:13px; }
}
