/*
 * NURIA TOURS
 * Page: Travel Professionals
 * File: assets/css/pages/travel-professionals.css
 * Languages: EN + ES
 * Created: August 24, 2026
 * Updated: August 24, 2026
 *
 * Visual Standard:
 * NURIA TOURS Institutional / Ecosystem
 */


/* ==========================================================
   01. PAGE SYSTEM
========================================================== */

.travel-professionals-page {
  --tp-red: #c21d1d;
  --tp-red-dark: #9f1717;

  --tp-navy: #10243b;
  --tp-navy-deep: #091827;

  --tp-charcoal: #252a30;
  --tp-gray: #69737d;
  --tp-gray-soft: #8a9299;

  --tp-platinum: #d9dcdf;
  --tp-border: #e1e5e8;

  --tp-offwhite: #f7f6f2;
  --tp-warm: #f2efe9;
  --tp-white: #ffffff;

  --tp-gold: #b59a63;

  --tp-shadow-soft:
    0 16px 42px rgba(16, 36, 59, 0.08);

  --tp-shadow:
    0 24px 60px rgba(16, 36, 59, 0.11);

  color: var(--tp-charcoal);
  background: var(--tp-white);

  overflow: hidden;
}


/* ==========================================================
   02. SHARED TYPOGRAPHY
========================================================== */

.travel-professionals-page .tp-kicker,
.travel-professionals-page .tp-section-kicker {
  display: inline-block;

  margin-bottom: 1rem;

  color: var(--tp-red);

  font-size: 0.72rem;
  font-weight: 700;

  letter-spacing: 0.18em;
  text-transform: uppercase;
}


.travel-professionals-page .tp-section-title {
  margin: 0 0 1.45rem;

  color: var(--tp-navy);

  font-family: "Cormorant Garamond", Georgia, serif;

  font-size: clamp(2.65rem, 4vw, 4.35rem);
  font-weight: 500;

  line-height: 0.98;
  letter-spacing: -0.03em;
}


.travel-professionals-page .tp-section-title span {
  display: block;
  color: var(--tp-red);
}


.travel-professionals-page .tp-section-lead {
  max-width: 720px;

  margin-bottom: 1.25rem;

  color: #3f4b56;

  font-size: 1.02rem;
  line-height: 1.8;
}


.travel-professionals-page .tp-section-text {
  max-width: 720px;

  margin: 0;

  color: var(--tp-gray);

  font-size: 0.94rem;
  line-height: 1.8;
}


/* ==========================================================
   03. BUTTONS + LINKS
========================================================== */

.travel-professionals-page .tp-btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-height: 48px;

  padding: 0.8rem 1.55rem;

  border: 1px solid var(--tp-red);
  border-radius: 4px;

  background: var(--tp-red);
  color: var(--tp-white);

  font-size: 0.74rem;
  font-weight: 700;

  letter-spacing: 0.07em;
  text-transform: uppercase;
  text-decoration: none;

  transition:
    background 0.25s ease,
    border-color 0.25s ease,
    transform 0.25s ease,
    box-shadow 0.25s ease;
}


.travel-professionals-page .tp-btn-primary:hover,
.travel-professionals-page .tp-btn-primary:focus {
  background: var(--tp-red-dark);
  border-color: var(--tp-red-dark);

  color: var(--tp-white);

  transform: translateY(-2px);

  box-shadow:
    0 12px 28px rgba(194, 29, 29, 0.18);
}


.travel-professionals-page .tp-text-link {
  display: inline-flex;
  align-items: center;

  gap: 0.55rem;

  color: var(--tp-navy);

  font-size: 0.75rem;
  font-weight: 700;

  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-decoration: none;
}


.travel-professionals-page .tp-text-link span {
  color: var(--tp-red);

  transition: transform 0.25s ease;
}


.travel-professionals-page .tp-text-link:hover span {
  transform: translateX(4px);
}


/* ==========================================================
   04. HERO
   NURIA TOURS INSTITUTIONAL STANDARD
========================================================== */

