/* ============================================================
   JAPAN TALENT MATCHING — PARTNERSHIP PAGE (Enterprise)
   ------------------------------------------------------------
   • Professional recruiter partnership page
   • Blue–gray enterprise tone
   • Calm, readable, no decorative effects
   • Safe overrides only
============================================================= */

/* -------------------------
   Design Tokens
------------------------- */
:root {
  --jt-ink: #0b1320;
  --jt-ink-soft: #1f2a3a;
  --jt-muted: #6b7280;

  --jt-primary: #2563eb;
  --jt-primary-soft: rgba(37,99,235,0.12);

  --jt-border: rgba(15,23,42,0.08);
  --jt-bg-soft: #f8fafc;

  --jt-radius: 14px;
}

/* -------------------------
   Page Base
------------------------- */
body.page-template-partnership {
  background: #ffffff;
  color: var(--jt-ink);
  font-family: "Inter","Poppins",system-ui,sans-serif;
}

/* ============================================================
   HERO
============================================================= */
.jt-hero {
  position: relative;
  min-height: 60vh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.jt-hero-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  filter: grayscale(100%) contrast(1.05);
}

.jt-hero-overlay {
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,0.92);
}

.jt-hero h1 {
  font-size: clamp(2rem, 4vw, 2.6rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--jt-ink);
}

.jt-hero p {
  font-size: 1.05rem;
  color: var(--jt-muted);
  line-height: 1.65;
}

/* ============================================================
   BUTTONS
============================================================= */
.jt-btn-primary,
.jt-btn-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  border-radius: 999px;
  padding: 0.75rem 1.7rem;
  font-size: 0.95rem;
  transition: all 0.2s ease;
  text-decoration: none;
}

.jt-btn-primary {
  background: var(--jt-primary);
  color: #ffffff;
}

.jt-btn-primary:hover {
  background: #1e4fd6;
}

.jt-btn-ghost {
  border: 1px solid var(--jt-border);
  color: var(--jt-ink-soft);
  background: #ffffff;
}

.jt-btn-ghost:hover {
  border-color: var(--jt-primary);
  color: var(--jt-primary);
}

/* ============================================================
   SECTIONS
============================================================= */
.jt-section {
  background: transparent;
}

.jt-section-alt {
  background: var(--jt-bg-soft);
  border: 1px solid var(--jt-border);
}

/* Headings */
.jt-heading {
  font-size: 1.8rem;
  font-weight: 700;
  color: var(--jt-ink);
  margin-bottom: 0.35rem;
}

.jt-sub {
  font-size: 1rem;
  color: var(--jt-muted);
  line-height: 1.6;
}

/* ============================================================
   CARDS
============================================================= */
.jt-card {
  background: #ffffff;
  border: 1px solid var(--jt-border);
  border-radius: var(--jt-radius);
  padding: 1.5rem 1.4rem;
}

.jt-card h3 {
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--jt-ink);
  margin-bottom: 0.35rem;
}

.jt-card p {
  color: var(--jt-muted);
  font-size: 0.95rem;
  line-height: 1.55;
}

/* ============================================================
   PILL LIST
============================================================= */
.jt-pill {
  background: #ffffff;
  border: 1px solid var(--jt-border);
  border-radius: var(--jt-radius);
  padding: 0.9rem 1.2rem;
  font-weight: 500;
  color: var(--jt-ink-soft);
}

/* ============================================================
   CTA
============================================================= */
.jt-cta-box {
  background: var(--jt-bg-soft);
  border: 1px solid var(--jt-border);
  border-radius: var(--jt-radius);
  padding: 2rem 2.4rem;
}

.jt-cta-box h3 {
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--jt-ink);
  margin-bottom: 0.4rem;
}

.jt-cta-box p {
  color: var(--jt-muted);
  font-size: 0.95rem;
  line-height: 1.6;
}

/* ============================================================
   FORM
============================================================= */
.jt-form {
  background: #ffffff;
  border: 1px solid var(--jt-border);
  border-radius: var(--jt-radius);
  padding: 2rem 2.2rem 2.6rem;
}

.jt-form label {
  font-weight: 600;
  font-size: 0.9rem;
  color: var(--jt-ink);
  display: block;
  margin-bottom: 0.35rem;
}

.jt-form input,
.jt-form select,
.jt-form textarea {
  width: 100%;
  border: 1px solid #d1d5db;
  border-radius: 10px;
  background: #ffffff;
  color: var(--jt-ink);
  font-size: 0.95rem;
  padding: 0.75rem 0.95rem;
  transition: border-color .2s ease, box-shadow .2s ease;
}

.jt-form input:focus,
.jt-form select:focus,
.jt-form textarea:focus {
  outline: none;
  border-color: var(--jt-primary);
  box-shadow: 0 0 0 2px var(--jt-primary-soft);
}

