@charset "UTF-8";
/*-----------------------------------------------------------------------------------

    PlusTalent Brand Override
    Applied AFTER main.css to override Bixoo template tokens with PlusTalent identity.

    Design concept: "Kien Tao Nhan Luc" (Workforce Architecture)
    Brand: Warm earth tones — chocolate brown, caramel, cream
    Tone: Strategic, sharp — C-level peer conversation

    TABLE OF CONTENTS
    -------------------------------------------------------------------------------

    01. Google Fonts Import
    02. CSS Variables Override
    03. Base / Body / Typography
    04. Buttons (.theme-btn)
    05. Sub-title (line + uppercase, NOT pill/badge)
    06. Section Backgrounds
    07. Header & Sticky Navigation
    08. Hero Section
    09. Cards & Hover Effects
    10. Service / Solution Boxes
    11. Counter / Stats
    12. Testimonials
    13. Pricing
    14. News / Knowledge Cards
    15. Team / Expert Cards
    16. CTA Sections
    17. Footer
    18. Breadcrumb / Page Header
    19. Preloader
    20. Forms & Inputs
    21. Scrollbar
    22. Text Selection
    23. Offcanvas / Mobile Menu
    24. Miscellaneous Utilities
    25. Responsive Overrides

-----------------------------------------------------------------------------------*/

/* ==========================================================================
   01. Google Fonts Import
   ========================================================================== */

@import url("https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,600;1,700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400&display=swap");


/* ==========================================================================
   02. CSS Variables Override
   ========================================================================== */

:root {
  /* Override Bixoo template variables */
  --body: #FDF8F2;
  --black: #000;
  --white: #fff;
  --theme: #B5651D;
  --header: #3D2415;
  --text: #2C3E50;
  --text-2: #8B8178;
  --border: #E8DDD0;
  --bg: #F5E6D0;
  --bg-2: #FDF8F2;
  --bg-3: #3D2415;
  --box-shadow: 0px 2px 16px 0px rgba(61, 36, 21, 0.08);

  /* PlusTalent custom design tokens */
  --pt-primary: #B5651D;
  --pt-primary-dark: #3D2415;
  --pt-primary-hover: #9A5318;
  --pt-accent: #D4911A;
  --pt-secondary: #1B6B52;
  --pt-cream: #F5E6D0;
  --pt-warm-white: #FDF8F2;
  --pt-charcoal: #2C3E50;
  --pt-warm-gray: #8B8178;
  --pt-success: #1B6B52;
  --pt-error: #C0392B;

  /* Layout tokens */
  --pt-bdr-radius: 8px;
  --pt-bdr-radius-lg: 12px;
  --pt-container: 1200px;
  --pt-section-padding: 80px;
  --pt-section-padding-mobile: 48px;

  /* Font stacks */
  --pt-font-display: 'Lora', serif;
  --pt-font-heading: 'Plus Jakarta Sans', sans-serif;
  --pt-font-body: 'Inter', 'Be Vietnam Pro', sans-serif;
}


/* ==========================================================================
   03. Base / Body / Typography
   ========================================================================== */

/* Body — warm white background, NOT pure white */
body {
  font-family: 'Inter', 'Be Vietnam Pro', sans-serif;
  color: var(--pt-charcoal);
  background-color: var(--pt-warm-white);
}

/* Headings — override Mona Sans with PlusTalent font stack */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: var(--pt-primary-dark);
}

/* H1 — display/serif font for hero & page titles */
h1 {
  font-family: 'Lora', serif;
  font-weight: 700;
  color: var(--pt-primary-dark);
}

/* H2 — section titles */
h2 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 600;
  color: var(--pt-primary-dark);
}

/* H3 — card titles, sub-sections */
h3 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 600;
  color: var(--pt-primary-dark);
}

/* H4 — smaller headings */
h4 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 600;
  color: var(--pt-primary-dark);
}

/* H5, H6 */
h5,
h6 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: var(--pt-primary-dark);
}

/* Paragraph text */
p {
  color: var(--pt-charcoal);
}

/* Links */
a {
  color: var(--pt-primary-dark);
}

a:hover {
  color: var(--pt-primary);
}

/* Small / caption text */
small,
.small {
  color: var(--pt-warm-gray);
}


/* ==========================================================================
   04. Buttons (.theme-btn)
   ========================================================================== */

/* Main theme button — caramel brown, rounded rectangle (NOT pill) */
.theme-btn {
  background-color: var(--pt-primary);
  border-radius: var(--pt-bdr-radius) !important;
  font-family: 'Plus Jakarta Sans', sans-serif;
  transition: all 300ms ease;
}