.tp-hero {
  position: relative;

  padding: clamp(4.5rem, 7vw, 7.5rem) 0;

  background:
    linear-gradient(
      115deg,
      #ffffff 0%,
      #faf9f6 47%,
      #efede8 100%
    );

  border-bottom: 1px solid #e9e7e1;
}


.tp-hero::before {
  content: "";

  position: absolute;
  top: 0;
  left: 0;

  width: 4px;
  height: 100%;

  background: var(--tp-red);
}


.tp-hero::after {
  content: "";

  position: absolute;
  top: -180px;
  left: 32%;

  width: 520px;
  height: 520px;

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(194, 29, 29, 0.035),
      transparent 68%
    );

  pointer-events: none;
}


.tp-hero .container {
  position: relative;
  z-index: 2;
}


.tp-hero-content {
  max-width: 670px;
}


.tp-hero-title {
  max-width: 680px;

  margin: 0 0 1.5rem;

  color: var(--tp-navy);

  font-family: "Cormorant Garamond", Georgia, serif;

  font-size: clamp(3.35rem, 5.6vw, 5.9rem);
  font-weight: 500;

  line-height: 0.91;
  letter-spacing: -0.045em;
}


.tp-hero-title span {
  display: block;

  margin-top: 0.25rem;

  color: var(--tp-red);
}


.tp-hero-lead {
  max-width: 600px;

  margin-bottom: 1.9rem;

  color: #4b5761;

  font-size: clamp(1rem, 1.3vw, 1.12rem);
  line-height: 1.82;
}


.tp-hero-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;

  gap: 1.4rem;

  margin-bottom: 2.25rem;
}


.tp-hero-note {
  display: flex;
  align-items: center;

  gap: 0.9rem;
}


.tp-hero-note-line {
  display: block;

  width: 42px;
  height: 1px;

  background: var(--tp-red);
}


.tp-hero-note p {
  margin: 0;

  color: #777f87;

  font-size: 0.7rem;

  line-height: 1.6;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}


/* ----------------------------------------------------------
   HERO VISUAL
---------------------------------------------------------- */

.tp-hero-visual {
  position: relative;

  max-width: 540px;

  margin-left: auto;
}


.tp-hero-image-wrap {
  position: relative;

  overflow: hidden;

  border-radius: 6px;

  background: #e8e6e1;

  box-shadow: var(--tp-shadow);
}


.tp-hero-image-wrap::before {
  content: "";

  position: absolute;
  z-index: 2;

  inset: 0;

  background:
    linear-gradient(
      180deg,
      transparent 55%,
      rgba(9, 24, 39, 0.08) 100%
    );

  pointer-events: none;
}


.tp-hero-image-wrap::after {
  content: "";

  position: absolute;
  z-index: 3;

  top: 22px;
  right: 22px;

  width: 54px;
  height: 3px;

  background: var(--tp-red);
}


.tp-hero-image {
  display: block;

  width: 100%;
  height: auto;

  object-fit: cover;
}


.tp-hero-visual-label {
  position: absolute;
  z-index: 5;

  left: -34px;
  bottom: 28px;

  display: flex;
  align-items: center;

  gap: 0.75rem;

  padding: 1rem 1.25rem;

  border-radius: 3px;

  background: rgba(16, 36, 59, 0.96);
  color: var(--tp-white);

  box-shadow:
    0 14px 34px rgba(9, 24, 39, 0.22);

  font-size: 0.66rem;
  font-weight: 700;

  letter-spacing: 0.12em;
}


.tp-label-dot {
  color: var(--tp-red);
}


/* ==========================================================
   05. INTRODUCTION
========================================================== */

.tp-introduction {
  padding: clamp(5rem, 7vw, 7.5rem) 0;

  background: var(--tp-white);
}


.tp-intro-content {
  max-width: 720px;
}


.tp-intro-panel {
  position: relative;

  overflow: hidden;

  padding: clamp(2rem, 3.5vw, 3rem);

  border-radius: 5px;

  background:
    linear-gradient(
      145deg,
      #132b46 0%,
      var(--tp-navy-deep) 100%
    );

  color: var(--tp-white);

  box-shadow: var(--tp-shadow-soft);
}


