*{
box-sizing:border-box;
margin:0;
padding:0;
font-family:Segoe UI,Arial,sans-serif;
}

body{background:#f6f8fb;color:#222}

/* HERO */
.otel-hero{
height:420px;
background:url("../images/hero.jpg") center/cover no-repeat;
position:relative;
}
.overlay{position:absolute;inset:0;background:rgba(0,0,0,.55)}
.hero-inner{
max-width:1200px;width:92%;margin:auto;height:100%;
display:flex;flex-direction:column;justify-content:center;color:#fff
}
.hero-inner h1{font-size:42px;font-weight:900}
.hero-inner p{font-size:18px;margin-top:10px}

/* INTRO */
.otel-intro,.otel-model{
max-width:1100px;width:92%;margin:70px auto;text-align:center
}
.otel-intro h2,.otel-model h2{font-size:32px;font-weight:800;margin-bottom:14px}
.otel-intro p,.otel-model p{font-size:17px;line-height:1.7}

/* POSITIONS */
.otel-positions{
max-width:1100px;width:92%;margin:80px auto
}
.otel-positions h2{
text-align:center;font-size:32px;margin-bottom:30px
}

.accordion-item{
background:#fff;border-radius:10px;
margin-bottom:12px;overflow:hidden;
box-shadow:0 6px 18px rgba(0,0,0,.06)
}
.accordion-header{
width:100%;padding:18px 22px;
background:#0b2c4d;color:#fff;
font-size:18px;font-weight:700;
border:none;text-align:left;cursor:pointer
}
.accordion-body{
max-height:0;overflow:hidden;
transition:max-height .35s ease;
padding:0 22px
}
.accordion-body p{margin-top:16px;font-size:16px}
.accordion-body ul{margin:14px 0 20px 20px}

/* FORM */
.otel-form{
background:#fff;max-width:700px;width:92%;
margin:90px auto;padding:40px;border-radius:12px
}
.otel-form h2{text-align:center;margin-bottom:22px}
.otel-form input,.otel-form textarea{
width:100%;padding:14px;margin-bottom:14px;
border:1px solid #ddd;border-radius:6px
}
.otel-form button{
width:100%;padding:15px;
background:#ff7a00;color:#fff;
font-size:17px;font-weight:700;border:none;border-radius:6px;cursor:pointer
}
.form-success{
display:none;text-align:center;
color:green;font-weight:700;margin-top:18px
}

/* =========================
   SUCCESS AREA
========================= */

.success-area{
  background:#f6f8fb;
  padding:80px 0;
}

.success-inner{
  max-width:1200px;
  width:92%;
  margin:auto;
}

.success-inner h2{
  text-align:center;
  font-size:34px;
  font-weight:900;
  margin-bottom:14px;
  color:#111;
}

.success-intro{
  max-width:900px;
  margin:0 auto 50px;
  text-align:center;
  font-size:17px;
  line-height:1.7;
  color:#444;
}

/* GRID */

.success-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:26px;
}

/* BOX */

.success-box{
  background:#fff;
  border-radius:14px;
  padding:26px 24px;
  box-shadow:0 12px 28px rgba(0,0,0,.06);
  transition:.3s ease;
  position:relative;
}

.success-box::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:4px;
  background:linear-gradient(90deg,#0b2c4a,#ff8a00);
  border-radius:14px 14px 0 0;
}

.success-box:hover{
  transform:translateY(-6px);
  box-shadow:0 20px 40px rgba(0,0,0,.10);
}

.success-box h3{
  font-size:20px;
  font-weight:800;
  margin-bottom:10px;
  color:#0b2c4a;
}

.success-box p{
  font-size:15.5px;
  line-height:1.65;
  color:#555;
}

/* NOTE */

.success-note{
  margin-top:50px;
  padding:18px 22px;
  background:#eef3f8;
  border-left:4px solid #0b2c4a;
  font-size:14.5px;
  color:#444;
  border-radius:8px;
}

/* MOBILE */

@media(max-width:768px){

  .success-inner h2{
    font-size:28px;
  }

  .success-intro{
    font-size:16px;
  }

}
/* =========================
   WHY SEAACADEMYIK
========================= */

.why-seaacademy{
  background:#ffffff;
  padding:90px 0;
}

.why-inner{
  max-width:1200px;
  width:92%;
  margin:auto;
}

.why-inner h2{
  text-align:center;
  font-size:34px;
  font-weight:900;
  margin-bottom:14px;
  color:#0b2c4a;
}

.why-intro{
  max-width:880px;
  margin:0 auto 55px;
  text-align:center;
  font-size:17px;
  line-height:1.7;
  color:#444;
}

/* GRID */

.why-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:28px;
}

/* BOX */

.why-box{
  border:1px solid #e6ebf1;
  border-radius:14px;
  padding:28px 26px;
  background:#f9fbfd;
  transition:.3s ease;
}

.why-box:hover{
  background:#fff;
  box-shadow:0 18px 40px rgba(0,0,0,.08);
  transform:translateY(-4px);
}

.why-box h3{
  font-size:20px;
  font-weight:800;
  margin-bottom:10px;
  color:#0b2c4a;
}

.why-box p{
  font-size:15.5px;
  line-height:1.65;
  color:#555;
}

/* FOOTER NOTE */