.theme-btn:hover {
  background-color: var(--pt-primary-hover);
}

/* Button text */
.theme-btn .btn-title {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 600;
  color: var(--white);
}

/* Arrow circles — chocolate brown background */
.theme-btn .btn-arrow-right {
  background: var(--pt-primary-dark);
  color: var(--white);
  border-radius: 6px;
}

.theme-btn .btn-arrow-left {
  background-color: var(--pt-primary-dark);
  color: var(--white);
  border-radius: 6px;
}

/* White-style button variant */
.theme-btn.bg-white-style {
  background-color: var(--white);
  color: var(--pt-primary);
  border-radius: var(--pt-bdr-radius) !important;
}

.theme-btn.bg-white-style .btn-arrow-right,
.theme-btn.bg-white-style .btn-arrow-left {
  background-color: var(--pt-primary);
  color: var(--white);
}

.theme-btn.bg-white-style .btn-title {
  color: var(--pt-primary);
}

.theme-btn.bg-white-style:hover {
  background-color: var(--pt-primary);
}

.theme-btn.bg-white-style:hover .btn-title {
  color: var(--white);
}

.theme-btn.bg-white-style:hover .btn-arrow-right,
.theme-btn.bg-white-style:hover .btn-arrow-left {
  background-color: var(--white);
  color: var(--pt-primary);
}

/* Link button */
.link-btn {
  color: var(--pt-primary);
  font-family: 'Plus Jakarta Sans', sans-serif;
}

.link-btn:hover {
  color: var(--pt-primary-dark);
}


/* ==========================================================================
   05. Sub-title (line + uppercase, NOT pill/badge)
   IMPORTANT: Override template SVG image style with horizontal line
   ========================================================================== */

/* Hide the SVG icon that Bixoo uses for sub-titles */
.section-title .sub-title img {
  display: none !important;
}

/* Sub-title: horizontal line + uppercase text */
.section-title .sub-title {
  font-size: 12px;
  font-weight: 500;
  color: var(--pt-warm-gray);
  font-family: 'Inter', 'Be Vietnam Pro', sans-serif;
  text-transform: uppercase;
  letter-spacing: 2px;
  margin-bottom: 15px;
  display: flex;
  align-items: center;
  gap: 12px;
}

/* Horizontal line before sub-title text */
.section-title .sub-title::before {
  content: '';
  display: inline-block;
  width: 30px;
  height: 2px;
  background-color: var(--pt-primary);
  flex-shrink: 0;
}

/* Centered sub-title — line on both sides */
.section-title .sub-title.justify-content-center::before {
  content: '';
  display: inline-block;
  width: 30px;
  height: 2px;
  background-color: var(--pt-primary);
}

.section-title .sub-title.justify-content-center::after {
  content: '';
  display: inline-block;
  width: 30px;
  height: 2px;
  background-color: var(--pt-primary);
  flex-shrink: 0;
}

/* Section title H2 — use Plus Jakarta Sans */
.section-title h2 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: var(--pt-primary-dark);
}


/* ==========================================================================
   06. Section Backgrounds
   ========================================================================== */

/* Cream section background */
.section-bg {
  background-color: var(--pt-cream) !important;
}

/* Warm white alternate background */
.section-bg-2,
.body-bg-1 {
  background-color: var(--pt-warm-white) !important;
}

/* Dark section background — chocolate brown */
.section-bg-3 {
  background-color: var(--pt-primary-dark) !important;
}

/* Theme color background */
.theme-bg {
  background-color: var(--pt-primary) !important;
}

/* Section padding — slightly reduced for PlusTalent */
.section-padding {
  padding: var(--pt-section-padding) 0;
}

@media (max-width: 991px) {
  .section-padding {
    padding: var(--pt-section-padding-mobile) 0;
  }
}


/* ==========================================================================
   07. Header & Sticky Navigation
   ========================================================================== */

/* Header-1 — transparent overlay with PlusTalent warm tone */
.header-1 {
  background: rgba(61, 36, 21, 0.15);
  border: 1px solid rgba(245, 230, 208, 0.2);
  backdrop-filter: blur(29px);
}

/* Header right side CTA button */
.header-1 .header-right .theme-btn {
  font-family: 'Plus Jakarta Sans', sans-serif;
  border-radius: var(--pt-bdr-radius) !important;
}

.header-1 .header-right .theme-btn:hover {
  background-color: var(--pt-primary);
  border-color: var(--pt-primary);
}