.tp-intro-panel::before {
  content: "";

  position: absolute;
  top: 0;
  left: 0;

  width: 4px;
  height: 100%;

  background: var(--tp-red);
}


.tp-intro-panel::after {
  content: "";

  position: absolute;
  right: -80px;
  bottom: -80px;

  width: 220px;
  height: 220px;

  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 50%;
}


.tp-intro-panel-label {
  position: relative;
  z-index: 2;

  display: block;

  margin-bottom: 1.15rem;

  color: var(--tp-gold);

  font-size: 0.67rem;
  font-weight: 700;

  letter-spacing: 0.15em;
  text-transform: uppercase;
}


.tp-intro-panel-text {
  position: relative;
  z-index: 2;

  margin: 0 0 1.5rem;

  color: var(--tp-white);

  font-family: "Cormorant Garamond", Georgia, serif;

  font-size: clamp(1.9rem, 2.8vw, 2.75rem);
  font-weight: 500;

  line-height: 1.08;
}


.tp-intro-panel-line {
  position: relative;
  z-index: 2;

  width: 46px;
  height: 1px;

  margin-bottom: 1.45rem;

  background: var(--tp-red);
}


.tp-intro-panel-points {
  position: relative;
  z-index: 2;

  display: grid;
  grid-template-columns: 1fr 1fr;

  gap: 0.85rem 1.2rem;
}


.tp-intro-panel-points span {
  color: rgba(255, 255, 255, 0.74);

  font-size: 0.76rem;
  line-height: 1.5;
}


/* ==========================================================
   06. ADVANTAGE
   HOME-STYLE FEATURE CARDS
========================================================== */

.tp-advantage {
  padding: clamp(5rem, 7vw, 7.5rem) 0;

  background: var(--tp-offwhite);
}


.tp-advantage-header {
  max-width: 800px;

  margin-bottom: 3.25rem;
}


.tp-advantage-grid {
  margin-top: 0;
}


.tp-advantage-card {
  position: relative;

  height: 100%;

  padding: 2rem 1.65rem;

  border: 1px solid var(--tp-border);
  border-radius: 5px;

  background: var(--tp-white);

  box-shadow:
    0 8px 24px rgba(16, 36, 59, 0.035);

  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    border-color 0.25s ease;
}


.tp-advantage-card::before {
  content: "";

  position: absolute;
  top: 0;
  left: 0;

  width: 46px;
  height: 3px;

  background: var(--tp-red);
}


.tp-advantage-card:hover {
  transform: translateY(-5px);

  border-color: rgba(194, 29, 29, 0.2);

  box-shadow: var(--tp-shadow-soft);
}


.tp-advantage-number {
  display: block;

  margin-bottom: 1.5rem;

  color: var(--tp-red);

  font-size: 0.68rem;
  font-weight: 700;

  letter-spacing: 0.12em;
}


.tp-advantage-card h3 {
  min-height: 2.6em;

  margin-bottom: 0.85rem;

  color: var(--tp-navy);

  font-family: "Cormorant Garamond", Georgia, serif;

  font-size: 1.55rem;
  font-weight: 500;

  line-height: 1.1;
}


.tp-advantage-card p {
  margin: 0;

  color: var(--tp-gray);

  font-size: 0.86rem;
  line-height: 1.7;
}


/* ==========================================================
   07. HOW IT WORKS
========================================================== */

.tp-how-it-works {
  padding: clamp(5rem, 7vw, 7.5rem) 0;

  background: var(--tp-white);
}


.tp-how-header {
  max-width: 780px;

  margin: 0 auto 3.5rem;
}


.tp-how-header .tp-section-title {
  text-align: center;
}


.tp-how-header .tp-section-lead {
  max-width: 680px;

  margin-left: auto;
  margin-right: auto;

  text-align: center;
}


.tp-how-steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);

  gap: 1px;

  overflow: hidden;

  border: 1px solid var(--tp-border);
  border-radius: 5px;

  background: var(--tp-border);
}