/* Consent checkbox */
.jt-form label.flex.items-start.gap-2 {
  align-items: center;
  gap: 0.6rem;
  line-height: 1.6;
}

.jt-form input[type="checkbox"] {
  width: 18px;
  height: 18px;
  accent-color: var(--jt-primary);
}

/* ============================================================
   RESPONSIVE
============================================================= */
@media (max-width: 768px) {
  .jt-hero {
    min-height: 52vh;
    padding: 4rem 1rem;
  }

  .jt-form {
    padding: 1.5rem;
  }

  .jt-card,
  .jt-pill {
    padding: 1.2rem;
  }

  .jt-cta-box {
    padding: 1.6rem;
  }
}
/* ============================================================
   PARTNERSHIP HERO — RESTORE SOFT SHINE (BACKGROUND ONLY)
   ------------------------------------------------------------
   • Keeps new enterprise typography
   • Restores bright / airy hero background
   • No aqua, no gradients, no glow
============================================================= */

/* Hero base */
.jt-hero {
  min-height: 65vh;
  background: none;
}

/* Background image: bright, soft, professional */
.jt-hero-bg {
  filter: brightness(1.08) saturate(105%) blur(0px);
  transform: scale(1.05);
}

/* Soft white shine overlay (editorial style) */
.jt-hero-overlay {
  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,0.70) 0%,
      rgba(255,255,255,0.88) 55%,
      rgba(255,255,255,0.96) 100%
    );
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

/* Hero text clarity on bright background */
.jt-hero h1 {
  color: #0b1320;
}

.jt-hero p {
  color: #475569;
}

/* Buttons remain enterprise (no visual regression) */
.jt-hero .jt-btn-primary {
  background: #2563eb;
}

.jt-hero .jt-btn-primary:hover {
  background: #1e4fd6;
}

.jt-hero .jt-btn-ghost {
  background: rgba(255,255,255,0.85);
}
/* ============================================================
   WHY PARTNER WITH US — ENTERPRISE NORMALIZATION
   ------------------------------------------------------------
   • Remove blue pill styling
   • Match size & tone with "Others" card
   • Calm, neutral, recruiter-grade
============================================================= */

/* Section spacing consistency */
#why-us {
  margin-top: 3rem;
}

/* Pills → card-like neutral blocks */
.jt-pill {
  background: #ffffff;                 /* remove blue */
  border: 1px solid rgba(15,23,42,0.08);
  border-radius: 14px;
  padding: 1rem 1.25rem;
  font-size: 0.95rem;
  font-weight: 500;
  color: #1f2a3a;
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

/* Remove any inherited color / glow */
.jt-pill,
.jt-pill * {
  background-image: none !important;
  box-shadow: none !important;
  color: inherit;
}

/* Check icon tone (keep subtle, not loud) */
.jt-pill::before {
  content: "✔";
  font-size: 0.85rem;
  color: #2563eb; /* subtle brand blue, not background */
  margin-right: 0.35rem;
}

/* Ensure equal height & rhythm */
#why-us ul {
  align-items: stretch;
}

#why-us li {
  min-height: 56px; /* visually matches “Others” card */
}

/* Mobile tightening */
@media (max-width: 768px) {
  .jt-pill {
    padding: 0.9rem 1.1rem;
    font-size: 0.9rem;
  }
}
/* ============================================================
   FINAL OVERRIDE — CONSENT CHECKBOX ALIGNMENT (HARD FIX)
   ------------------------------------------------------------
   • Forces correct flex behavior
   • Neutralizes conflicting label rules
   • Pixel-aligned checkbox + text
============================================================= */

/* Force consent label to behave correctly */
.jt-form label.flex.items-start.gap-2 {
  display: flex !important;
  align-items: flex-start !important;
  gap: 0.6rem !important;
  line-height: 1.6;
  margin-top: 0.75rem;
}

/* Kill generic label block behavior */
.jt-form label.flex.items-start.gap-2 {
  margin-bottom: 0 !important;
}

/* Checkbox alignment — THIS is the key */
.jt-form label.flex.items-start.gap-2 input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin: 0;
  margin-top: 0.22rem; /* aligns checkbox with first text line */
  flex-shrink: 0;
  accent-color: #2563eb;
  cursor: pointer;
}

/* Text block */
.jt-form label.flex.items-start.gap-2 span {
  display: block;
  font-size: 0.9rem;
  color: #1f2a3a;
}

/* Links inside consent */
.jt-form label.flex.items-start.gap-2 a {
  color: #2563eb;
  text-decoration: underline;
}

.jt-form label.flex.items-start.gap-2 a:hover {
  text-decoration: none;
}

/* Mobile safety */
@media (max-width: 768px) {
  .jt-form label.flex.items-start.gap-2 input[type="checkbox"] {
    margin-top: 0.28rem;
  }
}