/* Search toggler */
.header-1 .header-right .search-toggler:hover {
  background-color: var(--pt-primary);
}

/* Main menu links */
.header-main .main-menu ul li a {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 600;
}

/* Menu link hover — caramel accent */
.header-main .main-menu ul li a:hover {
  color: var(--pt-accent) !important;
}

/* Submenu — warm white background */
.header-main .main-menu ul li .submenu {
  background: var(--white);
  border: 1px solid var(--pt-cream);
  border-radius: var(--pt-bdr-radius);
  box-shadow: 0 8px 30px rgba(61, 36, 21, 0.1);
}

/* Submenu link */
.header-main .main-menu ul li .submenu li a {
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: var(--pt-charcoal);
}

/* Submenu link hover */
.header-main .main-menu ul li .submenu li a:hover,
.header-main .main-menu ul li .submenu li:hover > a {
  color: var(--pt-primary) !important;
}

/* Submenu link ::before (accent indicator) */
.header-main .main-menu ul li .submenu li a::before {
  background-color: var(--pt-primary);
}

/* Sticky header — chocolate brown */
.sticky {
  background: var(--pt-primary-dark) !important;
  box-shadow: 0 4px 20px rgba(61, 36, 21, 0.15);
}

.sticky.header-2 {
  background: var(--pt-primary-dark) !important;
}


/* ==========================================================================
   08. Hero Section
   ========================================================================== */

/* Hero background overlay — warm brown gradient instead of cold teal */
.hero-1 .hero-bg::before {
  background: linear-gradient(
    266.83deg,
    rgba(61, 36, 21, 0.01) 2.32%,
    rgba(61, 36, 21, 0.75) 98.31%
  );
}

/* Hero heading — serif font for gravitas */
.hero-1 .hero-content h1 {
  font-family: 'Lora', serif;
  font-weight: 700;
  color: var(--white);
}

/* Hero heading light weight span */
.hero-1 .hero-content h1 span {
  font-weight: 400;
}

/* Hero heading bold variant — cream tint */
.hero-1 .hero-content h1 b {
  color: var(--pt-cream);
}

/* Hero paragraph */
.hero-1 .hero-content p {
  color: rgba(255, 255, 255, 0.85);
  font-family: 'Inter', 'Be Vietnam Pro', sans-serif;
}

/* Hero navigation arrows */
.hero-1 .array-button .array-prev,
.hero-1 .array-button .array-next {
  border-color: rgba(245, 230, 208, 0.4);
  color: var(--pt-cream);
}

.hero-1 .array-button .array-prev:hover,
.hero-1 .array-button .array-next:hover {
  background-color: var(--pt-primary);
  border-color: var(--pt-primary);
}

/* Hero social icon line */
.hero-1 .social-icon .line {
  background: var(--pt-cream);
}


/* ==========================================================================
   09. Cards & Hover Effects (global card interaction pattern)
   ========================================================================== */

/*
   PlusTalent card hover effect:
   - translateY(-4px)
   - Increased box-shadow
   - Left border accent (4px solid caramel)
   - 0.3s transition
*/

/* News box items hover */
.news-box-items-style-2,
.service-box-items-style-2,
.team-box-items-style-4,
.pricing-box-items,
.testimonial-box-items-style-1,
.news-card-items-4 {
  transition: all 0.3s ease;
  border-radius: var(--pt-bdr-radius-lg);
}

.news-box-items-style-2:hover,
.team-box-items-style-4:hover,
.testimonial-box-items-style-1:hover,
.news-card-items-4:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(61, 36, 21, 0.12);
  border-left: 4px solid var(--pt-primary);
}

/* Generic card hover for content wrappers */
[class*="box-items"]:not(.service-box-items):not(.counter-feature-box-items-style-2) {
  transition: all 0.3s ease;
}


/* ==========================================================================
   10. Service / Solution Boxes
   ========================================================================== */

/* Service box items style 1 — override dark teal with chocolate brown */
.service-box-items {
  background-color: var(--pt-primary-dark);
  border-radius: var(--pt-bdr-radius-lg);
}

/* Service box number — stroke color override */
.service-box-items .content .icon-area .number {
  -webkit-text-stroke-color: rgba(245, 230, 208, 0.5);
  font-family: 'Plus Jakarta Sans', sans-serif;
}

/* Service box title link hover */
.service-box-items .content .title a:hover {
  color: var(--pt-accent);
  background-image: linear-gradient(180deg, var(--pt-accent) 0%, var(--pt-accent) 100%);
}