.tp-how-step {
  position: relative;

  min-height: 220px;

  padding: 1.8rem;

  background: var(--tp-white);
}


.tp-how-step::after {
  content: "";

  position: absolute;
  left: 1.8rem;
  bottom: 0;

  width: 0;
  height: 3px;

  background: var(--tp-red);

  transition: width 0.25s ease;
}


.tp-how-step:hover::after {
  width: 42px;
}


.tp-how-number {
  display: block;

  margin-bottom: 1.9rem;

  color: var(--tp-red);

  font-size: 0.67rem;
  font-weight: 700;

  letter-spacing: 0.12em;
}


.tp-how-step h3 {
  margin-bottom: 0.7rem;

  color: var(--tp-navy);

  font-family: "Cormorant Garamond", Georgia, serif;

  font-size: 1.7rem;
  font-weight: 500;
}


.tp-how-step p {
  margin: 0;

  color: var(--tp-gray);

  font-size: 0.84rem;
  line-height: 1.65;
}


.tp-how-summary {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;

  gap: 0.65rem;

  margin-top: 2rem;

  color: var(--tp-navy);

  font-size: 0.66rem;
  font-weight: 700;

  letter-spacing: 0.11em;
}


.tp-how-summary span:nth-child(even) {
  color: var(--tp-red);
}


/* ==========================================================
   08. TRAINING
========================================================== */

.tp-training {
  padding: clamp(5rem, 7vw, 7.5rem) 0;

  background: var(--tp-offwhite);
}


.tp-training-intro {
  position: sticky;
  top: 120px;
}


.tp-training-statement {
  display: flex;

  gap: 0.9rem;

  margin-top: 1.8rem;
}


.tp-training-line {
  flex: 0 0 40px;

  height: 1px;
  margin-top: 0.75rem;

  background: var(--tp-red);
}


.tp-training-statement p {
  margin: 0;

  color: var(--tp-navy);

  font-family: "Cormorant Garamond", Georgia, serif;

  font-size: 1.25rem;
  line-height: 1.4;
}


.tp-training-grid {
  overflow: hidden;

  border: 1px solid var(--tp-border);
  border-radius: 5px;

  background: var(--tp-white);

  box-shadow:
    0 8px 24px rgba(16, 36, 59, 0.035);
}


.tp-training-item {
  display: grid;
  grid-template-columns: 58px 1fr;

  gap: 1rem;

  padding: 1.6rem 1.7rem;

  border-bottom: 1px solid var(--tp-border);
}


.tp-training-item:last-child {
  border-bottom: 0;
}


.tp-training-number {
  color: var(--tp-red);

  font-size: 0.67rem;
  font-weight: 700;

  letter-spacing: 0.1em;
}


.tp-training-item h3 {
  margin-bottom: 0.45rem;

  color: var(--tp-navy);

  font-family: "Cormorant Garamond", Georgia, serif;

  font-size: 1.5rem;
  font-weight: 500;
}


.tp-training-item p {
  max-width: 600px;

  margin: 0;

  color: var(--tp-gray);

  font-size: 0.86rem;
  line-height: 1.68;
}


.tp-training-note {
  margin-top: 1.7rem;

  padding-top: 1rem;

  border-top: 1px solid rgba(16, 36, 59, 0.08);
}


.tp-training-note p {
  margin: 0;

  color: #858d94;

  font-size: 0.72rem;
  line-height: 1.55;
}


/* ==========================================================
   09. STRUCTURED COMPENSATION
   PUBLIC POSITIONING ONLY
========================================================== */

.tp-compensation {
  padding: clamp(5rem, 7vw, 7.5rem) 0;

  background: var(--tp-white);
}


.tp-compensation-intro {
  max-width: 650px;
}


.tp-compensation-panel {
  position: relative;

  overflow: hidden;

  padding: clamp(2rem, 4vw, 3.2rem);

  border-radius: 5px;

  background:
    linear-gradient(
      145deg,
      #132b46,
      var(--tp-navy-deep)
    );

  color: var(--tp-white);

  box-shadow: var(--tp-shadow-soft);
}