.why-footer{
  margin-top:55px;
  padding:22px 26px;
  background:#f1f6fb;
  border-left:5px solid #ff8a00;
  border-radius:10px;
  font-size:15.5px;
  line-height:1.65;
  color:#333;
}

/* MOBILE */

@media(max-width:768px){

  .why-inner h2{
    font-size:28px;
  }

  .why-intro{
    font-size:16px;
  }

}
/* =========================
   CLIENT FEEDBACK
========================= */

.client-feedback{
  background:#f6f8fb;
  padding:90px 0;
}

.feedback-inner{
  max-width:1200px;
  width:92%;
  margin:auto;
}

.feedback-inner h2{
  text-align:center;
  font-size:34px;
  font-weight:900;
  margin-bottom:14px;
  color:#111;
}

.feedback-intro{
  max-width:900px;
  margin:0 auto 55px;
  text-align:center;
  font-size:17px;
  line-height:1.7;
  color:#444;
}

/* GRID */

.feedback-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:26px;
}

/* BOX */

.feedback-box{
  background:#fff;
  padding:26px 24px;
  border-radius:14px;
  box-shadow:0 10px 26px rgba(0,0,0,.06);
  position:relative;
}

.feedback-box p{
  font-size:15.5px;
  line-height:1.7;
  color:#444;
  margin-bottom:14px;
}

.feedback-box span{
  display:block;
  font-size:14px;
  font-weight:700;
  color:#0b2c4a;
}

/* subtle quote effect */

.feedback-box::before{
  content:"“";
  position:absolute;
  top:12px;
  left:16px;
  font-size:60px;
  color:#e2e8f0;
  line-height:1;
}

/* NOTE */

.feedback-note{
  margin-top:50px;
  padding:18px 24px;
  background:#eef3f8;
  border-left:5px solid #0b2c4a;
  border-radius:10px;
  font-size:14.5px;
  color:#444;
}

/* MOBILE */

@media(max-width:768px){

  .feedback-inner h2{
    font-size:28px;
  }

  .feedback-intro{
    font-size:16px;
  }

}
/* =========================
   FAQ
========================= */

.faq-area{
  background:#ffffff;
  padding:90px 0;
}

.faq-inner{
  max-width:1100px;
  width:92%;
  margin:auto;
}

.faq-inner h2{
  text-align:center;
  font-size:34px;
  font-weight:900;
  margin-bottom:14px;
  color:#0b2c4a;
}

.faq-intro{
  max-width:900px;
  margin:0 auto 50px;
  text-align:center;
  font-size:17px;
  line-height:1.7;
  color:#444;
}

/* FAQ ITEMS */

.faq-item{
  border:1px solid #e6ebf1;
  border-radius:12px;
  margin-bottom:14px;
  overflow:hidden;
}

.faq-question{
  width:100%;
  text-align:left;
  background:#f8fafc;
  border:none;
  padding:20px 22px;
  font-size:16.5px;
  font-weight:700;
  color:#0b2c4a;
  cursor:pointer;
  position:relative;
}

.faq-question::after{
  content:"+";
  position:absolute;
  right:20px;
  top:50%;
  transform:translateY(-50%);
  font-size:22px;
  transition:.3s ease;
}

.faq-item.active .faq-question::after{
  content:"−";
}

.faq-answer{
  max-height:0;
  overflow:hidden;
  transition:max-height .35s ease;
  background:#fff;
}

.faq-item.active .faq-answer{
  max-height:500px;
}

.faq-answer p{
  padding:18px 22px 22px;
  font-size:15.5px;
  line-height:1.7;
  color:#555;
}

/* MOBILE */

@media(max-width:768px){

  .faq-inner h2{
    font-size:28px;
  }

  .faq-intro{
    font-size:16px;
  }

}


/* =========================
   CTA CONTACT
========================= */

.cta-contact{
  background:linear-gradient(135deg,#0b2c4a,#143d63);
  padding:90px 0;
  color:#fff;
}

.cta-inner{
  max-width:1000px;
  width:92%;
  margin:auto;
  text-align:center;
}

.cta-inner h2{
  font-size:36px;
  font-weight:900;
  margin-bottom:14px;
  letter-spacing:.3px;
}

.cta-text{
  font-size:18px;
  line-height:1.7;
  max-width:820px;
  margin:0 auto 14px;
  opacity:.95;
}

.cta-subtext{
  font-size:16px;
  max-width:760px;
  margin:0 auto 36px;
  opacity:.9;
}

/* ACTIONS */

.cta-actions{
  display:flex;
  justify-content:center;
  gap:18px;
  flex-wrap:wrap;
}

.cta-btn{
  padding:16px 34px;
  font-size:16px;
  font-weight:700;
  border-radius:40px;
  text-decoration:none;
  transition:.3s ease;
  display:inline-block;
}

/* PRIMARY */

.cta-btn.primary{
  background:#ff8a00;
  color:#fff;
}

.cta-btn.primary:hover{
  background:#ffa733;
  transform:translateY(-2px);
}

/* SECONDARY */

.cta-btn.secondary{
  border:2px solid rgba(255,255,255,.6);
  color:#fff;
}

.cta-btn.secondary:hover{
  background:rgba(255,255,255,.1);
  transform:translateY(-2px);
}

/* MOBILE */

@media(max-width:768px){

  .cta-inner h2{
    font-size:28px;
  }

  .cta-text{
    font-size:16.5px;
  }

  .cta-btn{
    width:100%;
    text-align:center;
  }

}