/* Service box items style 2 — warm border */
.service-box-items-style-2 {
  background: rgba(61, 36, 21, 0.04);
  border: 1px solid rgba(181, 101, 29, 0.15);
  border-radius: var(--pt-bdr-radius-lg);
}

.service-box-items-style-2:hover {
  border-color: var(--pt-primary);
  background: rgba(61, 36, 21, 0.06);
}

/* Service content heading links */
.service-box-items-style-2 .service-content h3 a,
.service-box-items-style-2 .service-content h2 a {
  color: var(--pt-primary-dark);
}

.service-box-items-style-2 .service-content h3 a:hover,
.service-box-items-style-2 .service-content h2 a:hover {
  color: var(--pt-primary);
  background-image: linear-gradient(180deg, var(--pt-primary) 0%, var(--pt-primary) 100%);
}

/* Service content text — override white to charcoal for light backgrounds */
.service-box-items-style-2 .service-content p {
  color: var(--pt-charcoal);
}

/* Service sub-titles — override for warm scheme */
.service-box-items-style-2 .service-content .sub-titles {
  color: var(--pt-primary-dark);
  border-top-color: var(--border);
  font-family: 'Plus Jakarta Sans', sans-serif;
}


/* ==========================================================================
   11. Counter / Stats
   ========================================================================== */

/* Counter items — warm brand colors */
.counter-items-style-1 h2 {
  color: var(--pt-primary-dark);
  font-family: 'Plus Jakarta Sans', sans-serif;
}

.counter-items-style-1 h2 .count,
.counter-items-style-1 h2 .pt-count {
  color: var(--pt-primary);
}

/* Counter feature wrapper — chocolate brown background */
.counter-feature-wrapper {
  background-color: var(--pt-cream);
  border-radius: var(--pt-bdr-radius-lg);
}

.counter-feature-wrapper .counter-feature-1 h2 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: var(--pt-primary-dark);
}

.counter-feature-wrapper .counter-feature-2 .content h3 {
  color: var(--pt-primary-dark);
}

.counter-feature-wrapper .counter-feature-2 .content .line {
  background-color: var(--pt-primary);
}

/* Counter box style 2 */
.counter-feature-box-items-style-2 {
  border-color: var(--border);
}

.counter-feature-box-items-style-2 h2 {
  color: var(--pt-primary);
  font-family: 'Plus Jakarta Sans', sans-serif;
}

.counter-feature-box-items-style-2 .line {
  background-color: var(--pt-primary);
}

.counter-feature-box-items-style-2.active {
  border-color: var(--pt-primary);
}

/* Counter style 3 */
.counter-box-items-style-3 h2 {
  color: var(--pt-primary);
  font-family: 'Plus Jakarta Sans', sans-serif;
}

.counter-box-items-style-3 .line {
  background-color: var(--pt-cream);
}

.counter-box-items-style-3 .line::before {
  background-color: var(--pt-primary);
}

/* Counter icon wrapper */
.counter-icon-wrapper .counter-icon-items .icon {
  background-color: var(--pt-cream);
}

/* About section counter boxes */
.about-left-content-style-2 .counter-box-area .counter-box h2 {
  color: var(--pt-primary);
  font-family: 'Plus Jakarta Sans', sans-serif;
}

.about-left-content-style-2 .counter-box-area .line {
  background-color: var(--border);
}


/* ==========================================================================
   12. Testimonials
   ========================================================================== */

/* Testimonial section background shape */
.testimonial-section {
  background-color: var(--pt-warm-white);
}

/* Testimonial box style 1 */
.testimonial-box-items-style-1 {
  border-radius: var(--pt-bdr-radius-lg);
}

.testimonial-box-items-style-1 .testimonial-content .testi-top-area .testi-point {
  color: var(--pt-primary);
}

.testimonial-box-items-style-1 .testimonial-content .testi-top-area .star {
  color: var(--pt-accent);
}

.testimonial-box-items-style-1 .testimonial-content h3 {
  font-family: 'Lora', serif;
  color: var(--pt-primary-dark);
  font-style: italic;
}

.testimonial-box-items-style-1 .testimonial-content .testi-text {
  color: var(--pt-charcoal);
  font-family: 'Inter', 'Be Vietnam Pro', sans-serif;
}

.testimonial-box-items-style-1 .client-info .client-content .name {
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: var(--pt-primary-dark);
}

/* Testimonial style 2 */
.testimonial-content-style-2 .line {
  background-color: var(--pt-primary);
}