.tp-compensation-panel::before {
  content: "";

  position: absolute;
  top: 0;
  left: 0;

  width: 4px;
  height: 100%;

  background: var(--tp-red);
}


.tp-compensation-panel::after {
  content: "";

  position: absolute;
  top: -85px;
  right: -85px;

  width: 250px;
  height: 250px;

  border: 1px solid rgba(255, 255, 255, 0.055);
  border-radius: 50%;
}


.tp-compensation-panel-kicker {
  position: relative;
  z-index: 2;

  display: block;

  margin-bottom: 1rem;

  color: var(--tp-gold);

  font-size: 0.67rem;
  font-weight: 700;

  letter-spacing: 0.14em;
}


.tp-compensation-panel-title {
  position: relative;
  z-index: 2;

  max-width: 500px;

  margin: 0 0 1rem;

  color: var(--tp-white);

  font-family: "Cormorant Garamond", Georgia, serif;

  font-size: clamp(2rem, 3.2vw, 3rem);
  font-weight: 500;

  line-height: 1.05;
}


.tp-compensation-panel-text {
  position: relative;
  z-index: 2;

  max-width: 560px;

  margin: 0;

  color: rgba(255, 255, 255, 0.68);

  font-size: 0.9rem;
  line-height: 1.75;
}


.tp-compensation-panel-line {
  position: relative;
  z-index: 2;

  width: 44px;
  height: 1px;

  margin: 1.6rem 0 1.25rem;

  background: var(--tp-red);
}


.tp-compensation-panel-note {
  position: relative;
  z-index: 2;

  color: rgba(255, 255, 255, 0.55);

  font-size: 0.68rem;

  letter-spacing: 0.08em;
  text-transform: uppercase;
}


/* ==========================================================
   10. WHO IT'S FOR
========================================================== */

.tp-who {
  padding: clamp(5rem, 7vw, 7.5rem) 0;

  background: var(--tp-offwhite);
}


.tp-who-intro {
  position: sticky;
  top: 120px;
}


.tp-who-grid {
  overflow: hidden;

  border: 1px solid var(--tp-border);
  border-radius: 5px;

  background: var(--tp-white);
}


.tp-who-item {
  display: grid;
  grid-template-columns: 58px 1fr;

  gap: 1rem;

  padding: 1.65rem 1.7rem;

  border-bottom: 1px solid var(--tp-border);
}


.tp-who-item:last-child {
  border-bottom: 0;
}


.tp-who-number {
  color: var(--tp-red);

  font-size: 0.67rem;
  font-weight: 700;

  letter-spacing: 0.1em;
}


.tp-who-item h3 {
  margin-bottom: 0.45rem;

  color: var(--tp-navy);

  font-family: "Cormorant Garamond", Georgia, serif;

  font-size: 1.5rem;
  font-weight: 500;
}


.tp-who-item p {
  margin: 0;

  color: var(--tp-gray);

  font-size: 0.86rem;
  line-height: 1.68;
}


.tp-who-note {
  display: flex;

  gap: 0.9rem;

  margin-top: 1.8rem;
}


.tp-who-note-line {
  flex: 0 0 40px;

  height: 1px;
  margin-top: 0.65rem;

  background: var(--tp-red);
}


.tp-who-note p {
  margin: 0;

  color: #818990;

  font-size: 0.72rem;
  line-height: 1.55;
}


/* ==========================================================
   11. INDEPENDENT BY DESIGN
========================================================== */

.tp-independent {
  position: relative;

  padding: clamp(5rem, 7vw, 7.5rem) 0;

  background:
    linear-gradient(
      140deg,
      var(--tp-navy-deep),
      #132c47
    );

  color: var(--tp-white);
}


.tp-independent::after {
  content: "";

  position: absolute;
  right: -150px;
  bottom: -150px;

  width: 420px;
  height: 420px;

  border: 1px solid rgba(255, 255, 255, 0.045);
  border-radius: 50%;

  pointer-events: none;
}