.testimonial-content-style-2 .testimonial-box-items-2 h3 {
  font-family: 'Lora', serif;
  color: var(--pt-primary-dark);
}


/* ==========================================================================
   13. Pricing
   ========================================================================== */

/* Pricing box items */
.pricing-box-items {
  border-radius: var(--pt-bdr-radius-lg);
}

/* Pricing card border on hover */
.pricing-box-items::before {
  border-radius: var(--pt-bdr-radius-lg);
  border-color: var(--border);
}

.pricing-box-items:hover::before {
  border: 2px solid var(--pt-primary);
}

/* Pricing head — caramel accent */
.pricing-box-items .pricing-head {
  background-color: var(--pt-primary);
  border-radius: var(--pt-bdr-radius);
}

/* Pricing content line accent */
.pricing-box-items .pricing-content .line {
  background-color: var(--pt-primary);
}

.pricing-box-items .pricing-content h3 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: var(--pt-primary-dark);
}

/* Pricing CTA button */
.pricing-box-items .pricing-theme-btn {
  border: 1px solid var(--pt-primary);
  color: var(--pt-primary);
  border-radius: var(--pt-bdr-radius) !important;
  font-family: 'Plus Jakarta Sans', sans-serif;
}

.pricing-box-items .pricing-theme-btn i {
  background-color: var(--pt-cream);
  border-radius: 6px;
}

.pricing-box-items .pricing-theme-btn:hover {
  color: var(--white);
  background-color: var(--pt-primary);
}

.pricing-box-items .pricing-theme-btn:hover i {
  background-color: var(--white);
  color: var(--pt-primary);
}

/* Popular pricing card — accent border */
.pricing-box-items.active::before,
.pricing-box-items.popular::before {
  border: 2px solid var(--pt-accent);
}


/* ==========================================================================
   14. News / Knowledge Cards
   ========================================================================== */

/* News box items style 2 */
.news-box-items-style-2 {
  border-radius: var(--pt-bdr-radius-lg);
  overflow: hidden;
}

.news-box-items-style-2 .content h3 {
  font-family: 'Plus Jakarta Sans', sans-serif;
}

.news-box-items-style-2 .content h3 a {
  color: var(--pt-primary-dark);
}

.news-box-items-style-2 .content h3 a:hover {
  color: var(--pt-primary);
}

/* News post date badge */
.news-box-items-style-2 .thumb .post-date {
  background-color: var(--pt-primary);
}

/* News card items 4 (standard layout) */
.news-card-items-4 .news-content h2 a {
  color: var(--pt-primary-dark);
  font-family: 'Plus Jakarta Sans', sans-serif;
}

.news-card-items-4 .news-content h2 a:hover {
  color: var(--pt-primary);
}

/* News box original style */
.news-box-main-area .news-box-items .content h3 a {
  color: var(--white);
}

.news-box-main-area .news-box-items .content h3 a:hover {
  color: var(--pt-accent);
}

.news-box-main-area .news-box-items .post-date .date {
  background-color: var(--pt-primary);
}


/* ==========================================================================
   15. Team / Expert Cards
   ========================================================================== */

.team-box-items-style-4 {
  border-radius: var(--pt-bdr-radius-lg);
  overflow: hidden;
}

.team-box-items-style-4 .content .title a {
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: var(--pt-primary-dark);
}

.team-box-items-style-4 .content .title a:hover {
  color: var(--pt-primary);
}

/* Team social icons */
.team-box-items-style-4 .thumb .team-icon li a {
  background-color: var(--pt-primary);
  color: var(--white);
}

.team-box-items-style-4 .thumb .team-icon li a:hover {
  background-color: var(--pt-primary-dark);
}

/* Team card items — homepage team section */
.team-card-items {
  background: var(--white);
  border-radius: var(--pt-bdr-radius-lg);
  padding: 24px 20px;
  transition: all 0.3s ease;
  border: 1px solid rgba(181, 101, 29, 0.1);
}

.team-card-items:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(61, 36, 21, 0.12);
  border-left: 4px solid var(--pt-primary);
}

.team-card-items .team-thumb {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  overflow: hidden;
  margin: 0 auto 16px;
  border: 3px solid var(--pt-cream);
}

.team-card-items .team-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.team-card-items .team-content h4 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: var(--pt-primary-dark);
  margin-bottom: 4px;
}

.team-card-items .team-content p {
  font-family: 'Inter', 'Be Vietnam Pro', sans-serif;
  font-size: 14px;
  color: var(--pt-primary);
  font-weight: 500;
  margin-bottom: 8px;
}

.team-card-items .team-content .team-bio {
  font-family: 'Inter', 'Be Vietnam Pro', sans-serif;
  font-size: 13px;
  color: var(--pt-warm-gray);
  display: block;
  line-height: 1.5;
}

/* Team section */
.team-section .section-title p {
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
  color: var(--pt-charcoal);
  font-family: 'Inter', 'Be Vietnam Pro', sans-serif;
}

/* Testimonial stats bar */
.testi-stats-bar {
  margin-bottom: 20px;
}

.testi-stat-item {
  font-family: 'Inter', 'Be Vietnam Pro', sans-serif;
  font-size: 14px;
  color: var(--pt-charcoal);
  padding: 8px 16px;
  background: var(--pt-cream);
  border-radius: var(--pt-bdr-radius);
}

.testi-stat-item strong {
  color: var(--pt-primary);
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 700;
  margin-right: 4px;
}

/* CTA section custom styles */
.cta-section .theme-btn {
  border-radius: var(--pt-bdr-radius) !important;
}

.cta-section .theme-btn .btn-title {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-weight: 600;
}


/* ==========================================================================
   16. CTA Sections
   ========================================================================== */

/* CTA wrapper */
.cta-wrapper-3 .cta-icon-area .title {
  font-family: 'Lora', serif;
  color: var(--pt-primary-dark);
}

/* CTA mail/phone links */
.cta-wrapper-3 .cta-icon-area .cta-first-items .content .mail-text {
  color: var(--pt-primary);
}

.cta-wrapper-3 .cta-icon-area .cta-first-items .content .mail-text:hover {
  color: var(--pt-primary-hover);
}

/* CTA marquee section */
.cta-marquee-section-2 {
  background-color: var(--pt-cream);
}


/* ==========================================================================
   17. Footer
   ========================================================================== */

/* Footer section — chocolate brown */
.footer-section {
  background-color: var(--pt-primary-dark);
}

.footer-section::before {
  background: rgba(61, 36, 21, 0.94);
}

/* Footer section 3 */
.footer-section-3 {
  background-color: var(--pt-primary-dark);
}

/* Footer widget headings */
.footer-widget-wrapper-1 .footer-widget-items .widget-head h3,
.footer-widget-wrapper-3 .footer-widget-items .widget-head h3 {
  color: var(--white);
  font-family: 'Plus Jakarta Sans', sans-serif;
}

/* Footer text — cream for readability */
.footer-widget-wrapper-1 .footer-widget-items .footer-content p,
.footer-widget-wrapper-3 .footer-widget-items .footer-content p {
  color: var(--pt-cream);
}

/* Footer links */
.footer-widget-wrapper-1 .footer-widget-items .list-area li a,
.footer-widget-wrapper-3 .footer-widget-items .list-area li a {
  color: rgba(245, 230, 208, 0.75);
}

/* Footer link hover — golden accent */
.footer-widget-wrapper-1 .footer-widget-items .list-area li:hover a,
.footer-widget-wrapper-3 .footer-widget-items .list-area li:hover a {
  color: var(--pt-accent);
}

/* Footer link icon */
.footer-widget-wrapper-1 .footer-widget-items .list-area li i,
.footer-widget-wrapper-3 .footer-widget-items .list-area li i {
  color: var(--pt-primary);
}

/* Footer link hover — accent icon */
.footer-widget-wrapper-1 .footer-widget-items .list-area li:hover,
.footer-widget-wrapper-3 .footer-widget-items .list-area li:hover {
  color: var(--pt-accent);
}

/* Footer newsletter input */
.footer-widget-wrapper-1 .footer-widget-items .footer-form-items form input,
.footer-widget-wrapper-3 .footer-widget-items .footer-form-items form input {
  background-color: rgba(245, 230, 208, 0.1);
  border-color: rgba(245, 230, 208, 0.2);
  color: var(--pt-cream);
}

.footer-widget-wrapper-1 .footer-widget-items .footer-form-items form input::placeholder,
.footer-widget-wrapper-3 .footer-widget-items .footer-form-items form input::placeholder {
  color: rgba(245, 230, 208, 0.5);
}

/* Footer newsletter submit icon button */
.footer-widget-wrapper-1 .footer-widget-items .footer-form-items form .icon-btn,
.footer-widget-wrapper-3 .footer-widget-items .footer-form-items form .icon-btn {
  background-color: var(--pt-primary);
  color: var(--white);
}