.tp-independent .container {
  position: relative;
  z-index: 2;
}


.tp-independent .tp-section-title {
  color: var(--tp-white);
}


.tp-independent .tp-section-lead {
  color: rgba(255, 255, 255, 0.77);
}


.tp-independent .tp-section-text {
  color: rgba(255, 255, 255, 0.53);
}


.tp-independent-principles {
  display: grid;
  grid-template-columns: repeat(4, 1fr);

  margin-top: 3.25rem;

  border-top: 1px solid rgba(255, 255, 255, 0.13);
  border-bottom: 1px solid rgba(255, 255, 255, 0.13);
}


.tp-independent-principle {
  min-height: 150px;

  padding: 1.65rem;

  border-right: 1px solid rgba(255, 255, 255, 0.13);
}


.tp-independent-principle:last-child {
  border-right: 0;
}


.tp-independent-principle > span {
  display: block;

  margin-bottom: 1.5rem;

  color: var(--tp-red);

  font-size: 0.67rem;
  font-weight: 700;
}


.tp-independent-principle p {
  margin: 0;

  color: rgba(255, 255, 255, 0.62);

  font-size: 0.82rem;
  line-height: 1.55;
}


.tp-independent-principle strong {
  display: block;

  margin-top: 0.15rem;

  color: var(--tp-white);

  font-weight: 600;
}


.tp-independent-note {
  display: flex;

  gap: 0.9rem;

  max-width: 850px;

  margin-top: 2rem;
}


.tp-independent-note-line {
  flex: 0 0 40px;

  height: 1px;
  margin-top: 0.65rem;

  background: var(--tp-red);
}


.tp-independent-note p {
  margin: 0;

  color: rgba(255, 255, 255, 0.44);

  font-size: 0.71rem;
  line-height: 1.6;
}


/* ==========================================================
   12. APPLICATION
========================================================== */

.tp-application {
  padding: clamp(5rem, 7vw, 7.5rem) 0;

  background:
    linear-gradient(
      135deg,
      #f7f6f2,
      #eeece6
    );
}


.tp-application-intro {
  position: sticky;
  top: 120px;
}


.tp-application-note {
  display: flex;

  gap: 0.9rem;

  margin-top: 1.8rem;
}


.tp-application-note-line {
  flex: 0 0 40px;

  height: 1px;
  margin-top: 0.65rem;

  background: var(--tp-red);
}


.tp-application-note p {
  margin: 0;

  color: #818990;

  font-size: 0.72rem;
  line-height: 1.55;
}


.tp-application-form-wrap {
  position: relative;

  padding: clamp(1.75rem, 3.5vw, 2.75rem);

  border: 1px solid var(--tp-border);
  border-radius: 6px;

  background: var(--tp-white);

  box-shadow: var(--tp-shadow-soft);
}


.tp-application-form-wrap::before {
  content: "";

  position: absolute;
  top: 0;
  left: 0;

  width: 4px;
  height: 100%;

  background: var(--tp-red);

  border-radius: 6px 0 0 6px;
}


.tp-form-label {
  margin-bottom: 0.45rem;

  color: var(--tp-navy);

  font-size: 0.68rem;
  font-weight: 700;

  letter-spacing: 0.045em;
  text-transform: uppercase;
}


.tp-form-control {
  min-height: 48px;

  padding: 0.72rem 0.85rem;

  border: 1px solid #d9dee2;
  border-radius: 3px;

  background: #fbfbfa;

  color: var(--tp-charcoal);

  font-size: 0.88rem;

  box-shadow: none !important;

  transition:
    border-color 0.2s ease,
    background 0.2s ease;
}


textarea.tp-form-control {
  min-height: auto;

  resize: vertical;
}


.tp-form-control:focus {
  border-color: var(--tp-red);

  background: var(--tp-white);
}


.tp-form-check {
  padding-top: 0.35rem;
}


.tp-form-check .form-check-input {
  border-radius: 2px;
}


.tp-form-check .form-check-input:checked {
  background-color: var(--tp-red);
  border-color: var(--tp-red);
}


.tp-form-check .form-check-label {
  color: var(--tp-gray);

  font-size: 0.8rem;
  line-height: 1.6;
}


.tp-recaptcha {
  padding-top: 0.2rem;

  overflow-x: auto;
}


.tp-application-submit {
  min-width: 190px;
}


.tp-honeypot {
  position: absolute !important;

  left: -9999px !important;

  width: 1px !important;
  height: 1px !important;

  overflow: hidden !important;
}


/* ==========================================================
   13. FINAL CTA
========================================================== */

.tp-final-cta {
  position: relative;

  padding: clamp(5rem, 8vw, 8rem) 0;

  background: var(--tp-white);
}


.tp-final-cta::before {
  content: "";

  position: absolute;
  top: 0;
  left: 50%;

  width: 62px;
  height: 3px;

  background: var(--tp-red);

  transform: translateX(-50%);
}


.tp-final-cta-wrap {
  max-width: 850px;

  margin: 0 auto;

  text-align: center;
}


.tp-final-cta-title {
  margin: 0 0 1.35rem;

  color: var(--tp-navy);

  font-family: "Cormorant Garamond", Georgia, serif;

  font-size: clamp(3rem, 5.3vw, 5.25rem);
  font-weight: 500;

  line-height: 0.95;
  letter-spacing: -0.035em;
}


.tp-final-cta-title span {
  display: block;

  color: var(--tp-red);
}


.tp-final-cta-text {
  max-width: 620px;

  margin: 0 auto 1.9rem;

  color: var(--tp-gray);

  font-size: 1rem;
  line-height: 1.75;
}


.tp-final-cta-actions {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;

  gap: 1.4rem;
}


.tp-final-cta-note {
  display: flex;
  justify-content: center;
  align-items: center;

  gap: 0.9rem;

  margin-top: 2.15rem;
}


.tp-final-cta-line {
  width: 38px;
  height: 1px;

  background: var(--tp-red);
}


.tp-final-cta-note p {
  margin: 0;

  color: #818990;

  font-size: 0.68rem;

  letter-spacing: 0.06em;
  text-transform: uppercase;
}


/* ==========================================================
   14. APPLICATION THANK YOU
========================================================== */

.tp-thank-you {
  position: relative;

  min-height: 70vh;

  display: flex;
  align-items: center;

  padding: clamp(5rem, 8vw, 8rem) 0;

  background:
    linear-gradient(
      135deg,
      #ffffff,
      #f2efe9
    );
}


.tp-thank-you::before {
  content: "";

  position: absolute;
  top: 0;
  left: 0;

  width: 4px;
  height: 100%;

  background: var(--tp-red);
}


.tp-thank-you-wrap {
  max-width: 780px;

  margin: 0 auto;

  text-align: center;
}


.tp-thank-you-title {
  margin: 0 0 1.35rem;

  color: var(--tp-navy);

  font-family: "Cormorant Garamond", Georgia, serif;

  font-size: clamp(3.1rem, 5.5vw, 5.3rem);
  font-weight: 500;

  line-height: 0.95;
  letter-spacing: -0.035em;
}


.tp-thank-you-title span {
  display: block;

  color: var(--tp-red);
}


.tp-thank-you-lead {
  max-width: 650px;

  margin: 0 auto 2rem;

  color: #4a5660;

  font-size: 1.02rem;
  line-height: 1.8;
}


.tp-thank-you-reference {
  max-width: 450px;

  margin: 0 auto 2.25rem;

  padding: 1.4rem 1.7rem;

  border-radius: 4px;

  background: var(--tp-navy);

  box-shadow: var(--tp-shadow-soft);
}


.tp-thank-you-reference span {
  display: block;

  margin-bottom: 0.45rem;

  color: var(--tp-platinum);

  font-size: 0.65rem;
  font-weight: 700;

  letter-spacing: 0.13em;
  text-transform: uppercase;
}