/* Footer subscribe text */
.footer-widget-wrapper-1 .footer-widget-items .footer-form-items .subscribe-text,
.footer-widget-wrapper-3 .footer-widget-items .footer-form-items .subscribe-text {
  color: var(--pt-cream);
}

/* Footer form check label */
.footer-widget-wrapper-1 .footer-widget-items .footer-form-items .form-check .form-check-label,
.footer-widget-wrapper-3 .footer-widget-items .footer-form-items .form-check .form-check-label {
  color: rgba(245, 230, 208, 0.6);
}

.footer-widget-wrapper-1 .footer-widget-items .footer-form-items .form-check .form-check-label a,
.footer-widget-wrapper-3 .footer-widget-items .footer-form-items .form-check .form-check-label a {
  color: var(--pt-accent);
}

/* Footer bottom */
.footer-bottom {
  border-top-color: rgba(245, 230, 208, 0.15);
}

.footer-bottom .text-1 {
  color: rgba(245, 230, 208, 0.6);
}

.footer-bottom .text-1 a {
  color: var(--pt-cream);
}

.footer-bottom .text-1 a:hover {
  color: var(--pt-accent);
}


/* ==========================================================================
   18. Breadcrumb / Page Header
   ========================================================================== */

.breadcrumb-wrapper {
  background-color: var(--pt-primary-dark);
}

.breadcrumb-wrapper::before {
  background: linear-gradient(
    180deg,
    rgba(61, 36, 21, 0.85) 0%,
    rgba(61, 36, 21, 0.95) 100%
  );
}

.breadcrumb-wrapper .page-heading .breadcrumb-title {
  font-family: 'Lora', serif;
  color: var(--white);
}

.breadcrumb-wrapper .page-heading .breadcrumb-list li {
  color: var(--pt-cream);
}

.breadcrumb-wrapper .page-heading .breadcrumb-list li a {
  color: rgba(245, 230, 208, 0.7);
}

.breadcrumb-wrapper .page-heading .breadcrumb-list li a:hover {
  color: var(--pt-accent);
}


/* ==========================================================================
   19. Preloader
   ========================================================================== */

/* Preloader — warm white background with brown accent */
.preloader {
  background-color: var(--pt-warm-white);
  color: var(--pt-primary-dark);
}

.preloader .preloader-overlay {
  background-color: var(--pt-warm-white);
}

/* Preloader ball — caramel accent */
.preloader .preloader-ball-inner {
  background-color: var(--pt-primary);
  box-shadow: 0 0 12px 0 rgba(181, 101, 29, 0.4);
}

.preloader .preloader-ball-shadow {
  background-color: var(--pt-primary);
  box-shadow: 0 4px 20px 0 var(--pt-primary);
}

.preloader .preloader-ball {
  background-color: rgba(181, 101, 29, 0.1);
  box-shadow: 0 0 20px 0 var(--pt-primary);
}

/* Preloader text */
.preloader .preloader-text {
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: var(--pt-primary-dark);
}


/* ==========================================================================
   20. Forms & Inputs
   ========================================================================== */

/* Input focus state */
input:focus,
textarea:focus,
select:focus {
  border-color: var(--pt-primary) !important;
  outline: none;
  box-shadow: 0 0 0 3px rgba(181, 101, 29, 0.1);
}

/* Contact form inputs */
.contact-form input,
.contact-form textarea {
  font-family: 'Inter', 'Be Vietnam Pro', sans-serif;
  border-color: var(--border);
  border-radius: var(--pt-bdr-radius);
  color: var(--pt-charcoal);
}

.contact-form input::placeholder,
.contact-form textarea::placeholder {
  color: var(--pt-warm-gray);
}


/* ==========================================================================
   21. Scrollbar — subtle brown accent
   ========================================================================== */

::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: var(--pt-warm-white);
}

::-webkit-scrollbar-thumb {
  background: rgba(181, 101, 29, 0.3);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(181, 101, 29, 0.5);
}

/* Firefox scrollbar */
* {
  scrollbar-width: thin;
  scrollbar-color: rgba(181, 101, 29, 0.3) var(--pt-warm-white);
}


/* ==========================================================================
   22. Text Selection — brown tint
   ========================================================================== */

::selection {
  background-color: rgba(181, 101, 29, 0.2);
  color: var(--pt-primary-dark);
}

::-moz-selection {
  background-color: rgba(181, 101, 29, 0.2);
  color: var(--pt-primary-dark);
}


/* ==========================================================================
   23. Offcanvas / Mobile Menu
   ========================================================================== */

/* Offcanvas panel — chocolate brown */
.offcanvas__info {
  background: var(--pt-primary-dark);
}