.tp-thank-you-reference strong {
  display: block;

  color: var(--tp-white);

  font-size: 1.1rem;
  font-weight: 600;

  letter-spacing: 0.08em;
}


.tp-thank-you-content {
  max-width: 620px;

  margin: 0 auto;
}


.tp-thank-you-content p {
  margin-bottom: 0.85rem;

  color: var(--tp-gray);

  font-size: 0.91rem;
  line-height: 1.75;
}


.tp-thank-you-notice {
  display: flex;
  justify-content: center;
  align-items: flex-start;

  gap: 0.9rem;

  max-width: 630px;

  margin: 2rem auto 0;
}


.tp-thank-you-line {
  flex: 0 0 40px;

  height: 1px;
  margin-top: 0.65rem;

  background: var(--tp-red);
}


.tp-thank-you-notice p {
  margin: 0;

  color: #818990;

  font-size: 0.72rem;
  line-height: 1.55;

  text-align: left;
}


.tp-thank-you-actions {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;

  gap: 1.4rem;

  margin-top: 2.4rem;
}


/* ==========================================================
   15. TABLET
========================================================== */

@media (max-width: 1199.98px) {

  .tp-independent-principles {
    grid-template-columns: repeat(2, 1fr);
  }


  .tp-independent-principle:nth-child(2) {
    border-right: 0;
  }


  .tp-independent-principle:nth-child(-n + 2) {
    border-bottom: 1px solid rgba(255, 255, 255, 0.13);
  }

}


/* ==========================================================
   16. SMALL TABLET
========================================================== */

@media (max-width: 991.98px) {

  .tp-training-intro,
  .tp-who-intro,
  .tp-application-intro {
    position: static;
  }


  .tp-hero-visual {
    max-width: 620px;

    margin: 1.5rem auto 0;
  }


  .tp-hero-visual-label {
    left: 18px;
  }


  .tp-how-steps {
    grid-template-columns: repeat(2, 1fr);
  }

}


/* ==========================================================
   17. MOBILE
========================================================== */

@media (max-width: 767.98px) {

  .tp-hero {
    padding: 4rem 0;
  }


  .tp-hero-title {
    font-size: clamp(3rem, 13vw, 4.4rem);
  }


  .tp-hero-actions {
    flex-direction: column;
    align-items: flex-start;
  }


  .tp-hero-note {
    align-items: flex-start;
  }


  .tp-hero-visual-label {
    position: static;

    justify-content: center;

    margin-top: 0;

    border-radius: 0 0 4px 4px;
  }


  .tp-intro-panel-points {
    grid-template-columns: 1fr;
  }


  .tp-how-steps {
    grid-template-columns: 1fr;
  }


  .tp-how-step {
    min-height: auto;
  }


  .tp-how-summary {
    display: none;
  }


  .tp-independent-principles {
    grid-template-columns: 1fr;
  }


  .tp-independent-principle {
    min-height: auto;

    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.13);
  }


  .tp-independent-principle:last-child {
    border-bottom: 0;
  }


  .tp-application-form-wrap {
    padding: 1.4rem;
  }


  .tp-final-cta-actions,
  .tp-thank-you-actions {
    flex-direction: column;
  }


  .tp-final-cta-note {
    align-items: flex-start;
  }

}


/* ==========================================================
   18. SMALL MOBILE
========================================================== */

@media (max-width: 479.98px) {

  .travel-professionals-page .tp-section-title {
    font-size: 2.6rem;
  }


  .tp-hero-title {
    font-size: 3.15rem;
  }


  .tp-training-item,
  .tp-who-item {
    grid-template-columns: 40px 1fr;

    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }


  .tp-final-cta-title,
  .tp-thank-you-title {
    font-size: 3rem;
  }


  .tp-recaptcha {
    transform-origin: left top;
  }

}


/* ==========================================================
   19. REDUCED MOTION
========================================================== */

@media (prefers-reduced-motion: reduce) {

  .travel-professionals-page *,
  .travel-professionals-page *::before,
  .travel-professionals-page *::after {
    transition: none !important;
    scroll-behavior: auto !important;
  }

}