/* Mobile sidebar toggle */
.sidebar__toggle span {
  background-color: var(--white);
}

/* Mobile mean menu override */
.mean-container .mean-nav {
  background: var(--pt-primary-dark);
}

.mean-container .mean-nav ul li a {
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: var(--pt-cream);
  border-top-color: rgba(245, 230, 208, 0.1);
}

.mean-container .mean-nav ul li a:hover {
  color: var(--pt-accent);
}

.mean-container .mean-bar {
  background: var(--pt-primary-dark);
}

.mean-container a.meanmenu-reveal {
  color: var(--white);
}

.mean-container a.meanmenu-reveal span {
  background: var(--white);
}


/* ==========================================================================
   24. Miscellaneous Utilities
   ========================================================================== */

/* About feature box counters */
.about-feature-box-style-1 .counter-items {
  font-family: 'Plus Jakarta Sans', sans-serif;
}

/* FAQ accordion */
.faq-content .accordion-button {
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: var(--pt-primary-dark);
}

.faq-content .accordion-button:not(.collapsed) {
  color: var(--pt-primary);
  background-color: rgba(181, 101, 29, 0.05);
}

.faq-content .accordion-button::after {
  color: var(--pt-primary);
}

/* Marquee section text */
.marquee-section-2 .marquee-wrapper .marquee-title {
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: var(--pt-primary-dark);
}

.marquee-section-2 .marquee-wrapper .marquee-title span {
  color: var(--pt-primary);
}

/* Project/portfolio items */
.project-items .content h3 a {
  font-family: 'Plus Jakarta Sans', sans-serif;
}

/* Work process items */
.work-process-left-thumb-style-4 .section-title h2 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: var(--pt-primary-dark);
}

/* Feature items */
.feature-content h3 {
  font-family: 'Plus Jakarta Sans', sans-serif;
}

/* Brand logo area */
.brand-section {
  background-color: var(--pt-warm-white);
}

/* Back to top button */
.scroll-up {
  background-color: var(--pt-primary);
  border-radius: var(--pt-bdr-radius);
}

.scroll-up:hover {
  background-color: var(--pt-primary-dark);
}

/* Pagination */
.pagination .page-link {
  color: var(--pt-primary-dark);
  border-color: var(--border);
  border-radius: var(--pt-bdr-radius);
}

.pagination .page-link:hover,
.pagination .page-item.active .page-link {
  background-color: var(--pt-primary);
  border-color: var(--pt-primary);
  color: var(--white);
}


/* ==========================================================================
   25. Responsive Overrides
   ========================================================================== */

@media (max-width: 991px) {
  /* Mobile section padding */
  .section-padding {
    padding: var(--pt-section-padding-mobile) 0;
  }

  /* Mobile hero heading */
  .hero-1 .hero-content h1 {
    font-family: 'Lora', serif;
  }

  /* Mobile cards — reduce hover translation on touch devices */
  .news-box-items-style-2:hover,
  .team-box-items-style-4:hover,
  .testimonial-box-items-style-1:hover {
    transform: translateY(-2px);
  }
}

@media (max-width: 767px) {
  /* Smaller heading sizes on mobile retain correct fonts */
  h1 {
    font-family: 'Lora', serif;
  }

  h2, h3 {
    font-family: 'Plus Jakarta Sans', sans-serif;
  }

  /* Sub-title line slightly shorter on mobile */
  .section-title .sub-title::before {
    width: 20px;
  }
}

@media (max-width: 575px) {
  /* Extra-small: tighter section padding */
  .section-padding {
    padding: 40px 0;
  }
}

/* ==========================================================================
   26. PlusTalent Logo Sizing
   ========================================================================== */

/* Header logo — PNG needs explicit sizing */
.header-main .logo img,
.header-1 .logo img,
.header-2 .logo img,
.header-3 .logo img {
  max-height: 48px;
  width: auto;
  object-fit: contain;
}

/* Sticky header — slightly smaller */
#header-sticky.sticky .logo img {
  max-height: 40px;
}

/* Offcanvas logo */
.offcanvas__logo img {
  max-height: 44px;
  width: auto;
  object-fit: contain;
}

/* Footer logo */
.footer-widget-style-1 .footer-logo img,
.footer-widget .footer-logo img,
.footer-section .logo img {
  max-height: 56px;
  width: auto;
  object-fit: contain;
}

/* Mobile header */
@media (max-width: 991px) {
  .header-main .logo img {
    max-height: 36px;
  }
}
