:root {
      --navy: #0a1628;
      --navy-mid: #12233f;
      --gold: #0a8d63;
      --gold-light: #e2c37a;
      --cream: #f9f6f0;
      --white: #ffffff;
      --gray: #6b7280;
      --light: #f3f4f6;
      --navy-soft: #1a3260;
      --gray-light:#9ca3af;
      --border:    #e5e7eb;
      --text:      #1f2937;
      --success:   #10b981;
      --error:     #ef4444;
      --ink:        #0e1117;
      --ink-soft:   #1c2333;
      --slate:      #2e3a4e;
      --gold-pale:  #f5edd8;
    }

    * { margin: 0; padding: 0; box-sizing: border-box; }

    body {
      font-family: 'DM Sans', sans-serif;
      color: var(--navy);
      background: var(--white);
      overflow-x: hidden;
    }

    h1, h2, h3, h4 { font-family: 'Playfair Display', serif; }

    /* ── NAVBAR ── */
    .navbar {
      background: var(--white);
      padding: 0.2rem 0;
      position: sticky;
      top: 0;
      z-index: 1000;
      box-shadow: 0 2px 20px rgba(0,0,0,.35);
    }
    .navbar-brand {
      font-family: 'Playfair Display', serif;
      font-size: 1.7rem;
      font-weight: 700;
      color: var(--white) !important;
      letter-spacing: -0.5px;
    }
	.navbar-brand img{
		height: 80px;
	}
    .navbar-brand span { color: var(--gold); }
    .navbar .nav-link {
      color: var(--navy);
      font-size: .9rem;
      font-weight: 500;
      letter-spacing: .3px;
      transition: color .2s;
    }
    .navbar .nav-link:hover { color: var(--gold) !important; }
    .navbar .btn-cta {
      background: var(--gold);
      color: var(--white) !important;
      font-weight: 600;
      border-radius: 4px;
      padding: .45rem 1.2rem !important;
      font-size: .88rem;
      transition: background .2s, transform .15s;
    }
    .navbar .btn-cta:hover { background: var(--gold-light); transform: translateY(-1px); }
    .navbar-toggler { border-color: var(--white); }
    .navbar-toggler-icon { filter: invert(1); }

    /* ── HERO ── */
    .hero {
    /*  background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 60%, #1a3260 100%);*/
       background-image: url("../images/banner.jpg");
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;

        min-height: 90vh;
        display: flex;
        align-items: center;

        position: relative;
        overflow: hidden;
    }
    .hero::before {
      content: '';
      position: absolute;
      top: -120px; right: -120px;
      width: 600px; height: 600px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(201,168,76,.12) 0%, transparent 70%);
    }
    .hero::after {
      content: '';
      position: absolute;
      bottom: -80px; left: -80px;
      width: 400px; height: 400px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(201,168,76,.07) 0%, transparent 70%);
    }
    .hero-badge {
      display: inline-block;
      background: rgba(201,168,76,.15);
      color: var(--white);
      border: 1px solid rgba(201,168,76,.3);
      border-radius: 50px;
      padding: .35rem 1rem;
      font-size: .78rem;
      font-weight: 600;
      letter-spacing: 1.5px;
      text-transform: uppercase;
      margin-bottom: 1.4rem;
    }
    .hero h1 {
      font-size: clamp(2.4rem, 5vw, 4rem);
      color: var(--white);
      line-height: 1.18;
      margin-bottom: 1.3rem;
    }
    .hero h1 em { color: var(--gold); font-style: normal; }
    .hero p {
      color: rgba(255,255,255,.75);
      font-size: 1.1rem;
      line-height: 1.7;
      max-width: 520px;
      margin-bottom: 2rem;
    }
    .hero-services{
      background: rgb(10 141 99 / 45%);
      border: 1px solid rgb(4 68 135 / 44%);
      border-radius: 20px;
      padding: 2.5rem;
      width: 100%;
      max-width: 380px;
    }

    .hero-services .service{
      display:flex;align-items:center;gap:.9rem;
    }
    .hero-services .title{
      color:var(--white); font-size:.78rem; text-transform:uppercase; letter-spacing:1.5px;
    }

    .hero-services .icon{
      width:36px;height:36px;background:rgba(201,168,76,.2);border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;
    }
    .hero-services .content{
      color:rgba(255,255,255,.8);font-size:.9rem;
    }
    .btn-primary-gold {
      background: var(--gold);
      color: var(--white);
      font-weight: 700;
      border: none;
      border-radius: 5px;
      padding: .85rem 2rem;
      font-size: .95rem;
      letter-spacing: .3px;
      transition: all .2s;
      text-decoration: none;
      display: inline-block;
    }
    .btn-primary-gold:hover { background: var(--gold-light); transform: translateY(-2px); color: var(--navy); box-shadow: 0 8px 24px rgba(201,168,76,.35); }
    .btn-outline-white {
      background: transparent;
      color: var(--white);
      font-weight: 600;
      border: 2px solid rgba(255,255,255,.35);
      border-radius: 5px;
      padding: .82rem 1.8rem;
      font-size: .95rem;
      transition: all .2s;
      text-decoration: none;
      display: inline-block;
    }
    .btn-outline-white:hover { border-color: var(--gold); color: var(--gold); }

    /* Stats */
    .stats-bar {
      background: var(--gold);
      padding: 1.2rem 0;
    }
    .stat-item { text-align: center; }
    .stat-item .number {
      font-family: 'Playfair Display', serif;
      font-size: 2rem;
      font-weight: 900;
      color: var(--white);
      line-height: 1;
    }
    .stat-item .label {
      font-size: .78rem;
      font-weight: 600;
      color: var(--white);
      letter-spacing: .8px;
      text-transform: uppercase;
      opacity: .75;
    }
    .stat-divider { width: 1px; height: 40px; background: rgba(10,22,40,.2); }

    /* ── LOGOS ── */
    .logos-section { background: var(--cream); padding: 3rem 0; }
    .logos-section h6 {
      font-family: 'DM Sans', sans-serif;
      font-size: .75rem;
      letter-spacing: 2px;
      text-transform: uppercase;
      color: var(--gray);
      margin-bottom: 1.8rem;
    }
    .logo-pill {
      background: var(--white);
      border: 1px solid #e5e7eb;
      border-radius: 8px;
      padding: .7rem 1.6rem;
      font-weight: 700;
      font-size: .9rem;
      color: #374151;
      letter-spacing: .5px;
      display: inline-block;
    }

    /* ── ABOUT ── */
    .about-section { padding: 3rem 0; background: var(--white); }
    .section-overline {
      font-family: 'DM Sans', sans-serif;
      font-size: .72rem;
      letter-spacing: 2.5px;
      text-transform: uppercase;
      color: var(--navy);
      font-weight: 600;
      margin-bottom: .6rem;
    }

     .section-overline-finance {
      font-family: 'DM Sans', sans-serif;
      font-size: 1rem;
      letter-spacing: 2.5px;
      text-transform: uppercase;
      color: var(--white);
      font-weight: 600;
      margin-bottom: .6rem;
    }
  
    .section-heading-about { font-size: clamp(1.7rem, 3.5vw, 2.5rem); color: var(--navy); line-height: 1.25; margin-bottom: 1.2rem; }
    .section-heading-work { font-size: clamp(1.7rem, 3.5vw, 2.5rem); color: var(--navy); line-height: 1.25; margin-bottom: 1.2rem; }
    .section-heading { font-size: clamp(1.7rem, 3.5vw, 2.5rem); color: var(--white); line-height: 1.25; margin-bottom: 1.2rem; }
    .accent-line { width: 48px; height: 3px; background: var(--gold); margin-bottom: 1.5rem; border-radius: 2px; }
    .about-card {
          background: var(--white);
          border-radius: 12px;
          padding: 2.5rem;
          height: 100%;
          border: 1px solid #ccc;
          border-left: 4px solid var(--gold);
    }
    .about-card i { font-size: 1.6rem; color: var(--gold); margin-bottom: 1rem; }
    .about-card h5 { font-family: 'Playfair Display', serif; font-size: 1.15rem; margin-bottom: .6rem; }
    .about-card p { color: var(--gray); font-size: .92rem; line-height: 1.65; }

     .about-card:hover {
          background: var(--cream);
          border-radius: 12px;
          padding: 2.5rem;
          height: 100%;
          border: 1px solid #ccc;
          border-left: 4px solid var(--gold);
    }
	.breadcrumb-section { 
      padding: 4rem 0; 
      background: url(../images/breadcrumb.jpg);
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
     }
	 .about-section p {
		 line-height: 2em;
		 text-align: justify;
	 }
    /* ── SERVICES ── */
    .services-section { 
      padding: 4rem 0; 
      background: url(../images/service.jpg);
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
      background-attachment: fixed;
     }
    .services-section .section-overline { color: var(--white); }
    .services-section .section-heading { color: var(--white); }
    .service-card {
      background: rgb(15 30 57 / 66%);;
      border: 1px solid rgba(255,255,255,.1);
      border-radius: 14px;
      padding: 2.2rem;
      height: 100%;
      transition: all .3s;
      position: relative;
      overflow: hidden;
    }
    .service-card::before {
      content: '';
      position: absolute;
      top: 0; left: 0;
      width: 100%; height: 3px;
      background: var(--gold);
      transform: scaleX(0);
      transition: transform .3s;
    }
    .service-card:hover { background: rgba(255,255,255,.1); transform: translateY(-4px); box-shadow: 0 16px 40px rgba(0,0,0,.3); }
    .service-card:hover::before { transform: scaleX(1); }
    .service-card .icon-wrap {
      width: 52px; height: 52px;
      background: rgb(252 251 248 / 92%);
      border-radius: 10px;
      display: flex; align-items: center; justify-content: center;
      margin-bottom: 1.2rem;
    }
    .service-card .icon-wrap i { color: var(--gold); font-size: 1.3rem; }
    .service-card p{
      color: var(--gray-light);
    }
    .service-card h4 { color: var(--white); font-size: 1.2rem; margin-bottom: .8rem; }
    .service-card ul { list-style: none; padding: 0; margin: 0 0 1.4rem; }
    .service-card ul li {
      color: rgba(255,255,255,.65);
      font-size: .88rem;
      padding: .25rem 0;
      border-bottom: 1px solid rgba(255,255,255,.06);
    }
    .service-card ul li::before { content: '→ '; color: var(--gold); }
    .service-card a { color: var(--white); font-size: .85rem; font-weight: 600; text-decoration: none; letter-spacing: .5px; }
    .service-card a:hover { color: var(--gold-light); }

    /* ── WHY US ── */
    .why-section { padding: 6rem 0; background: var(--cream); }
    .why-item { display: flex; gap: 1.2rem; margin-bottom: 2rem; }
    .why-num {
      font-family: 'Playfair Display', serif;
      font-size: 2.5rem;
      font-weight: 900;
      color: var(--gold);
      line-height: 1;
      min-width: 50px;
    }
    .why-item h5 { font-size: 1.05rem; margin-bottom: .3rem; color: var(--light); }
    .why-item p { color: var(--gray); font-size: .9rem; line-height: 1.6; }
    .why-img-wrap {
      border-radius: 16px;
      overflow: hidden;
      position: relative;
    }
    .why-img-placeholder {
      background: linear-gradient(135deg, var(--gold) 0%, #1a3260 50%);
      height: 460px;
      border-radius: 16px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-direction: column;
      color: var(--white);
      text-align: center;
      padding: 2rem;
    }
    .why-img-placeholder i { font-size: 4rem; color: var(--gold); margin-bottom: 1rem; opacity: .8; }
    .why-img-placeholder p { color: var(--white); font-size: .9rem; }
    .badge-floating {
      position: absolute;
      bottom: 24px; left: -20px;
      background: var(--gold);
      border-radius: 12px;
      padding: 1rem 1.5rem;
      box-shadow: 0 8px 28px rgba(0,0,0,.2);
    }
    .badge-floating .bf-num {
      font-family: 'Playfair Display', serif;
      font-size: 2rem;
      font-weight: 900;
      color: var(--white);
      line-height: 1;
    }
    .badge-floating .bf-label { font-size: .72rem; font-weight: 600; color: var(--white); opacity: .7; text-transform: uppercase; letter-spacing: .8px; }

    /* ── PROCESS ── */
    .process-section { padding: 6rem 0; background: var(--white); }
    .process-step {
      text-align: center;
      padding: 2rem 1rem;
      position: relative;
    }
    .step-circle {
      width: 70px; height: 70px;
      border-radius: 50%;
      background: var(--navy);
      color: var(--white);
      font-family: 'Playfair Display', serif;
      font-size: 1.5rem;
      font-weight: 700;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0 auto 1.2rem;
	  padding: 10px 5px 20px 5px;
      box-shadow: 0 4px 16px rgba(10,22,40,.15);
    }
    .process-step h5 { font-size: 1rem; margin-bottom: .5rem; }
    .process-step p { color: var(--gray); font-size: .88rem; line-height: 1.6; }
    .process-arrow {
      position: absolute;
      top: 37px; right: -24px;
      color: var(--gold);
      font-size: 1.2rem;
      z-index: 2;
    }

    /* ── TESTIMONIALS ── */
    .testimonials-section { padding: 6rem 0; background: var(--navy); }
    .testimonials-section .section-heading { color: var(--white); }
    .testi-card {
      background: rgba(255,255,255,.07);
      border: 1px solid rgba(255,255,255,.1);
      border-radius: 14px;
      padding: 2rem;
      height: 100%;
    }
    .testi-stars { color: var(--gold); font-size: .85rem; margin-bottom: 1rem; }
    .testi-card p { color: rgba(255,255,255,.75); font-size: .92rem; line-height: 1.7; margin-bottom: 1.4rem; font-style: italic; }
    .testi-author { display: flex; align-items: center; gap: .8rem; }
    .testi-avatar {
      width: 42px; height: 42px; border-radius: 50%;
      background: var(--gold);
      display: flex; align-items: center; justify-content: center;
      font-family: 'Playfair Display', serif;
      font-weight: 700;
      color: var(--navy);
      font-size: 1rem;
    }
    .testi-author .name { color: var(--white); font-weight: 600; font-size: .9rem; }
    .testi-author .role { color: var(--white); font-size: .75rem; }

    /* ── CTA SECTION ── */
    .cta-section {
      background: linear-gradient(135deg, var(--gold) 0%, #0d3f75 100%);
      padding: 5rem 0;
      text-align: center;
    }
    .cta-section h2 { font-size: clamp(1.8rem, 4vw, 3rem); color: var(--white); margin-bottom: 1rem; }
    .cta-section p { color: var(--white); font-size: 1.05rem; max-width: 540px; margin: 0 auto 2rem; }
    .btn-navy {
      background: var(--navy);
      color: var(--white);
      font-weight: 700;
      border: none;
      border-radius: 5px;
      padding: .9rem 2.2rem;
      font-size: .95rem;
      text-decoration: none;
      display: inline-block;
      transition: all .2s;
    }
    .btn-navy:hover { background: var(--navy-mid); color: var(--white); transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,.2); }

    /* ── FOOTER ── */
    footer {
      background: #10203a;
      color: rgba(255,255,255,.55);
      padding: 4rem 0 2rem;
    }
    footer .brand {
      font-family: 'Playfair Display', serif;
      font-size: 1.6rem;
      font-weight: 700;
      color: var(--white);
      margin-bottom: .8rem;
    }
    footer .brand span { color: var(--gold); }
    footer p { font-size: .88rem; line-height: 1.65; max-width: 280px; }
    footer h6 {
      font-family: 'DM Sans', sans-serif;
      text-transform: uppercase;
      letter-spacing: 1.5px;
      font-size: .72rem;
      color: var(--white);
      margin-bottom: 1rem;
    }
    footer ul { list-style: none; padding: 0; }
    footer ul li { margin-bottom: .45rem; }
    footer ul li a { color: rgba(255,255,255,.55); text-decoration: none; font-size: .88rem; transition: color .2s; }
    footer ul li a:hover { color: var(--gold); }
    .footer-divider { border-color: rgba(255,255,255,.08); margin: 2.5rem 0 1.5rem; }
    .footer-bottom { font-size: .8rem; }
    .social-icons a {
      display: inline-flex;
      align-items: center; justify-content: center;
      width: 36px; height: 36px;
      border-radius: 50%;
      border: 1px solid rgba(255,255,255,.15);
      color: rgba(255,255,255,.55);
      text-decoration: none;
      font-size: .85rem;
      margin-right: .4rem;
      transition: all .2s;
      margin-top: 5px;
    }
    .social-icons a:hover { border-color: var(--gold); color: var(--gold); }

    /* ── Animations ── */
    @keyframes fadeUp { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: translateY(0); } }
    .fade-up { animation: fadeUp .7s ease both; }
    .delay-1 { animation-delay: .15s; }
    .delay-2 { animation-delay: .3s; }
    .delay-3 { animation-delay: .45s; }
    .delay-4 { animation-delay: .6s; }

    @media (max-width: 767px) {
      .hero { min-height: auto; padding: 4rem 0; }
      .process-arrow { display: none; }
      .badge-floating { position: relative; left: 0; margin-top: 1rem; }
    }

    
    .blog-hero {
      background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 55%, var(--navy-soft) 100%);
      padding: 5rem 0 4rem;
      position: relative; overflow: hidden;
    }
    .blog-hero::before {
      content: '';
      position: absolute; top: -100px; right: -100px;
      width: 500px; height: 500px; border-radius: 50%;
      background: radial-gradient(circle, rgba(201,168,76,.13) 0%, transparent 70%);
    }
    .blog-hero .overline {
      font-family: 'DM Sans', sans-serif;
      font-size: .72rem; letter-spacing: 2.5px;
      text-transform: uppercase; color: var(--gold);
      font-weight: 600; margin-bottom: .6rem;
    }
    .blog-hero h1 {
      font-size: clamp(2rem, 4.5vw, 3.2rem);
      color: var(--white); line-height: 1.2; margin-bottom: 1rem;
    }
    .blog-hero p {
      color: rgba(255,255,255,.68); font-size: 1.05rem;
      line-height: 1.7; max-width: 520px;
    }
    
    /* Search bar */
    .search-wrap {
      background: rgba(255,255,255,.07);
      border: 1px solid rgba(255,255,255,.18);
      border-radius: 8px;
      display: flex; align-items: center;
      overflow: hidden; max-width: 420px; margin-top: 2rem;
    }
    .search-wrap input {
      flex: 1; background: transparent; border: none; outline: none;
      color: var(--white); padding: .75rem 1rem;
      font-size: .9rem; font-family: 'DM Sans', sans-serif;
    }
    .search-wrap input::placeholder { color: rgba(255,255,255,.4); }
    .search-wrap button {
      background: var(--gold); border: none;
      padding: .75rem 1.1rem; color: var(--navy);
      font-size: .9rem; cursor: pointer; transition: background .2s;
    }
    .search-wrap button:hover { background: var(--gold-light); }

    /* ── CATEGORY TABS ── */
    .category-bar { background: var(--cream); border-bottom: 1px solid var(--border); }
    .category-bar .nav-pills { gap: .4rem; padding: .9rem 0; flex-wrap: wrap; }
    .category-bar .nav-link {
      font-family: 'DM Sans', sans-serif;
      font-size: .82rem; font-weight: 600;
      color: var(--gray); border-radius: 50px;
      padding: .4rem 1.1rem; letter-spacing: .3px;
      border: 1px solid transparent; transition: all .2s;
    }
    .category-bar .nav-link:hover { color: var(--navy); background: var(--white); border-color: var(--border); }
    .category-bar .nav-link.active {
      background: var(--navy); color: var(--white); border-color: var(--navy);
    }

    /* ── FEATURED POST ── */
    .featured-section { padding: 4rem 0 2rem; }
    .featured-card {
      background: var(--navy);
      border-radius: 18px; overflow: hidden;
      display: flex; min-height: 380px;
      position: relative;
    }
    .featured-img {
      width: 50%; background: linear-gradient(135deg, var(--navy-soft) 0%, #0d2040 100%);
      display: flex; align-items: center; justify-content: center;
      position: relative; overflow: hidden;
    }
    .featured-img .thumb-icon { font-size: 5rem; color: rgba(201,168,76,.3); }
    .featured-img::after {
      content: ''; position: absolute; top: 0; right: 0;
      width: 120px; height: 100%;
      background: linear-gradient(to right, transparent, var(--navy));
    }
    .featured-body {
      width: 50%; padding: 3rem 2.5rem;
      display: flex; flex-direction: column; justify-content: center;
    }
    .tag-badge {
      display: inline-block;
      background: rgba(201,168,76,.15);
      color: var(--gold); border: 1px solid rgba(201,168,76,.3);
      border-radius: 50px; padding: .25rem .85rem;
      font-size: .72rem; font-weight: 700;
      letter-spacing: 1px; text-transform: uppercase;
      margin-bottom: 1rem;
    }
    .featured-body h2 {
      color: var(--white); font-size: clamp(1.3rem, 2.5vw, 1.8rem);
      line-height: 1.3; margin-bottom: .9rem;
    }
    .featured-body p { color: rgba(255,255,255,.6); font-size: .92rem; line-height: 1.7; margin-bottom: 1.5rem; }
    .post-meta { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.4rem; }
    .post-meta .avatar {
      width: 36px; height: 36px; border-radius: 50%;
      background: var(--gold);
      display: flex; align-items: center; justify-content: center;
      font-family: 'Playfair Display', serif;
      font-weight: 700; color: var(--navy); font-size: .85rem;
    }
    .post-meta .meta-text .author { color: var(--white); font-size: .82rem; font-weight: 600; }
    .post-meta .meta-text .date { color: rgba(255,255,255,.45); font-size: .75rem; }
    .btn-read {
      display: inline-flex; align-items: center; gap: .5rem;
      color: var(--gold); font-size: .85rem; font-weight: 700;
      letter-spacing: .5px; text-decoration: none;
      border-bottom: 1px solid rgba(201,168,76,.35);
      padding-bottom: 2px; transition: all .2s; width: fit-content;
    }
    .btn-read:hover { color: var(--gold-light); border-color: var(--gold-light); gap: .8rem; }

    /* ── BLOG GRID ── */
    .blog-grid-section { padding: 2rem 0 5rem; }
    .blog-card {
      background: var(--white);
      border: 1px solid var(--border);
      border-radius: 14px; overflow: hidden;
      transition: all .3s; height: 100%;
      display: flex; flex-direction: column;
    }
    .blog-card:hover { transform: translateY(-5px); box-shadow: 0 16px 40px rgba(10,22,40,.1); border-color: transparent; }
    .blog-card-img {
      height: 190px;
      background: linear-gradient(135deg, var(--navy-soft) 0%, var(--navy) 100%);
      display: flex; align-items: center; justify-content: center;
      position: relative; overflow: hidden;
    }
    .blog-card-img .card-thumb-icon { font-size: 2.8rem; color: rgba(201,168,76,.4); }
    .blog-card-img .read-time {
      position: absolute; bottom: .8rem; right: .8rem;
      background: rgba(0,0,0,.5); color: rgba(255,255,255,.8);
      font-size: .7rem; padding: .2rem .6rem; border-radius: 50px;
    }
    /* Card color variants */
    .card-color-1 { background: linear-gradient(135deg, #0a2744 0%, #1a3260 100%); }
    .card-color-2 { background: linear-gradient(135deg, #0d2b1e 0%, #1a4a30 100%); }
    .card-color-3 { background: linear-gradient(135deg, #2b1a0a 0%, #4a300d 100%); }
    .card-color-4 { background: linear-gradient(135deg, #1a0a2b 0%, #30104a 100%); }
    .card-color-5 { background: linear-gradient(135deg, #0a1f2b 0%, #103040 100%); }
    .card-color-6 { background: linear-gradient(135deg, #2b0a0a 0%, #4a1010 100%); }
    .blog-card-body {
      padding: 1.5rem;
    }
    .blog-card-body .tag-badge { margin-bottom: .8rem; }
    .blog-card-body h5 {
      font-size: 1.05rem; line-height: 1.35;
      margin-bottom: .7rem; color: var(--navy);
      transition: color .2s;
    }
    .blog-card:hover .blog-card-body h5 { color: var(--gold); }
    .blog-card-body p { color: var(--gray); font-size: .87rem; line-height: 1.65; flex: 1; margin-bottom: 1.2rem; }
    .card-footer-meta {
      display: flex; align-items: center;
      justify-content: space-between;
      padding-top: 1rem; border-top: 1px solid var(--border);
      margin-top: auto;
    }
    .card-footer-meta .author-info { display: flex; align-items: center; gap: .6rem; }
    .card-footer-meta .sm-avatar {
      width: 28px; height: 28px; border-radius: 50%;
      background: var(--navy); color: var(--gold);
      display: flex; align-items: center; justify-content: center;
      font-size: .65rem; font-weight: 700;
    }
    .card-footer-meta .author-name { font-size: .78rem; font-weight: 600; color: var(--navy); }
    .card-footer-meta .post-date { font-size: .75rem; color: var(--gray); }
    .card-footer-meta a {
      font-size: .75rem; font-weight: 700; color: var(--gold);
      text-decoration: none; letter-spacing: .3px;
    }
    .card-footer-meta a:hover { color: var(--navy); }

    /* ── SIDEBAR ── */
    .sidebar-widget {
      background: var(--cream);
      border-radius: 14px; padding: 1.8rem;
      margin-bottom: 1.8rem;
    }
    .sidebar-widget h6 {
      font-family: 'DM Sans', sans-serif;
      font-size: .7rem; letter-spacing: 2px;
      text-transform: uppercase; color: var(--gold);
      font-weight: 700; margin-bottom: 1.2rem;
    }
    /* Popular posts */
    .popular-item {
      display: flex; gap: .9rem; align-items: flex-start;
      padding: .75rem 0; border-bottom: 1px solid var(--border);
    }
    .popular-item:last-child { border-bottom: none; padding-bottom: 0; }
    .popular-num {
      font-family: 'Playfair Display', serif;
      font-size: 1.4rem; font-weight: 900;
      color: var(--gold); line-height: 1; min-width: 28px;
    }
    .popular-item h6 { font-family: 'DM Sans', sans-serif; font-size: .85rem; font-weight: 600; color: var(--navy); margin: 0 0 .25rem; letter-spacing: 0; text-transform: none; }
    .popular-item span { font-size: .75rem; color: var(--gray); }
    /* Topics cloud */
    .topic-pill {
      display: inline-block;
      background: var(--white); border: 1px solid var(--border);
      border-radius: 50px; padding: .3rem .85rem;
      font-size: .78rem; font-weight: 600; color: var(--navy);
      margin: .25rem; cursor: pointer;
      transition: all .2s; text-decoration: none;
    }
    .topic-pill:hover { background: var(--navy); color: var(--white); border-color: var(--navy); }
    /* Newsletter */
    .newsletter-widget {
      background: var(--navy); border-radius: 14px;
      padding: 1.8rem; margin-bottom: 1.8rem;
    }
    .newsletter-widget h6 {
      font-family: 'DM Sans', sans-serif; font-size: .7rem;
      letter-spacing: 2px; text-transform: uppercase;
      color: var(--gold); font-weight: 700; margin-bottom: .6rem;
    }
    .newsletter-widget h5 { color: var(--white); font-size: 1.1rem; margin-bottom: .5rem; }
    .newsletter-widget p { color: rgba(255,255,255,.55); font-size: .82rem; line-height: 1.6; margin-bottom: 1.2rem; }
    .newsletter-input {
      width: 100%; background: rgba(255,255,255,.08);
      border: 1px solid rgba(255,255,255,.18); border-radius: 6px;
      color: var(--white); padding: .65rem .9rem;
      font-size: .85rem; font-family: 'DM Sans', sans-serif;
      margin-bottom: .7rem; outline: none;
      transition: border-color .2s;
    }
    .newsletter-input::placeholder { color: rgba(255,255,255,.35); }
    .newsletter-input:focus { border-color: var(--gold); }
    .btn-subscribe {
      width: 100%; background: var(--gold);
      border: none; border-radius: 6px;
      color: var(--navy); font-weight: 700;
      padding: .7rem; font-size: .88rem;
      cursor: pointer; transition: background .2s;
    }
    .btn-subscribe:hover { background: var(--gold-light); }
    /* Authors widget */
    .author-item { display: flex; align-items: center; gap: .9rem; margin-bottom: 1rem; }
    .author-item:last-child { margin-bottom: 0; }
    .author-avatar-lg {
      width: 44px; height: 44px; border-radius: 50%;
      background: var(--navy); color: var(--gold);
      display: flex; align-items: center; justify-content: center;
      font-family: 'Playfair Display', serif;
      font-weight: 700; font-size: 1rem; flex-shrink: 0;
    }
    .author-item .name { font-size: .9rem; font-weight: 600; color: var(--navy); }
    .author-item .role { font-size: .75rem; color: var(--gray); }
    .author-item .posts { font-size: .72rem; color: var(--gold); font-weight: 600; }

    /* ── PAGINATION ── */
    .pagination-section { padding: 1rem 0 3rem; }
    .page-btn {
      display: inline-flex; align-items: center; justify-content: center;
      width: 40px; height: 40px; border-radius: 8px;
      border: 1px solid var(--border); color: var(--navy);
      font-size: .88rem; font-weight: 600; text-decoration: none;
      transition: all .2s; margin: 0 .2rem;
    }
    .page-btn:hover { background: var(--navy); color: var(--white); border-color: var(--navy); }
    .page-btn.active { background: var(--gold); color: var(--navy); border-color: var(--gold); }
    .page-btn.disabled { opacity: .4; pointer-events: none; }

    * ── PROGRESS BAR ── */
    #readProgress {
      position: fixed; top: 0; left: 0; z-index: 2000;
      height: 3px; width: 0%;
      background: linear-gradient(90deg, var(--gold), var(--gold-light));
      transition: width .1s linear;
    }
 
    /* ── BREADCRUMB ── */
    .breadcrumb-bar {
      background: var(--cream);
      border-bottom: 1px solid var(--border);
      padding: .75rem 0;
    }
    .breadcrumb-bar .breadcrumb { margin: 0; font-size: .8rem; }
    .breadcrumb-item a { color: var(--gray); text-decoration: none; }
    .breadcrumb-item a:hover { color: var(--gold); }
    .breadcrumb-item.active { color: var(--navy); font-weight: 500; }
    .breadcrumb-item + .breadcrumb-item::before { color: var(--gray-light); }
 
    /* ── ARTICLE HERO ── */
    .article-hero {
      background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 55%, var(--navy-soft) 100%);
      padding: 4.5rem 0 0;
      position: relative; overflow: hidden;
    }
    .article-hero::before {
      content: '';
      position: absolute; top: -80px; right: -80px;
      width: 450px; height: 450px; border-radius: 50%;
      background: radial-gradient(circle, rgba(201,168,76,.12) 0%, transparent 70%);
    }
    .tag-badge {
      display: inline-block;
      background: rgba(201,168,76,.15);
      color: var(--gold); border: 1px solid rgba(201,168,76,.3);
      border-radius: 50px; padding: .25rem .9rem;
      font-size: .72rem; font-weight: 700;
      letter-spacing: 1px; text-transform: uppercase;
      text-decoration: none; transition: all .2s;
    }
    .tag-badge:hover { background: rgba(201,168,76,.25); color: var(--gold); }
    .article-hero h1 {
      font-size: clamp(1.9rem, 4vw, 3rem);
      color: var(--white); line-height: 1.22;
      margin: 1rem 0 1.2rem;
    }
    .article-hero .lead-text {
      color: rgba(255,255,255,.68);
      font-size: 1.1rem; line-height: 1.7;
      max-width: 700px; margin-bottom: 2rem;
    }
    /* Author row */
    .author-row {
      display: flex; align-items: center;
      gap: 1rem; flex-wrap: wrap;
      padding-bottom: 2rem;
    }
    .author-row .avatar {
      width: 48px; height: 48px; border-radius: 50%;
      background: var(--gold);
      display: flex; align-items: center; justify-content: center;
      font-family: 'Playfair Display', serif;
      font-weight: 700; color: var(--navy); font-size: 1rem;
      flex-shrink: 0;
    }
    .author-row .author-info .name {
      color: var(--white); font-weight: 600; font-size: .92rem;
    }
    .author-row .author-info .meta {
      color: rgba(255,255,255,.5); font-size: .78rem;
    }
    .article-stats {
      display: flex; gap: 1.5rem; margin-left: auto;
      flex-wrap: wrap;
    }
    .article-stats .stat {
      display: flex; align-items: center; gap: .4rem;
      color: rgba(255,255,255,.5); font-size: .8rem;
    }
    .article-stats .stat i { color: var(--gold); font-size: .75rem; }
    /* Hero image strip */
    .hero-image-strip {
      height: 340px;
      background: linear-gradient(135deg, #0d2040 0%, #1a3260 50%, #0a2744 100%);
      display: flex; align-items: center; justify-content: center;
      margin-top: 2rem; position: relative; overflow: hidden;
    }
    .hero-image-strip .main-icon {
      font-size: 6rem; color: rgba(201,168,76,.25);
    }
    .hero-image-strip .overlay-text {
      position: absolute; bottom: 2rem; left: 2rem;
      background: rgba(0,0,0,.4); border-radius: 8px;
      padding: .5rem 1rem; color: rgba(255,255,255,.6);
      font-size: .75rem;
    }
 
    /* ── ARTICLE LAYOUT ── */
    .article-layout { padding: 4rem 0 3rem; }
 
    /* ── ARTICLE BODY ── */
    .article-body {
      font-family: 'Lora', serif;
      font-size: 1.05rem;
      line-height: 1.85;
      color: var(--text);
    }
    .article-body p { margin-bottom: 1.5rem; }
    .article-body h2 {
      font-family: 'Playfair Display', serif;
      font-size: 1.6rem; color: var(--navy);
      margin: 2.5rem 0 1rem;
      padding-bottom: .5rem;
      border-bottom: 2px solid var(--cream);
    }
    .article-body h3 {
      font-family: 'Playfair Display', serif;
      font-size: 1.2rem; color: var(--navy);
      margin: 2rem 0 .8rem;
    }
    .article-body ul, .article-body ol {
      padding-left: 1.4rem; margin-bottom: 1.5rem;
    }
    .article-body ul li, .article-body ol li {
      margin-bottom: .5rem; line-height: 1.75;
    }
    .article-body ul li::marker { color: var(--gold); }
    .article-body ol li::marker { color: var(--gold); font-weight: 700; }
    .article-body strong { color: var(--navy); font-weight: 600; }
    .article-body em { color: var(--gray); }
    .article-body a { color: var(--gold); text-decoration: underline; text-underline-offset: 3px; }
 
    /* Pullquote */
    .pullquote {
      border-left: 4px solid var(--gold);
      background: var(--cream);
      border-radius: 0 12px 12px 0;
      padding: 1.5rem 2rem;
      margin: 2rem 0;
    }
    .pullquote p {
      font-family: 'Playfair Display', serif;
      font-size: 1.25rem; font-style: italic;
      color: var(--navy); line-height: 1.5; margin: 0;
    }
    .pullquote cite {
      display: block; margin-top: .6rem;
      font-size: .8rem; color: var(--gray);
      font-family: 'DM Sans', sans-serif; font-style: normal;
    }
 
    /* Callout box */
    .callout-box {
      background: var(--navy);
      border-radius: 14px; padding: 1.8rem 2rem;
      margin: 2rem 0;
    }
    .callout-box .callout-label {
      font-family: 'DM Sans', sans-serif;
      font-size: .7rem; letter-spacing: 2px;
      text-transform: uppercase; color: var(--gold);
      font-weight: 700; margin-bottom: .5rem;
    }
    .callout-box h4 { color: var(--white); font-size: 1.1rem; margin-bottom: .6rem; }
    .callout-box p { color: rgba(255,255,255,.65); font-size: .9rem; line-height: 1.65; font-family: 'DM Sans', sans-serif; margin: 0; }
 
    /* Stat highlight */
    .stat-highlight {
      display: flex; gap: 1.5rem; flex-wrap: wrap;
      margin: 2rem 0;
    }
    .stat-box {
      flex: 1; min-width: 140px;
      background: var(--cream); border-radius: 12px;
      padding: 1.4rem 1.2rem; text-align: center;
      border-top: 3px solid var(--gold);
    }
    .stat-box .num {
      font-family: 'Playfair Display', serif;
      font-size: 2rem; font-weight: 900; color: var(--navy);
      line-height: 1;
    }
    .stat-box .lbl { font-size: .78rem; color: var(--gray); margin-top: .3rem; }
 
    /* ── STICKY SOCIAL SHARE ── */
    .sticky-share {
      position: sticky; top: 90px;
      display: flex; flex-direction: column;
      align-items: center; gap: .7rem;
    }
    .sticky-share .share-label {
      font-size: .65rem; letter-spacing: 1.5px;
      text-transform: uppercase; color: var(--gray-light);
      writing-mode: vertical-rl; margin-bottom: .3rem;
    }
    .share-btn {
      width: 40px; height: 40px; border-radius: 50%;
      border: 1px solid var(--border);
      display: flex; align-items: center; justify-content: center;
      color: var(--gray); font-size: .85rem;
      cursor: pointer; transition: all .2s; text-decoration: none;
      background: var(--white);
    }
    .share-btn:hover { background: var(--navy); color: var(--white); border-color: var(--navy); }
    .share-btn.gold { background: var(--gold); color: var(--navy); border-color: var(--gold); }
    .share-btn.gold:hover { background: var(--gold-light); }
    .share-divider { width: 1px; height: 30px; background: var(--border); }
 
    /* ── TAGS ── */
    .article-tags { margin: 2.5rem 0; }
    .article-tags .label {
      font-size: .75rem; letter-spacing: 1.5px; text-transform: uppercase;
      color: var(--gray); font-weight: 600; margin-bottom: .7rem;
    }
    .tag-pill {
      display: inline-block;
      background: var(--light); border: 1px solid var(--border);
      border-radius: 50px; padding: .3rem .9rem;
      font-size: .78rem; font-weight: 600; color: var(--navy);
      margin: .2rem; text-decoration: none; transition: all .2s;
    }
    .tag-pill:hover { background: var(--navy); color: var(--white); border-color: var(--navy); }
 
    /* ── AUTHOR BIO ── */
    .author-bio-card {
      background: var(--cream); border-radius: 16px;
      padding: 2rem; margin: 3rem 0;
      display: flex; gap: 1.5rem; align-items: flex-start;
    }
    .author-bio-avatar {
      width: 80px; height: 80px; border-radius: 50%;
      background: var(--navy); color: var(--gold);
      display: flex; align-items: center; justify-content: center;
      font-family: 'Playfair Display', serif;
      font-weight: 900; font-size: 1.8rem; flex-shrink: 0;
    }
    .author-bio-card h5 { font-size: 1.1rem; margin-bottom: .2rem; }
    .author-bio-card .role { color: var(--gold); font-size: .82rem; font-weight: 600; margin-bottom: .7rem; }
    .author-bio-card p { color: var(--gray); font-size: .9rem; line-height: 1.65; font-family: 'DM Sans', sans-serif; margin: 0 0 .8rem; }
    .author-social a {
      color: var(--gray); font-size: .85rem; margin-right: .7rem;
      text-decoration: none; transition: color .2s;
    }
    .author-social a:hover { color: var(--gold); }
 
    /* ── SIDEBAR ── */
    .sidebar-widget {
      background: var(--cream); border-radius: 14px;
      padding: 1.8rem; margin-bottom: 1.8rem;
    }
    .sidebar-widget h6 {
      font-family: 'DM Sans', sans-serif;
      font-size: .7rem; letter-spacing: 2px;
      text-transform: uppercase; color: var(--gold);
      font-weight: 700; margin-bottom: 1.2rem;
    }
    .toc-item {
      display: flex; align-items: flex-start; gap: .7rem;
      padding: .5rem 0; border-bottom: 1px solid var(--border);
      text-decoration: none; transition: all .2s;
    }
    .toc-item:last-child { border-bottom: none; }
    .toc-item .toc-num {
      font-family: 'Playfair Display', serif;
      font-size: .85rem; font-weight: 700; color: var(--gold);
      min-width: 20px; line-height: 1.5;
    }
    .toc-item .toc-text { color: var(--navy); font-size: .85rem; line-height: 1.45; font-weight: 500; }
    .toc-item:hover .toc-text { color: var(--gold); }
    /* Related posts */
    .related-mini {
      display: flex; gap: .9rem; align-items: flex-start;
      padding: .8rem 0; border-bottom: 1px solid var(--border);
      text-decoration: none;
    }
    .related-mini:last-child { border-bottom: none; }
    .related-thumb {
      width: 56px; height: 56px; border-radius: 8px;
      background: linear-gradient(135deg, var(--navy-soft) 0%, var(--navy) 100%);
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .related-thumb i { color: rgba(201,168,76,.5); font-size: 1.1rem; }
    .related-mini .rtitle { color: var(--navy); font-size: .85rem; font-weight: 600; line-height: 1.35; margin-bottom: .2rem; transition: color .2s; }
    .related-mini:hover .rtitle { color: var(--gold); }
    .related-mini .rmeta { color: var(--gray-light); font-size: .72rem; }
    /* CTA widget */
    .cta-widget {
      background: var(--navy); border-radius: 14px;
      padding: 1.8rem; margin-bottom: 1.8rem; text-align: center;
    }
    .cta-widget .icon-wrap {
      width: 56px; height: 56px; border-radius: 50%;
      background: rgba(201,168,76,.15);
      display: flex; align-items: center; justify-content: center;
      margin: 0 auto 1rem;
    }
    .cta-widget .icon-wrap i { color: var(--gold); font-size: 1.3rem; }
    .cta-widget h5 { color: var(--white); font-size: 1.05rem; margin-bottom: .5rem; }
    .cta-widget p { color: rgba(255,255,255,.55); font-size: .83rem; line-height: 1.6; margin-bottom: 1.2rem; }
    .btn-gold {
      display: inline-block; background: var(--gold);
      color: var(--white); font-weight: 700;
      border: none; border-radius: 6px;
      padding: .7rem 1.5rem; font-size: .88rem;
      text-decoration: none; transition: all .2s; width: 100%;
    }
    .btn-gold:hover { background: var(--gold-light); color: var(--navy); }
 
    /* ── RELATED ARTICLES ── */
    .related-section { background: var(--cream); padding: 4rem 0; }
    .related-section .section-overline {
      font-family: 'DM Sans', sans-serif;
      font-size: .72rem; letter-spacing: 2.5px;
      text-transform: uppercase; color: var(--gold);
      font-weight: 600; margin-bottom: .5rem;
    }
    .related-card {
      background: var(--white); border: 1px solid var(--border);
      border-radius: 14px; overflow: hidden;
      transition: all .3s; height: 100%;
    }
    .related-card:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(10,22,40,.1); border-color: transparent; }
    .related-card-img {
      height: 160px;
      background: linear-gradient(135deg, var(--navy-soft) 0%, var(--navy) 100%);
      display: flex; align-items: center; justify-content: center;
    }
    .related-card-img i { font-size: 2.5rem; color: rgba(201,168,76,.35); }
    .related-card-body { padding: 1.3rem; }
    .related-card-body .tag-badge { margin-bottom: .7rem; font-size: .67rem; }
    .related-card-body h5 { font-size: 1rem; line-height: 1.35; margin-bottom: .6rem; color: var(--navy); transition: color .2s; }
    .related-card:hover .related-card-body h5 { color: var(--gold); }
    .related-card-body .rmeta2 { font-size: .75rem; color: var(--gray); }
 
    /* ── NEWSLETTER BANNER ── */
    .newsletter-banner {
      background: linear-gradient(135deg, var(--navy) 0%, var(--navy-soft) 100%);
      padding: 4rem 0;
    }
    .newsletter-banner h2 { color: var(--white); font-size: clamp(1.5rem, 3vw, 2.2rem); margin-bottom: .6rem; }
    .newsletter-banner p { color: rgba(255,255,255,.6); font-size: .95rem; margin-bottom: 0; }
    .newsletter-form {
      display: flex; gap: .7rem; flex-wrap: wrap;
      margin-top: 1.5rem;
    }
    .newsletter-form input {
      flex: 1; min-width: 220px;
      background: rgba(255,255,255,.1);
      border: 1px solid rgba(255,255,255,.2);
      border-radius: 7px; color: var(--white);
      padding: .75rem 1rem; font-size: .9rem;
      font-family: 'DM Sans', sans-serif; outline: none;
      transition: border-color .2s;
    }
    .newsletter-form input::placeholder { color: rgba(255,255,255,.4); }
    .newsletter-form input:focus { border-color: var(--gold); }
    .newsletter-form button {
      background: var(--gold); border: none;
      border-radius: 7px; color: var(--navy);
      font-weight: 700; padding: .75rem 1.8rem;
      font-size: .9rem; cursor: pointer; transition: background .2s;
    }
    .newsletter-form button:hover { background: var(--gold-light); }
 
    

    /* ── PAGE HERO ── */
    .contact-hero {
      background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 55%, var(--navy-soft) 100%);
      padding: 5rem 0 4rem;
      position: relative; overflow: hidden;
      text-align: center;
    }
    .contact-hero::before {
      content: '';
      position: absolute; top: -100px; left: 50%;
      transform: translateX(-50%);
      width: 600px; height: 600px; border-radius: 50%;
      background: radial-gradient(circle, rgba(201,168,76,.1) 0%, transparent 70%);
      pointer-events: none;
    }
    .contact-hero .overline {
      font-family: 'DM Sans', sans-serif;
      font-size: .72rem; letter-spacing: 2.5px;
      text-transform: uppercase; color: var(--gold);
      font-weight: 600; margin-bottom: .6rem;
    }
    .contact-hero h1 {
      font-size: clamp(2rem, 4.5vw, 3.2rem);
      color: var(--white); line-height: 1.2; margin-bottom: 1rem;
    }
    .contact-hero p {
      color: rgba(255,255,255,.65); font-size: 1.05rem;
      line-height: 1.7; max-width: 500px; margin: 0 auto;
    }

    /* ── QUICK CONTACT CARDS ── */
    .quick-cards { margin-top: -50px; position: relative; z-index: 10; }
    .quick-card {
      background: var(--white);
      border-radius: 16px;
      padding: 1.8rem 1.5rem;
      text-align: center;
      box-shadow: 0 8px 32px rgba(10,22,40,.12);
      border-top: 3px solid transparent;
      transition: all .3s;
      height: 100%;
    }
    .quick-card:hover { transform: translateY(-4px); border-color: var(--gold); box-shadow: 0 16px 48px rgba(10,22,40,.15); }
    .quick-card .icon-wrap {
      width: 56px; height: 56px; border-radius: 14px;
      background: rgba(201,168,76,.1);
      display: flex; align-items: center; justify-content: center;
      margin: 0 auto 1rem;
    }
    .quick-card .icon-wrap i { color: var(--gold); font-size: 1.3rem; }
    .quick-card h5 { font-size: 1rem; margin-bottom: .4rem; color: var(--navy); }
    .quick-card p { color: var(--gray); font-size: .85rem; line-height: 1.55; margin-bottom: .8rem; }
    .quick-card a {
      color: var(--gold); font-weight: 700; font-size: .88rem;
      text-decoration: none; transition: color .2s;
    }
    .quick-card a:hover { color: var(--navy); }

    /* ── MAIN SECTION ── */
    .contact-main { padding: 5rem 0; background: var(--cream); }

    /* ── FORM CARD ── */
    .form-card {
      background: var(--white);
      border-radius: 20px;
      padding: 3rem;
      box-shadow: 0 4px 24px rgba(10,22,40,.07);
    }
    .form-card .section-overline {
      font-family: 'DM Sans', sans-serif;
      font-size: .72rem; letter-spacing: 2.5px;
      text-transform: uppercase; color: var(--gold);
      font-weight: 600; margin-bottom: .5rem;
    }
    .form-card h2 { font-size: 1.9rem; color: var(--navy); margin-bottom: .6rem; }
    .form-card .subtitle { color: var(--gray); font-size: .92rem; line-height: 1.65; margin-bottom: 2rem; }
    .accent-line { width: 44px; height: 3px; background: var(--gold); border-radius: 2px; margin-bottom: 1.8rem; }

    /* Form fields */
    .form-label {
      font-size: .82rem; font-weight: 600; color: var(--navy);
      margin-bottom: .4rem; letter-spacing: .2px;
    }
    .form-label .req { color: var(--gold); margin-left: 2px; }
    .form-control, .form-select {
      border: 1.5px solid var(--border);
      border-radius: 8px;
      padding: .75rem 1rem;
      font-size: .92rem;
      font-family: 'DM Sans', sans-serif;
      color: var(--text);
      background: var(--white);
      transition: border-color .2s, box-shadow .2s;
      outline: none;
    }
    .form-control:focus, .form-select:focus {
      border-color: var(--gold);
      box-shadow: 0 0 0 3px rgba(201,168,76,.12);
    }
    .form-control::placeholder { color: var(--gray-light); }
    .form-control.is-invalid { border-color: var(--error); }
    .form-control.is-valid { border-color: var(--success); }
    .invalid-feedback { font-size: .78rem; color: var(--error); margin-top: .3rem; }
    textarea.form-control { resize: vertical; min-height: 130px; }

    /* Service checkboxes */
    .service-checks { display: flex; flex-wrap: wrap; gap: .6rem; }
    .service-check-item input { display: none; }
    .service-check-item label {
      display: inline-flex; align-items: center; gap: .5rem;
      background: var(--light); border: 1.5px solid var(--border);
      border-radius: 50px; padding: .4rem 1rem;
      font-size: .82rem; font-weight: 600; color: var(--navy);
      cursor: pointer; transition: all .2s; user-select: none;
    }
    .service-check-item label:hover { border-color: var(--gold); color: var(--gold); }
    .service-check-item input:checked + label {
      background: var(--navy); color: var(--white); border-color: var(--navy);
    }
    .service-check-item label i { font-size: .75rem; }

    /* Budget range slider */
    .budget-range {
      display: flex; gap: .6rem; flex-wrap: wrap;
    }
    .budget-option input { display: none; }
    .budget-option label {
      display: inline-block;
      background: var(--light); border: 1.5px solid var(--border);
      border-radius: 8px; padding: .5rem 1rem;
      font-size: .82rem; font-weight: 600; color: var(--navy);
      cursor: pointer; transition: all .2s;
    }
    .budget-option label:hover { border-color: var(--gold); }
    .budget-option input:checked + label {
      background: var(--gold); color: var(--navy); border-color: var(--gold);
    }

    /* Submit button */
    .btn-submit {
      width: 100%; background: var(--navy);
      color: var(--white); font-weight: 700;
      border: none; border-radius: 10px;
      padding: 1rem; font-size: 1rem;
      letter-spacing: .3px; cursor: pointer;
      transition: all .25s; position: relative;
      overflow: hidden; font-family: 'DM Sans', sans-serif;
    }
    .btn-submit:hover { background: var(--navy-soft); transform: translateY(-1px); box-shadow: 0 8px 24px rgba(10,22,40,.25); }
    .btn-submit:active { transform: translateY(0); }
    .btn-submit .spinner {
      display: none; width: 18px; height: 18px;
      border: 2px solid rgba(255,255,255,.3);
      border-top-color: var(--white);
      border-radius: 50%;
      animation: spin .7s linear infinite;
      margin: 0 auto;
    }
    @keyframes spin { to { transform: rotate(360deg); } }

    /* Privacy note */
    .privacy-note {
      display: flex; align-items: flex-start; gap: .6rem;
      background: var(--cream); border-radius: 8px;
      padding: .9rem 1rem; margin-top: 1rem;
    }
    .privacy-note i { color: var(--gold); font-size: .85rem; margin-top: 2px; flex-shrink: 0; }
    .privacy-note p { font-size: .78rem; color: var(--gray); line-height: 1.5; margin: 0; }

    /* Success state */
    .success-state {
      display: none; text-align: center; padding: 3rem 2rem;
    }
    .success-state .check-circle {
      width: 80px; height: 80px; border-radius: 50%;
      background: rgba(16,185,129,.1); border: 2px solid var(--success);
      display: flex; align-items: center; justify-content: center;
      margin: 0 auto 1.5rem;
      animation: popIn .4s cubic-bezier(.34,1.56,.64,1);
    }
    @keyframes popIn { from { transform: scale(0); opacity: 0; } to { transform: scale(1); opacity: 1; } }
    .success-state .check-circle i { font-size: 2rem; color: var(--success); }
    .success-state h3 { color: var(--navy); margin-bottom: .6rem; }
    .success-state p { color: var(--gray); font-size: .95rem; line-height: 1.7; }

    /* ── SIDEBAR INFO ── */
    .info-card {
      background: var(--navy);
      border-radius: 20px; padding: 2.5rem;
      color: var(--white); margin-bottom: 1.5rem;
    }
    .info-card .section-overline {
      font-family: 'DM Sans', sans-serif;
      font-size: .7rem; letter-spacing: 2.5px;
      text-transform: uppercase; color: var(--gold);
      font-weight: 600; margin-bottom: .5rem;
    }
    .info-card h3 { font-size: 1.5rem; color: var(--white); margin-bottom: 1.4rem; }
    .info-row {
      display: flex; gap: 1rem; align-items: flex-start;
      padding: 1rem 0; border-bottom: 1px solid rgba(255,255,255,.08);
    }
    .info-row:last-child { border-bottom: none; padding-bottom: 0; }
    .info-icon {
      width: 40px; height: 40px; border-radius: 10px;
      background: rgba(201,168,76,.15);
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .info-icon i { color: var(--gold); font-size: .9rem; }
    .info-row .label { color: rgba(255,255,255,.45); font-size: .72rem; text-transform: uppercase; letter-spacing: 1px; margin-bottom: .2rem; }
    .info-row .value { color: var(--white); font-size: .92rem; font-weight: 500; }
    .info-row a { color: var(--gold); text-decoration: none; font-weight: 500; }

    /* Hours */
    .hours-card {
      background: var(--white); border-radius: 16px;
      padding: 1.8rem; margin-bottom: 1.5rem;
      border: 1px solid var(--border);
    }
    .hours-card h6 {
      font-family: 'DM Sans', sans-serif;
      font-size: .7rem; letter-spacing: 2px;
      text-transform: uppercase; color: var(--gold);
      font-weight: 700; margin-bottom: 1.2rem;
    }
    .hours-row {
      display: flex; justify-content: space-between;
      align-items: center; padding: .55rem 0;
      border-bottom: 1px solid var(--border);
      font-size: .88rem;
    }
    .hours-row:last-child { border-bottom: none; }
    .hours-row .day { color: var(--navy); font-weight: 500; }
    .hours-row .time { color: var(--gray); }
    .hours-row .badge-open {
      background: rgba(16,185,129,.1); color: var(--success);
      border-radius: 50px; padding: .15rem .6rem;
      font-size: .68rem; font-weight: 700; letter-spacing: .5px;
    }
    .hours-row .badge-closed {
      background: var(--light); color: var(--gray-light);
      border-radius: 50px; padding: .15rem .6rem;
      font-size: .68rem; font-weight: 700; letter-spacing: .5px;
    }

    /* Social */
    .social-card {
      background: var(--cream); border-radius: 16px;
      padding: 1.8rem; margin-bottom: 1.5rem;
    }
    .social-card h6 {
      font-family: 'DM Sans', sans-serif;
      font-size: .7rem; letter-spacing: 2px;
      text-transform: uppercase; color: var(--gold);
      font-weight: 700; margin-bottom: 1.2rem;
    }
    .social-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }
    .social-btn {
      display: flex; align-items: center; gap: .65rem;
      background: var(--white); border: 1px solid var(--border);
      border-radius: 10px; padding: .7rem .9rem;
      text-decoration: none; transition: all .2s;
    }
    .social-btn:hover { border-color: var(--gold); transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,.06); }
    .social-btn i { font-size: .95rem; width: 18px; text-align: center; }
    .social-btn .sname { font-size: .82rem; font-weight: 600; color: var(--navy); }
    .social-btn .sfollowers { font-size: .7rem; color: var(--gray); }
    .li  { color: #0077b5; }
    .tw  { color: #1da1f2; }
    .fb  { color: #1877f2; }
    .ig  { color: #e1306c; }

    /* ── MAP ── */
    .map-section { padding: 4rem 0; background: var(--white); }
    .map-section .section-overline {
      font-family: 'DM Sans', sans-serif;
      font-size: .72rem; letter-spacing: 2.5px;
      text-transform: uppercase; color: var(--gold);
      font-weight: 600; margin-bottom: .5rem;
    }
    .map-placeholder {
      height: 400px; border-radius: 18px; overflow: hidden;
      background: linear-gradient(135deg, var(--navy) 0%, var(--navy-soft) 100%);
      display: flex; flex-direction: column;
      align-items: center; justify-content: center;
      position: relative; border: 1px solid var(--border);
    }
    .map-placeholder i { font-size: 3.5rem; color: rgba(201,168,76,.4); margin-bottom: 1rem; }
    .map-placeholder h5 { color: var(--white); margin-bottom: .4rem; }
    .map-placeholder p { color: rgba(255,255,255,.5); font-size: .88rem; }
    .map-pin {
      position: absolute; top: 40%; left: 50%;
      transform: translate(-50%, -50%);
      animation: bounce 1.8s ease-in-out infinite;
    }
    .map-pin i { font-size: 2.5rem; color: var(--gold); filter: drop-shadow(0 4px 8px rgba(0,0,0,.4)); }
    @keyframes bounce { 0%,100% { transform: translate(-50%, -50%); } 50% { transform: translate(-50%, -70%); } }

    /* Location cards */
    .location-card {
      background: var(--cream); border-radius: 14px;
      padding: 1.5rem; border: 1px solid var(--border);
      transition: all .25s; cursor: pointer; height: 100%;
    }
    .location-card:hover { border-color: var(--gold); background: var(--white); box-shadow: 0 6px 20px rgba(10,22,40,.08); }
    .location-card .city {
      font-family: 'Playfair Display', serif;
      font-size: 1.1rem; color: var(--navy); margin-bottom: .3rem;
    }
    .location-card .addr { color: var(--gray); font-size: .82rem; line-height: 1.5; margin-bottom: .7rem; }
    .location-card .phone { color: var(--gold); font-size: .82rem; font-weight: 600; text-decoration: none; }
    .hq-badge {
      display: inline-block;
      background: var(--gold); color: var(--navy);
      font-size: .65rem; font-weight: 700; letter-spacing: 1px;
      text-transform: uppercase; border-radius: 50px;
      padding: .15rem .6rem; margin-bottom: .5rem;
    }

    /* ── FAQ ── */
    .faq-section { padding: 4rem 0; background: var(--cream); }
    .faq-section .section-overline {
      font-family: 'DM Sans', sans-serif;
      font-size: .72rem; letter-spacing: 2.5px;
      text-transform: uppercase; color: var(--gold);
      font-weight: 600; margin-bottom: .5rem;
    }
    .accordion-item {
      background: var(--white) !important;
      border: 1px solid var(--border) !important;
      border-radius: 12px !important;
      margin-bottom: .75rem; overflow: hidden;
    }
    .accordion-button {
      font-family: 'DM Sans', sans-serif !important;
      font-weight: 600 !important; font-size: .95rem !important;
      color: var(--navy) !important;
      background: var(--white) !important;
      box-shadow: none !important; padding: 1.2rem 1.4rem !important;
    }
    .accordion-button:not(.collapsed) { color: var(--gold) !important; }
    .accordion-button::after { filter: invert(0); }
    .accordion-body {
      color: var(--gray); font-size: .9rem; line-height: 1.7;
      padding: 0 1.4rem 1.2rem !important;
    }

    /* ── CTA STRIP ── */
    .cta-strip {
      background: linear-gradient(135deg, var(--gold) 0%, #b8922e 100%);
      padding: 3.5rem 0; text-align: center;
    }
    .cta-strip h2 { font-size: clamp(1.6rem, 3.5vw, 2.4rem); color: var(--navy); margin-bottom: .7rem; }
    .cta-strip p { color: rgba(10,22,40,.65); font-size: .98rem; max-width: 500px; margin: 0 auto 1.8rem; }
    .btn-navy {
      background: var(--navy); color: var(--white);
      font-weight: 700; border: none; border-radius: 8px;
      padding: .9rem 2.2rem; font-size: .95rem;
      text-decoration: none; display: inline-block;
      transition: all .2s;
    }
    .btn-navy:hover { background: var(--navy-mid); color: var(--white); transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,.18); }

    .delay-1 { transition-delay: .1s; }
    .delay-2 { transition-delay: .2s; }
    .delay-3 { transition-delay: .3s; }

    @media (max-width: 767px) {
      .form-card { padding: 2rem 1.5rem; }
      .social-grid { grid-template-columns: 1fr; }
    }

    /* Hero stats strip */
    .hero-stats-strip {
      background: rgba(255,255,255,.05); border-top: 1px solid rgba(255,255,255,.1);
      backdrop-filter: blur(4px); position: relative; z-index: 2;
    }
    .hero-stat { text-align: center; padding: 1.4rem .5rem; }
    .hero-stat .num {
      font-family: 'Playfair Display', serif;
      font-size: 1.9rem; font-weight: 900; color: var(--gold); line-height: 1;
    }
    .hero-stat .lbl { font-size: .72rem; color: rgba(255,255,255,.5); text-transform: uppercase; letter-spacing: 1px; margin-top: .2rem; }
    .stat-vline { width: 1px; background: rgba(255,255,255,.1); height: 40px; align-self: center; }

    /* ── SERVICE NAV TABS ── */
    .service-tabs-bar {
      background: var(--white); border-bottom: 2px solid var(--border);
      position: sticky; top: 0; z-index: 100;
      box-shadow: 0 2px 12px rgba(10,22,40,.06);
    }
    .service-tabs-bar .nav { gap: 0; overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; }
    .service-tabs-bar .nav::-webkit-scrollbar { display: none; }
    .service-tabs-bar .nav-link {
      white-space: nowrap;
      font-size: .82rem; font-weight: 600; color: var(--gray);
      padding: 1.1rem 1.4rem; border-radius: 0;
      border-bottom: 3px solid transparent;
      transition: all .2s; letter-spacing: .3px;
      display: flex; align-items: center; gap: .45rem;
    }
    .service-tabs-bar .nav-link i { font-size: .8rem; }
    .service-tabs-bar .nav-link:hover { color: var(--navy); background: var(--cream); }
    .service-tabs-bar .nav-link.active {
      color: var(--gold); border-bottom-color: var(--gold); background: transparent;
    }

    /* ── SERVICE SECTIONS ── */
    .service-section { padding: 5.5rem 0; }
    .service-section:nth-child(even) { background: var(--cream); }
    .service-section:nth-child(odd)  { background: var(--white); }

    /* Visual panel */
    .service-visual {
      border-radius: 20px; overflow: hidden; position: relative;
      min-height: 420px;
      display: flex; align-items: center; justify-content: center;
    }
    .sv-bg-1 { background: linear-gradient(135deg, #0a2744 0%, #1a3a6e 100%); }
    .sv-bg-2 { background: linear-gradient(135deg, #0d2b1e 0%, #1a4a30 100%); }
    .sv-bg-3 { background: linear-gradient(135deg, #2b1a0a 0%, #4a3010 100%); }
    .sv-bg-4 { background: linear-gradient(135deg, #1a0a2b 0%, #350f55 100%); }
    .sv-bg-5 { background: linear-gradient(135deg, #0a1f2b 0%, #103a4a 100%); }
    .sv-bg-6 { background: linear-gradient(135deg, #2b0d0a 0%, #4a1810 100%); }

    .service-visual .main-visual-icon { font-size: 5rem; color: rgba(201,168,76,.2); }
    .visual-float-card {
      position: absolute; bottom: 1.5rem; left: 1.5rem;
      background: rgba(255,255,255,.1); backdrop-filter: blur(10px);
      border: 1px solid rgba(255,255,255,.15); border-radius: 12px;
      padding: .9rem 1.2rem;
    }
    .visual-float-card .vfc-num {
      font-family: 'Playfair Display', serif;
      font-size: 1.6rem; font-weight: 900; color: var(--gold); line-height: 1;
    }
    .visual-float-card .vfc-lbl { color: rgba(255,255,255,.6); font-size: .72rem; }
    .visual-icon-grid {
      position: absolute; top: 1.5rem; right: 1.5rem;
      display: flex; flex-direction: column; gap: .6rem;
    }
    .vig-item {
      background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12);
      border-radius: 8px; padding: .5rem .8rem;
      display: flex; align-items: center; gap: .5rem;
      color: rgba(255,255,255,.7); font-size: .75rem;
    }
    .vig-item i { color: var(--gold); font-size: .75rem; }

    /* Content */
    .service-content h2 { font-size: clamp(1.6rem, 3vw, 2.2rem); color: var(--navy); margin-bottom: .8rem; }
    .service-content .intro-text { color: var(--gray); font-size: .97rem; line-height: 1.75; margin-bottom: 1.8rem; }

    /* Feature list */
    .feature-list { list-style: none; padding: 0; margin: 0 0 2rem; }
    .feature-list li {
      display: flex; align-items: flex-start; gap: .8rem;
      padding: .65rem 0; border-bottom: 1px solid var(--border);
      font-size: .92rem; color: var(--text); line-height: 1.5;
    }
    .feature-list li:last-child { border-bottom: none; }
    .feature-list li .fi {
      width: 22px; height: 22px; border-radius: 50%;
      background: rgba(201,168,76,.15);
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0; margin-top: 1px;
    }
    .feature-list li .fi i { color: var(--gold); font-size: .6rem; }
    .feature-list li strong { color: var(--navy); font-weight: 600; }

    /* Outcome badges */
    .outcome-badges { display: flex; flex-wrap: wrap; gap: .6rem; margin-bottom: 2rem; }
    .outcome-badge {
      display: inline-flex; align-items: center; gap: .4rem;
      background: var(--navy); color: var(--white);
      border-radius: 8px; padding: .5rem 1rem; font-size: .8rem; font-weight: 600;
    }
    .outcome-badge i { color: var(--gold); font-size: .75rem; }

    /* Process steps inside service */
    .mini-steps { display: flex; gap: 0; margin-bottom: 2rem; position: relative; }
    .mini-steps::before {
      content: ''; position: absolute; top: 18px; left: 18px;
      width: calc(100% - 36px); height: 2px;
      background: var(--border); z-index: 0;
    }
    .mini-step { flex: 1; text-align: center; position: relative; z-index: 1; }
    .mini-step .ms-circle {
      width: 36px; height: 36px; border-radius: 50%;
      background: var(--navy); color: var(--gold);
      font-family: 'Playfair Display', serif; font-weight: 700; font-size: .9rem;
      display: flex; align-items: center; justify-content: center;
      margin: 0 auto .6rem; border: 3px solid var(--white);
      box-shadow: 0 0 0 2px var(--navy);
    }
    .mini-step .ms-label { font-size: .72rem; font-weight: 600; color: var(--gray); line-height: 1.3; }

    /* Pricing hint card */
    .pricing-hint {
      background: var(--navy); border-radius: 14px; padding: 1.8rem;
      display: flex; gap: 1.2rem; align-items: flex-start;
    }
    .pricing-hint .ph-icon {
      width: 46px; height: 46px; border-radius: 10px;
      background: rgba(201,168,76,.15);
      display: flex; align-items: center; justify-content: center; flex-shrink: 0;
    }
    .pricing-hint .ph-icon i { color: var(--gold); font-size: 1.1rem; }
    .pricing-hint h6 { color: var(--white); font-family: 'DM Sans', sans-serif; font-size: .92rem; font-weight: 700; margin-bottom: .3rem; }
    .pricing-hint p { color: rgba(255,255,255,.55); font-size: .83rem; line-height: 1.6; margin: 0; }

    /* ── COMPARISON TABLE ── */
    .comparison-section { padding: 5.5rem 0; background: var(--navy); }
    .comparison-section .section-title { color: var(--white); }
    .comparison-section .overline { color: var(--gold); }
    .comp-table { border-radius: 16px; overflow: hidden; border: 1px solid rgba(255,255,255,.1); }
    .comp-table table { width: 100%; border-collapse: collapse; }
    .comp-table thead th {
      background: rgba(255,255,255,.05); color: var(--gold);
      font-family: 'DM Sans', sans-serif; font-size: .75rem;
      font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase;
      padding: 1.1rem 1.4rem; text-align: center; border-bottom: 1px solid rgba(255,255,255,.1);
    }
    .comp-table thead th:first-child { text-align: left; }
    .comp-table tbody tr { border-bottom: 1px solid rgba(255,255,255,.06); transition: background .2s; }
    .comp-table tbody tr:last-child { border-bottom: none; }
    .comp-table tbody tr:hover { background: rgba(255,255,255,.03); }
    .comp-table tbody td { padding: 1rem 1.4rem; font-size: .88rem; text-align: center; color: rgba(255,255,255,.7); }
    .comp-table tbody td:first-child { text-align: left; color: var(--white); font-weight: 600; }
    .comp-table .yes  { color: #34d399; font-size: 1rem; }
    .comp-table .no   { color: rgba(255,255,255,.25); font-size: 1rem; }
    .comp-table .part { color: var(--gold); font-size: .8rem; font-weight: 700; }
    .col-highlight { background: rgba(201,168,76,.08) !important; }

    /* ── INDUSTRIES ── */
    .industries-section { padding: 5.5rem 0; background: var(--cream); }
    .industry-card {
      background: var(--white); border: 1px solid var(--border);
      border-radius: 14px; padding: 1.6rem;
      display: flex; flex-direction: column; align-items: flex-start;
      transition: all .3s; height: 100%; cursor: pointer;
    }
    .industry-card:hover { border-color: var(--gold); transform: translateY(-4px); box-shadow: 0 12px 32px rgba(10,22,40,.1); }
    .industry-card .ind-icon {
      width: 50px; height: 50px; border-radius: 12px;
      background: rgba(201,168,76,.1);
      display: flex; align-items: center; justify-content: center;
      margin-bottom: 1rem; transition: background .3s;
    }
    .industry-card:hover .ind-icon { background: var(--navy); }
    .industry-card .ind-icon i { color: var(--gold); font-size: 1.2rem; }
    .industry-card h5 { font-size: 1rem; color: var(--navy); margin-bottom: .4rem; }
    .industry-card p { color: var(--gray); font-size: .83rem; line-height: 1.6; flex: 1; margin: 0; }

    /* ── TESTIMONIALS ── */
    .testimonials-section { padding: 5.5rem 0; background: var(--white); }
    .testi-card {
      background: var(--cream); border: 1px solid var(--border);
      border-radius: 16px; padding: 2rem; height: 100%;
      position: relative; transition: all .3s;
    }
    .testi-card:hover { box-shadow: 0 12px 32px rgba(10,22,40,.08); transform: translateY(-3px); }
    .testi-card .quote-mark {
      font-family: 'Playfair Display', serif;
      font-size: 5rem; color: var(--gold); line-height: .6;
      opacity: .3; position: absolute; top: 1.5rem; right: 1.8rem;
    }
    .testi-card .stars { color: var(--gold); font-size: .8rem; margin-bottom: .8rem; }
    .testi-card p { color: var(--text); font-size: .92rem; line-height: 1.75; margin-bottom: 1.5rem; font-style: italic; }
    .testi-card .testi-author { display: flex; align-items: center; gap: .8rem; }
    .testi-avatar {
      width: 44px; height: 44px; border-radius: 50%;
      background: var(--navy); color: var(--gold);
      display: flex; align-items: center; justify-content: center;
      font-family: 'Playfair Display', serif; font-weight: 700; font-size: 1rem; flex-shrink: 0;
    }
    .testi-card .name { color: var(--navy); font-weight: 700; font-size: .9rem; }
    .testi-card .role { color: var(--gray); font-size: .75rem; }
    .service-tag {
      display: inline-block; background: rgba(201,168,76,.15);
      color: var(--gold); border-radius: 50px; padding: .15rem .7rem;
      font-size: .68rem; font-weight: 700; letter-spacing: .8px;
      text-transform: uppercase; margin-top: .3rem;
    }

    /* ── PRICING SECTION ── */
    .pricing-section { padding: 5.5rem 0; background: var(--cream); }
    .pricing-card {
      background: var(--white); border: 2px solid var(--border);
      border-radius: 20px; padding: 2.5rem 2rem;
      height: 100%; transition: all .3s; position: relative;
    }
    .pricing-card:hover { border-color: var(--gold); box-shadow: 0 16px 48px rgba(10,22,40,.1); transform: translateY(-4px); }
    .pricing-card.popular {
      border-color: var(--gold); background: var(--navy);
      transform: translateY(-8px);
    }
    .pricing-card.popular:hover { transform: translateY(-12px); box-shadow: 0 24px 56px rgba(10,22,40,.25); }
    .popular-tag {
      position: absolute; top: -14px; left: 50%;
      transform: translateX(-50%);
      background: var(--gold); color: var(--navy);
      font-size: .68rem; font-weight: 800; letter-spacing: 1.5px;
      text-transform: uppercase; border-radius: 50px; padding: .3rem 1rem;
      white-space: nowrap;
    }
    .pricing-card .plan-name {
      font-family: 'DM Sans', sans-serif; font-size: .78rem;
      font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
      color: var(--gold); margin-bottom: .5rem;
    }
    .pricing-card h3 { font-size: 1.4rem; color: var(--navy); margin-bottom: .3rem; }
    .pricing-card.popular h3 { color: var(--white); }
    .pricing-card .price {
      font-family: 'Playfair Display', serif;
      font-size: 2.8rem; font-weight: 900; color: var(--navy); line-height: 1;
      margin: 1rem 0 .3rem;
    }
    .pricing-card.popular .price { color: var(--white); }
    .pricing-card .price-note { color: var(--gray); font-size: .8rem; margin-bottom: 1.5rem; }
    .pricing-card.popular .price-note { color: rgba(255,255,255,.45); }
    .pricing-card .plan-desc { font-size: .88rem; color: var(--gray); line-height: 1.6; margin-bottom: 1.5rem; }
    .pricing-card.popular .plan-desc { color: rgba(255,255,255,.6); }
    .pricing-divider { height: 1px; background: var(--border); margin: 1.2rem 0; }
    .pricing-card.popular .pricing-divider { background: rgba(255,255,255,.1); }
    .plan-features { list-style: none; padding: 0; margin: 0 0 2rem; }
    .plan-features li {
      display: flex; align-items: flex-start; gap: .7rem;
      font-size: .87rem; padding: .45rem 0;
      color: var(--text);
    }
    .pricing-card.popular .plan-features li { color: rgba(255,255,255,.75); }
    .plan-features li i { color: var(--gold); font-size: .75rem; margin-top: 3px; flex-shrink: 0; }
    .plan-features li.dim { opacity: .4; }
    .plan-features li.dim i { color: var(--gray); }
    .btn-plan {
      width: 100%; display: block; text-align: center;
      font-weight: 700; font-size: .92rem; border-radius: 9px;
      padding: .85rem; text-decoration: none; transition: all .2s;
    }
    .btn-plan-outline {
      border: 2px solid var(--navy); color: var(--navy); background: transparent;
    }
    .btn-plan-outline:hover { background: var(--navy); color: var(--white); }
    .btn-plan-gold { background: var(--gold); color: var(--navy); border: none; }
    .btn-plan-gold:hover { background: var(--gold-light); color: var(--navy); transform: translateY(-1px); }
    .btn-plan-white { background: var(--white); color: var(--navy); border: none; }
    .btn-plan-white:hover { background: var(--gold); color: var(--navy); }

    
    /* ─────────────────────────────────────
       HERO
    ───────────────────────────────────── */
    .team-hero {
      background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 60%, var(--navy-soft) 100%);
      padding: 6rem 0 5rem; position: relative; overflow: hidden; text-align: center;
    }
    .team-hero::before {
      content: ''; position: absolute; top: -160px; left: 50%;
      transform: translateX(-50%);
      width: 700px; height: 700px; border-radius: 50%;
      background: radial-gradient(circle, rgba(201,168,76,.1) 0%, transparent 65%);
      pointer-events: none;
    }
    /* Floating avatar ring */
    .hero-avatar-ring {
      display: flex; justify-content: center; align-items: center;
      gap: -12px; margin-bottom: 2rem; position: relative; z-index: 2;
    }
    .har-item {
      width: 52px; height: 52px; border-radius: 50%;
      border: 3px solid var(--navy-mid);
      background: var(--navy-soft);
      display: flex; align-items: center; justify-content: center;
      font-family: 'Playfair Display', serif; font-weight: 700;
      color: var(--gold); font-size: .95rem;
      margin-left: -10px; position: relative;
      transition: transform .2s;
    }
    .har-item:first-child { margin-left: 0; }
    .har-item:hover { transform: translateY(-6px) scale(1.1); z-index: 10; }
    .har-count {
      width: 52px; height: 52px; border-radius: 50%;
      background: var(--gold); color: var(--navy);
      font-weight: 800; font-size: .8rem; letter-spacing: .5px;
      display: flex; align-items: center; justify-content: center;
      margin-left: -10px; border: 3px solid var(--navy-mid);
    }
    .team-hero .hero-badge {
      display: inline-flex; align-items: center; gap: .5rem;
      background: rgba(201,168,76,.15); color: var(--gold);
      border: 1px solid rgba(201,168,76,.3); border-radius: 50px;
      padding: .3rem 1.1rem; font-size: .72rem; font-weight: 700;
      letter-spacing: 1.5px; text-transform: uppercase; margin-bottom: 1.3rem;
    }
    .team-hero h1 {
      font-size: clamp(2.2rem, 5vw, 3.8rem); color: var(--white);
      line-height: 1.15; margin-bottom: 1.1rem;
    }
    .team-hero h1 em { color: var(--gold); font-style: normal; }
    .team-hero .lead {
      color: rgba(255,255,255,.65); font-size: 1.05rem;
      line-height: 1.75; max-width: 560px; margin: 0 auto 2.5rem;
    }
    /* Hero stats row */
    .hero-stats {
      display: flex; justify-content: center; flex-wrap: wrap; gap: 0;
      background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1);
      border-radius: 16px; max-width: 700px; margin: 0 auto;
      backdrop-filter: blur(4px); overflow: hidden;
    }
    .hs-item {
      flex: 1; min-width: 130px; padding: 1.4rem 1rem; text-align: center;
      border-right: 1px solid rgba(255,255,255,.08);
      transition: background .2s;
    }
    .hs-item:last-child { border-right: none; }
    .hs-item:hover { background: rgba(255,255,255,.05); }
    .hs-item .num {
      font-family: 'Playfair Display', serif;
      font-size: 1.8rem; font-weight: 900; color: var(--gold); line-height: 1;
    }
    .hs-item .lbl { font-size: .7rem; color: rgba(255,255,255,.45); text-transform: uppercase; letter-spacing: 1px; margin-top: .3rem; }

    /* ─────────────────────────────────────
       FILTER BAR
    ───────────────────────────────────── */
    .filter-bar {
      background: var(--cream); border-bottom: 1px solid var(--border);
      padding: 1.2rem 0; position: sticky; top: 0; z-index: 100;
      box-shadow: 0 2px 12px rgba(10,22,40,.05);
    }
    .filter-bar .inner {
      display: flex; align-items: center; gap: 1rem; flex-wrap: wrap;
    }
    .filter-label { font-size: .75rem; font-weight: 700; color: var(--gray); letter-spacing: 1px; text-transform: uppercase; white-space: nowrap; }
    .filter-pills { display: flex; gap: .5rem; flex-wrap: wrap; flex: 1; }
    .fpill {
      display: inline-flex; align-items: center; gap: .4rem;
      background: var(--white); border: 1.5px solid var(--border);
      border-radius: 50px; padding: .38rem 1rem;
      font-size: .8rem; font-weight: 600; color: var(--navy);
      cursor: pointer; transition: all .2s; user-select: none;
    }
    .fpill:hover { border-color: var(--gold); color: var(--gold); }
    .fpill.active { background: var(--navy); color: var(--white); border-color: var(--navy); }
    .search-box {
      display: flex; align-items: center; gap: .5rem;
      background: var(--white); border: 1.5px solid var(--border);
      border-radius: 50px; padding: .38rem 1rem;
      transition: border-color .2s; flex-shrink: 0;
    }
    .search-box:focus-within { border-color: var(--gold); }
    .search-box i { color: var(--gray-light); font-size: .82rem; }
    .search-box input { border: none; outline: none; background: transparent; font-size: .82rem; font-family: 'DM Sans', sans-serif; color: var(--navy); width: 160px; }
    .search-box input::placeholder { color: var(--gray-light); }

    /* ─────────────────────────────────────
       LEADERSHIP SPOTLIGHT
    ───────────────────────────────────── */
    .leadership-section { padding: 5.5rem 0; background: var(--white); }

    .leader-card {
      background: var(--white); border: 1px solid var(--border);
      border-radius: 20px; overflow: hidden; height: 100%;
      transition: all .35s; position: relative;
    }
    .leader-card:hover { transform: translateY(-6px); box-shadow: 0 20px 52px rgba(10,22,40,.12); border-color: transparent; }
    /* Avatar panel */
    .lc-avatar-panel {
      height: 220px; position: relative;
      display: flex; align-items: center; justify-content: center;
    }
    .bg-1 { background: linear-gradient(135deg, #0a2744 0%, #1a3a6e 100%); }
    .bg-2 { background: linear-gradient(135deg, #0d2b1e 0%, #1a4a30 100%); }
    .bg-3 { background: linear-gradient(135deg, #2b1a0a 0%, #4a3010 100%); }
    .bg-4 { background: linear-gradient(135deg, #1a0a2b 0%, #350f55 100%); }
    .bg-5 { background: linear-gradient(135deg, #0a1f2b 0%, #103a4a 100%); }
    .bg-6 { background: linear-gradient(135deg, #2b0d0a 0%, #4a1810 100%); }
    .bg-7 { background: linear-gradient(135deg, #0f2b0a 0%, #1e4a10 100%); }
    .bg-8 { background: linear-gradient(135deg, #1f1a0a 0%, #3a3010 100%); }
    .bg-9 { background: linear-gradient(135deg, #0a1a2b 0%, #0f2f4a 100%); }
    .bg-10{ background: linear-gradient(135deg, #2b0a1a 0%, #4a1030 100%); }
    .bg-11{ background: linear-gradient(135deg, #1a2b0a 0%, #2e4a10 100%); }
    .bg-12{ background: linear-gradient(135deg, #0a2b2b 0%, #104a4a 100%); }

    .lc-initials {
      width: 90px; height: 90px; border-radius: 50%;
      background: rgba(201,168,76,.2); border: 3px solid rgba(201,168,76,.4);
      display: flex; align-items: center; justify-content: center;
      font-family: 'Playfair Display', serif; font-weight: 900;
      color: var(--gold); font-size: 1.8rem;
      box-shadow: 0 8px 24px rgba(0,0,0,.25);
    }
    .lc-avatar-panel .role-chip {
      position: absolute; bottom: 1rem; left: 50%; transform: translateX(-50%);
      background: rgba(201,168,76,.2); border: 1px solid rgba(201,168,76,.35);
      border-radius: 50px; padding: .25rem .9rem;
      color: var(--gold); font-size: .68rem; font-weight: 700;
      letter-spacing: 1px; text-transform: uppercase; white-space: nowrap;
    }
    .lc-avatar-panel .exp-badge {
      position: absolute; top: 1rem; right: 1rem;
      background: var(--gold); color: var(--navy);
      border-radius: 8px; padding: .3rem .6rem;
      font-family: 'Playfair Display', serif; font-weight: 900;
      font-size: .9rem; line-height: 1;
    }
    .lc-avatar-panel .exp-badge span { display: block; font-family: 'DM Sans', sans-serif; font-size: .58rem; font-weight: 700; letter-spacing: .5px; }
    /* Card body */
    .lc-body { padding: 1.5rem; }
    .lc-body h4 { font-size: 1.2rem; color: var(--navy); margin-bottom: .2rem; }
    .lc-body .title { color: var(--gold); font-size: .8rem; font-weight: 700; letter-spacing: .5px; margin-bottom: .7rem; }
    .lc-body .bio { color: var(--gray); font-size: .85rem; line-height: 1.65; margin-bottom: 1.1rem; }
    .lc-tags { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: 1.1rem; }
    .lc-tag {
      background: var(--light); border: 1px solid var(--border);
      border-radius: 50px; padding: .2rem .7rem;
      font-size: .72rem; font-weight: 600; color: var(--navy);
    }
    .lc-footer {
      display: flex; align-items: center; justify-content: space-between;
      padding-top: 1rem; border-top: 1px solid var(--border);
    }
    .lc-socials a {
      display: inline-flex; align-items: center; justify-content: center;
      width: 30px; height: 30px; border-radius: 50%;
      border: 1px solid var(--border); color: var(--gray);
      font-size: .72rem; text-decoration: none; transition: all .2s;
      margin-right: .3rem;
    }
    .lc-socials a:hover { background: var(--navy); color: var(--white); border-color: var(--navy); }
    .btn-profile {
      font-size: .78rem; font-weight: 700; color: var(--gold);
      text-decoration: none; letter-spacing: .3px;
      transition: gap .2s; display: inline-flex; align-items: center; gap: .4rem;
    }
    .btn-profile:hover { color: var(--navy); gap: .7rem; }

    /* ─────────────────────────────────────
       TEAM GRID (regular members)
    ───────────────────────────────────── */
    .team-grid-section { padding: 5.5rem 0; background: var(--cream); }

    .member-card {
      background: var(--white); border: 1px solid var(--border);
      border-radius: 16px; overflow: hidden; height: 100%;
      transition: all .3s;
      display: flex; flex-direction: column;
    }
    .member-card:hover { transform: translateY(-5px); box-shadow: 0 16px 40px rgba(10,22,40,.1); border-color: transparent; }
    .mc-top {
      height: 140px; position: relative;
      display: flex; align-items: center; justify-content: center;
    }
    .mc-initials {
      width: 68px; height: 68px; border-radius: 50%;
      background: rgba(201,168,76,.18); border: 2px solid rgba(201,168,76,.35);
      display: flex; align-items: center; justify-content: center;
      font-family: 'Playfair Display', serif; font-weight: 900;
      color: var(--gold); font-size: 1.3rem;
      overflow: hidden;
    }
    .mc-top .dept-chip {
      position: absolute; bottom: .7rem; left: 50%; transform: translateX(-50%);
      background: rgba(255,255,255,.15); border: 1px solid rgba(255,255,255,.2);
      border-radius: 50px; padding: .18rem .7rem;
      color: rgba(255,255,255,.8); font-size: .65rem; font-weight: 700;
      letter-spacing: 1px; text-transform: uppercase; white-space: nowrap;
    }
    .mc-body { padding: 1.2rem; flex: 1; display: flex; flex-direction: column; }
    .mc-body h5 { font-size: .98rem; color: var(--navy); margin-bottom: .15rem; }
    .mc-body .mc-role { color: var(--gold); font-size: .75rem; font-weight: 700; letter-spacing: .4px; margin-bottom: .6rem; }
    .mc-body .mc-bio { color: var(--gray); font-size: .82rem; line-height: 1.6; flex: 1; margin-bottom: .9rem; }
    .mc-footer {
      display: flex; align-items: center; justify-content: space-between;
      padding-top: .8rem; border-top: 1px solid var(--border);
    }
    .mc-footer .mc-loc { font-size: .72rem; color: var(--gray-light); display: flex; align-items: center; gap: .3rem; }
    .mc-footer .mc-loc i { color: var(--gold); font-size: .65rem; }
    .mc-socials a {
      display: inline-flex; align-items: center; justify-content: center;
      width: 26px; height: 26px; border-radius: 50%;
      border: 1px solid var(--border); color: var(--gray-light);
      font-size: .65rem; text-decoration: none; transition: all .2s; margin-left: .2rem;
    }
    .mc-socials a:hover { background: var(--navy); color: var(--white); border-color: var(--navy); }

    /* ─────────────────────────────────────
       FEATURED MEMBER MODAL-STYLE OVERLAY
    ───────────────────────────────────── */
    .profile-overlay {
      position: fixed; inset: 0; z-index: 1000;
      background: rgba(10,22,40,.85); backdrop-filter: blur(6px);
      display: none; align-items: center; justify-content: center; padding: 1.5rem;
    }
    .profile-overlay.open { display: flex; animation: fadeIn .25s ease; }
    @keyframes fadeIn { from{opacity:0} to{opacity:1} }
    .profile-modal {
      background: var(--white); border-radius: 22px; overflow: hidden;
      max-width: 720px; width: 100%; max-height: 90vh; overflow-y: auto;
      animation: slideUp .3s cubic-bezier(.34,1.56,.64,1);
    }
    @keyframes slideUp { from{transform:translateY(40px);opacity:0} to{transform:translateY(0);opacity:1} }
    .pm-header {
      height: 180px; position: relative;
      display: flex; align-items: center; justify-content: center;
    }
    .pm-close {
      position: absolute; top: 1rem; right: 1rem;
      width: 36px; height: 36px; border-radius: 50%;
      background: rgba(255,255,255,.15); border: none; cursor: pointer;
      color: var(--white); font-size: .9rem; display: flex; align-items: center; justify-content: center;
      transition: background .2s;
    }
    .pm-close:hover { background: rgba(255,255,255,.3); }
    .pm-avatar {
      width: 110px; height: 110px; border-radius: 50%;
      background: rgba(201,168,76,.2); border: 4px solid rgba(201,168,76,.5);
      display: flex; align-items: center; justify-content: center;
      font-family: 'Playfair Display', serif; font-weight: 900;
      color: var(--gold); font-size: 2.2rem;
      box-shadow: 0 12px 32px rgba(0,0,0,.3);
      position: relative; z-index: 2;
    }
    .pm-body { padding: 2rem 2.5rem; }
    .pm-body .pm-name { font-size: 1.8rem; color: var(--navy); margin-bottom: .2rem; }
    .pm-body .pm-title { color: var(--gold); font-size: .9rem; font-weight: 700; letter-spacing: .5px; margin-bottom: 1rem; }
    .pm-stats {
      display: flex; gap: 1.5rem; flex-wrap: wrap;
      padding: 1.2rem; background: var(--cream); border-radius: 12px; margin-bottom: 1.5rem;
    }
    .pm-stat .pm-num { font-family: 'Playfair Display', serif; font-size: 1.5rem; font-weight: 900; color: var(--navy); line-height: 1; }
    .pm-stat .pm-lbl { font-size: .7rem; color: var(--gray); text-transform: uppercase; letter-spacing: .8px; margin-top: .2rem; }
    .pm-body .pm-bio { color: var(--gray); font-size: .93rem; line-height: 1.75; margin-bottom: 1.4rem; }
    .pm-body h6 { font-family: 'DM Sans', sans-serif; font-size: .7rem; letter-spacing: 2px; text-transform: uppercase; color: var(--gold); font-weight: 700; margin-bottom: .8rem; }
    .pm-expertise { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.4rem; }
    .pm-exp-tag {
      background: var(--navy); color: var(--white);
      border-radius: 8px; padding: .35rem .9rem;
      font-size: .78rem; font-weight: 600;
    }
    .pm-socials { display: flex; gap: .6rem; }
    .pm-social-btn {
      display: inline-flex; align-items: center; gap: .5rem;
      background: var(--light); border: 1px solid var(--border);
      border-radius: 8px; padding: .5rem 1rem;
      font-size: .8rem; font-weight: 600; color: var(--navy);
      text-decoration: none; transition: all .2s;
    }
    .pm-social-btn:hover { background: var(--navy); color: var(--white); border-color: var(--navy); }
    .pm-social-btn i { font-size: .82rem; }
    .btn-consult {
      display: inline-flex; align-items: center; gap: .5rem;
      background: var(--gold); color: var(--navy); font-weight: 700;
      border: none; border-radius: 8px; padding: .75rem 1.8rem;
      font-size: .9rem; text-decoration: none; transition: all .2s; cursor: pointer;
    }
    .btn-consult:hover { background: var(--gold-light); color: var(--navy); }

    /* ─────────────────────────────────────
       CULTURE SECTION
    ───────────────────────────────────── */
    .culture-section { padding: 5.5rem 0; background: var(--navy); }
    .culture-section .section-title { color: var(--white); }
    .culture-section .overline { color: var(--gold); }
    .culture-card {
      background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1);
      border-radius: 16px; padding: 2rem; height: 100%; transition: all .3s;
    }
    .culture-card:hover { background: rgba(255,255,255,.1); transform: translateY(-4px); }
    .culture-card .cc-icon {
      width: 54px; height: 54px; border-radius: 12px;
      background: rgba(201,168,76,.15);
      display: flex; align-items: center; justify-content: center;
      margin-bottom: 1.2rem; transition: background .3s;
    }
    .culture-card:hover .cc-icon { background: rgba(201,168,76,.25); }
    .culture-card .cc-icon i { color: var(--gold); font-size: 1.3rem; }
    .culture-card h5 { color: var(--white); font-size: 1.05rem; margin-bottom: .6rem; }
    .culture-card p { color: rgba(255,255,255,.55); font-size: .88rem; line-height: 1.7; margin: 0; }

    /* ─────────────────────────────────────
       BY THE NUMBERS
    ───────────────────────────────────── */
    .numbers-section { padding: 5rem 0; background: var(--cream); }
    .num-card {
      text-align: center; padding: 2rem 1rem;
      border-right: 1px solid var(--border);
    }
    .num-card:last-child { border-right: none; }
    .num-card .big-num {
      font-family: 'Playfair Display', serif;
      font-size: clamp(2.5rem, 5vw, 3.8rem); font-weight: 900;
      color: var(--navy); line-height: 1; margin-bottom: .3rem;
    }
    .num-card .big-num span { color: var(--gold); }
    .num-card .num-label { font-size: .78rem; color: var(--gray); text-transform: uppercase; letter-spacing: 1px; font-weight: 600; }
    .num-card .num-sub { font-size: .82rem; color: var(--gray-light); margin-top: .3rem; }

    /* ─────────────────────────────────────
       DEPARTMENTS
    ───────────────────────────────────── */
    .departments-section { padding: 5.5rem 0; background: var(--white); }
    .dept-card {
      border: 1px solid var(--border); border-radius: 14px; overflow: hidden;
      transition: all .3s; height: 100%;
    }
    .dept-card:hover { border-color: var(--gold); box-shadow: 0 10px 32px rgba(10,22,40,.08); }
    .dept-header {
      padding: 1.5rem; display: flex; align-items: center; gap: 1rem;
      border-bottom: 1px solid var(--border);
    }
    .dept-icon {
      width: 48px; height: 48px; border-radius: 12px;
      display: flex; align-items: center; justify-content: center; flex-shrink: 0;
    }
    .dept-icon i { font-size: 1.2rem; color: var(--white); }
    .di-1 { background: linear-gradient(135deg,#0a2744,#1a3a6e); }
    .di-2 { background: linear-gradient(135deg,#0d2b1e,#1a4a30); }
    .di-3 { background: linear-gradient(135deg,#2b1a0a,#4a3010); }
    .di-4 { background: linear-gradient(135deg,#1a0a2b,#350f55); }
    .di-5 { background: linear-gradient(135deg,#0a1f2b,#103a4a); }
    .di-6 { background: linear-gradient(135deg,#2b0d0a,#4a1810); }
    .dept-header h5 { font-size: 1rem; color: var(--navy); margin-bottom: .15rem; }
    .dept-header .dept-count { font-size: .75rem; color: var(--gray); }
    .dept-body { padding: 1.2rem 1.5rem; }
    .dept-member-row {
      display: flex; align-items: center; gap: .7rem;
      padding: .55rem 0; border-bottom: 1px solid var(--border);
    }
    .dept-member-row:last-child { border-bottom: none; }
    .dm-av {
      width: 32px; height: 32px; border-radius: 50%;
      background: var(--light); border: 1px solid var(--border);
      display: flex; align-items: center; justify-content: center;
      font-family: 'Playfair Display', serif; font-weight: 700;
      font-size: .72rem; color: var(--navy); flex-shrink: 0;
    }
    .dm-name { font-size: .85rem; font-weight: 600; color: var(--navy); }
    .dm-role { font-size: .75rem; color: var(--gray); }
    .dm-location { font-size: .72rem; color: var(--gray-light); margin-left: auto; display: flex; align-items: center; gap: .25rem; }
    .dm-location i { color: var(--gold); font-size: .65rem; }

    /* ─────────────────────────────────────
       CAREERS BANNER
    ───────────────────────────────────── */
    .careers-banner {
      background: linear-gradient(135deg, var(--gold) 0%, #b8922e 100%);
      padding: 5rem 0; text-align: center;
    }
    .careers-banner h2 { font-size: clamp(1.8rem, 3.5vw, 2.8rem); color: var(--navy); margin-bottom: .8rem; }
    .careers-banner p { color: rgba(10,22,40,.65); font-size: 1rem; max-width: 500px; margin: 0 auto 2rem; line-height: 1.7; }
    .btn-navy {
      display: inline-flex; align-items: center; gap: .5rem;
      background: var(--navy); color: var(--white); font-weight: 700;
      border: none; border-radius: 8px; padding: .92rem 2.2rem;
      font-size: .95rem; text-decoration: none; transition: all .2s;
    }
    .btn-navy:hover { background: var(--navy-mid); color: var(--white); transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,.18); }
    .btn-outline-navy {
      display: inline-flex; align-items: center; gap: .5rem;
      background: transparent; color: var(--navy); font-weight: 700;
      border: 2px solid rgba(10,22,40,.3); border-radius: 8px;
      padding: .9rem 2rem; font-size: .95rem;
      text-decoration: none; transition: all .2s;
    }
    .btn-outline-navy:hover { border-color: var(--navy); background: rgba(10,22,40,.08); }

    /* no-results */
    #noResults {
      display: none; text-align: center; padding: 4rem 0; grid-column: 1/-1;
    }
    #noResults i { font-size: 3rem; color: var(--border); margin-bottom: 1rem; display: block; }

    @media (max-width: 767px) {
      .num-card { border-right: none; border-bottom: 1px solid var(--border); }
      .num-card:last-child { border-bottom: none; }
      .pm-body { padding: 1.5rem; }
    }
  
    /* ════════════════════════════════════
       HERO
    ════════════════════════════════════ */
    .rec-hero {
      background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 55%, var(--navy-soft) 100%);
      padding: 6rem 0 0; position: relative; overflow: hidden;
    }
    .rec-hero::before {
      content:''; position:absolute; top:-140px; right:-100px;
      width:600px; height:600px; border-radius:50%;
      background:radial-gradient(circle,rgba(201,168,76,.11) 0%,transparent 70%);
    }
    .rec-hero::after {
      content:''; position:absolute; bottom:0; left:-80px;
      width:380px; height:380px; border-radius:50%;
      background:radial-gradient(circle,rgba(201,168,76,.06) 0%,transparent 70%);
    }
    .hero-inner { position:relative; z-index:2; padding-bottom:4rem; }
    .hero-badge {
      display:inline-flex; align-items:center; gap:.5rem;
      background:rgba(201,168,76,.15); color:var(--gold);
      border:1px solid rgba(201,168,76,.3); border-radius:50px;
      padding:.3rem 1.1rem; font-size:.72rem; font-weight:700;
      letter-spacing:1.5px; text-transform:uppercase; margin-bottom:1.3rem;
    }
    .rec-hero h1 { font-size:clamp(2.2rem,4.5vw,3.6rem); color:var(--white); line-height:1.18; margin-bottom:1.2rem; }
    .rec-hero h1 em { color:var(--gold); font-style:normal; }
    .rec-hero .lead { color:rgba(255,255,255,.65); font-size:1.08rem; line-height:1.75; max-width:540px; margin-bottom:2.2rem; }
   .btn-outline-light {
      display:inline-flex; align-items:center; gap:.5rem;
      background:transparent; color:var(--white); font-weight:600;
      border:2px solid rgba(255,255,255,.3); border-radius:7px;
      padding:.87rem 1.8rem; font-size:.95rem; text-decoration:none; transition:all .2s;
    }
    .btn-outline-light:hover { border-color:var(--gold); color:var(--gold); }

    /* Hero dual panel */
    .hero-dual {
      display:grid; grid-template-columns:1fr 1fr; gap:1rem; max-width:400px;
    }
    .hd-item {
      background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.12);
      border-radius:14px; padding:1.4rem 1.2rem;
    }
    .hd-item .hd-num { font-family:'Playfair Display',serif; font-size:2rem; font-weight:900; color:var(--gold); line-height:1; }
    .hd-item .hd-lbl { font-size:.72rem; color:rgba(255,255,255,.45); text-transform:uppercase; letter-spacing:1px; margin-top:.3rem; }
    .hd-item.accent { background:rgba(201,168,76,.15); border-color:rgba(201,168,76,.3); grid-column:1/-1; display:flex; align-items:center; gap:1rem; }
    .hd-item.accent i { font-size:1.6rem; color:var(--gold); }
    .hd-item.accent .hd-text { font-size:.88rem; color:rgba(255,255,255,.7); line-height:1.55; }

    /* Hero wave bottom */
    .hero-wave { background:var(--white); position:relative; z-index:2; }
    .hero-wave svg { display:block; }

    /* Floating stats strip */
    .stats-strip { background:var(--gold); padding:0; }
    .ss-inner { display:flex; flex-wrap:wrap; }
    .ss-item { flex:1; min-width:130px; text-align:center; padding:1.3rem 1rem; border-right:1px solid rgba(10,22,40,.12); }
    .ss-item:last-child { border-right:none; }
    .ss-item .ss-num { font-family:'Playfair Display',serif; font-size:1.7rem; font-weight:900; color:var(--navy); line-height:1; }
    .ss-item .ss-lbl { font-size:.68rem; color:rgba(10,22,40,.6); text-transform:uppercase; letter-spacing:1px; margin-top:.2rem; font-weight:600; }

    /* ════════════════════════════════════
       DUAL CTA TABS — EMPLOYER / CANDIDATE
    ════════════════════════════════════ */
    .audience-tabs {
      background:var(--cream); border-bottom:2px solid var(--border);
      position:sticky; top:0; z-index:100;
      box-shadow:0 2px 12px rgba(10,22,40,.06);
    }
    .audience-tabs .tab-inner { display:flex; align-items:center; gap:0; }
    .aud-tab {
      flex:1; display:flex; align-items:center; justify-content:center; gap:.6rem;
      padding:1.2rem 1rem; font-size:.88rem; font-weight:700; color:var(--gray);
      border-bottom:3px solid transparent; cursor:pointer; transition:all .2s;
      user-select:none; letter-spacing:.3px;
    }
    .aud-tab i { font-size:.9rem; }
    .aud-tab:hover { color:var(--navy); background:rgba(10,22,40,.02); }
    .aud-tab.active { color:var(--gold); border-bottom-color:var(--gold); background:transparent; }
    .aud-tab .tab-badge {
      background:var(--gold); color:var(--navy); border-radius:50px;
      font-size:.65rem; font-weight:800; padding:.15rem .55rem; letter-spacing:.3px;
    }

    /* ════════════════════════════════════
       EMPLOYER SECTION
    ════════════════════════════════════ */
    .employer-section { padding:5.5rem 0; background:var(--white); }
    .employer-section.hidden,
    .candidate-section.hidden { display:none; }

    /* Role category cards */
    .role-cat-card {
      background:var(--white); border:1px solid var(--border);
      border-radius:18px; overflow:hidden; height:100%;
      transition:all .3s; cursor:pointer;
    }
    .role-cat-card:hover { transform:translateY(-5px); box-shadow:0 16px 44px rgba(10,22,40,.1); border-color:transparent; }
    .rcc-header {
      padding:1.8rem 1.8rem 1.2rem; position:relative;
    }
    .rcc-icon {
      width:52px; height:52px; border-radius:14px;
      display:flex; align-items:center; justify-content:center;
      margin-bottom:1rem;
    }
    .rcc-icon i { font-size:1.3rem; color:var(--white); }
    .ri-1 { background:linear-gradient(135deg,#0a2744,#1a3a6e); }
    .ri-2 { background:linear-gradient(135deg,#0d2b1e,#1a4a30); }
    .ri-3 { background:linear-gradient(135deg,#2b1a0a,#4a3010); }
    .ri-4 { background:linear-gradient(135deg,#1a0a2b,#350f55); }
    .ri-5 { background:linear-gradient(135deg,#0a1f2b,#103a4a); }
    .ri-6 { background:linear-gradient(135deg,#2b0d0a,#4a1810); }
    .rcc-header h5 { font-size:1.05rem; color:var(--navy); margin-bottom:.3rem; }
    .rcc-header .rcc-count { font-size:.78rem; color:var(--gold); font-weight:700; }
    .rcc-salary {
      position:absolute; top:1.4rem; right:1.4rem;
      background:var(--cream); border-radius:8px; padding:.35rem .7rem;
      font-size:.75rem; font-weight:700; color:var(--navy);
    }
    .rcc-body { padding:0 1.8rem 1.8rem; }
    .rcc-tags { display:flex; flex-wrap:wrap; gap:.4rem; margin-bottom:1.2rem; }
    .rcc-tag {
      background:var(--light); border:1px solid var(--border);
      border-radius:50px; padding:.2rem .7rem;
      font-size:.72rem; font-weight:600; color:var(--navy);
    }
    .rcc-body p { color:var(--gray); font-size:.85rem; line-height:1.65; margin-bottom:1.2rem; }
    .rcc-link { color:var(--gold); font-size:.82rem; font-weight:700; text-decoration:none; display:inline-flex; align-items:center; gap:.4rem; transition:all .2s; }
    .rcc-link:hover { color:var(--navy); gap:.7rem; }

    /* Process timeline */
    .process-section { padding:5.5rem 0; background:var(--cream); }
    .timeline { position:relative; padding-left:3rem; }
    .timeline::before { content:''; position:absolute; left:18px; top:0; height:100%; width:2px; background:var(--border); }
    .tl-item { position:relative; padding-bottom:2.5rem; }
    .tl-item:last-child { padding-bottom:0; }
    .tl-dot {
      position:absolute; left:-3rem; top:0;
      width:36px; height:36px; border-radius:50%;
      background:var(--navy); color:var(--gold);
      display:flex; align-items:center; justify-content:center;
      font-family:'Playfair Display',serif; font-weight:700; font-size:.9rem;
      border:3px solid var(--cream); z-index:1;
    }
    .tl-item.active .tl-dot { background:var(--gold); color:var(--navy); }
    .tl-content { background:var(--white); border:1px solid var(--border); border-radius:14px; padding:1.5rem; transition:all .2s; }
    .tl-item.active .tl-content { border-color:var(--gold); box-shadow:0 4px 16px rgba(201,168,76,.12); }
    .tl-content h5 { font-size:1rem; color:var(--navy); margin-bottom:.4rem; }
    .tl-content p { color:var(--gray); font-size:.88rem; line-height:1.65; margin:0; }
    .tl-duration { display:inline-flex; align-items:center; gap:.35rem; background:var(--cream); border-radius:50px; padding:.2rem .7rem; font-size:.72rem; font-weight:700; color:var(--gray); margin-top:.7rem; }
    .tl-duration i { color:var(--gold); font-size:.65rem; }

    /* Guarantee card */
    .guarantee-card {
      background:var(--navy); border-radius:20px; padding:2.5rem;
      display:flex; align-items:flex-start; gap:1.5rem;
    }
    .gc-icon { width:60px; height:60px; border-radius:14px; background:rgba(201,168,76,.15); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
    .gc-icon i { color:var(--gold); font-size:1.5rem; }
    .guarantee-card h4 { color:var(--white); font-size:1.3rem; margin-bottom:.6rem; }
    .guarantee-card p { color:rgba(255,255,255,.6); font-size:.9rem; line-height:1.7; margin:0; }

    /* ════════════════════════════════════
       JOB LISTINGS
    ════════════════════════════════════ */
    .jobs-section { padding:5.5rem 0; background:var(--white); }

    /* Filter */
    .job-filters { display:flex; gap:.7rem; flex-wrap:wrap; margin-bottom:2rem; align-items:center; }
    .jf-select {
      background:var(--white); border:1.5px solid var(--border);
      border-radius:8px; padding:.5rem 1rem; font-size:.85rem;
      font-family:'DM Sans',sans-serif; color:var(--navy); outline:none;
      transition:border-color .2s; cursor:pointer;
    }
    .jf-select:focus { border-color:var(--gold); }
    .jf-search {
      flex:1; min-width:200px; display:flex; align-items:center; gap:.5rem;
      background:var(--white); border:1.5px solid var(--border);
      border-radius:8px; padding:.5rem 1rem; transition:border-color .2s;
    }
    .jf-search:focus-within { border-color:var(--gold); }
    .jf-search i { color:var(--gray-light); font-size:.82rem; }
    .jf-search input { border:none; outline:none; background:transparent; font-size:.85rem; font-family:'DM Sans',sans-serif; color:var(--navy); width:100%; }
    .jf-search input::placeholder { color:var(--gray-light); }
    .jobs-count { font-size:.82rem; color:var(--gray); font-weight:600; margin-left:auto; }

    /* Job card */
    .job-card {
      background:var(--white); border:1px solid var(--border);
      border-radius:14px; padding:1.6rem; margin-bottom:1rem;
      transition:all .3s; cursor:pointer; position:relative;
    }
    .job-card:hover { border-color:var(--gold); box-shadow:0 8px 28px rgba(10,22,40,.08); transform:translateX(4px); }
    .job-card.featured { border-color:var(--gold); background:linear-gradient(to right, rgba(201,168,76,.04), var(--white)); }
    .jc-top { display:flex; align-items:flex-start; gap:1rem; margin-bottom:1rem; }
    .jc-icon {
      width:46px; height:46px; border-radius:12px; flex-shrink:0;
      display:flex; align-items:center; justify-content:center;
    }
    .jc-icon i { font-size:1.1rem; color:var(--white); }
    .jc-title { flex:1; }
    .jc-title h5 { font-size:1rem; color:var(--navy); margin-bottom:.2rem; transition:color .2s; }
    .job-card:hover .jc-title h5 { color:var(--gold); }
    .jc-title .jc-company { font-size:.8rem; color:var(--gray); }
    .jc-badges { display:flex; flex-wrap:wrap; gap:.4rem; margin-left:auto; }
    .jc-badge {
      border-radius:50px; padding:.22rem .75rem;
      font-size:.68rem; font-weight:700; letter-spacing:.5px; text-transform:uppercase;
      white-space:nowrap;
    }
    .badge-new { background:rgba(16,185,129,.1); color:var(--green); }
    .badge-hot { background:rgba(239,68,68,.1); color:var(--red); }
    .badge-featured { background:rgba(201,168,76,.15); color:var(--gold); }
    .badge-remote { background:var(--light); color:var(--gray); }
    .jc-meta { display:flex; flex-wrap:wrap; gap:.8rem; font-size:.8rem; color:var(--gray); margin-bottom:1rem; }
    .jc-meta span { display:flex; align-items:center; gap:.3rem; }
    .jc-meta i { color:var(--gold); font-size:.72rem; }
    .jc-desc { color:var(--gray); font-size:.85rem; line-height:1.6; margin-bottom:1.1rem; }
    .jc-skills { display:flex; flex-wrap:wrap; gap:.4rem; margin-bottom:1.2rem; }
    .jc-skill { background:var(--light); border:1px solid var(--border); border-radius:50px; padding:.2rem .7rem; font-size:.72rem; font-weight:600; color:var(--navy); }
    .jc-footer { display:flex; align-items:center; justify-content:space-between; padding-top:1rem; border-top:1px solid var(--border); }
    .jc-salary { font-family:'Playfair Display',serif; font-size:1.1rem; font-weight:700; color:var(--navy); }
    .jc-salary span { font-family:'DM Sans',sans-serif; font-size:.72rem; font-weight:400; color:var(--gray); }
    .btn-apply {
      display:inline-flex; align-items:center; gap:.4rem;
      background:var(--navy); color:var(--white); font-weight:700;
      border:none; border-radius:7px; padding:.55rem 1.3rem;
      font-size:.82rem; text-decoration:none; transition:all .2s; cursor:pointer;
    }
    .btn-apply:hover { background:var(--gold); color:var(--navy); }
    .btn-save {
      display:inline-flex; align-items:center; gap:.35rem;
      background:transparent; color:var(--gray);
      border:1px solid var(--border); border-radius:7px;
      padding:.52rem .9rem; font-size:.82rem; cursor:pointer; transition:all .2s;
    }
    .btn-save:hover { border-color:var(--gold); color:var(--gold); }
    .btn-save.saved { border-color:var(--gold); color:var(--gold); background:rgba(201,168,76,.06); }
    .featured-crown { position:absolute; top:-1px; left:1.5rem; background:var(--gold); color:var(--navy); font-size:.6rem; font-weight:800; letter-spacing:1px; text-transform:uppercase; padding:.15rem .65rem; border-radius:0 0 6px 6px; }

    /* ════════════════════════════════════
       CANDIDATE SECTION
    ════════════════════════════════════ */
    .candidate-section { padding:5.5rem 0; background:var(--white); }

    /* Upload resume card */
    .resume-upload-card {
      background:var(--navy); border-radius:20px; padding:3rem;
      text-align:center; position:relative; overflow:hidden;
    }
    .resume-upload-card::before {
      content:''; position:absolute; top:-80px; right:-80px;
      width:300px; height:300px; border-radius:50%;
      background:radial-gradient(circle,rgba(201,168,76,.12) 0%,transparent 70%);
    }
    .resume-upload-card h3 { color:var(--white); margin-bottom:.6rem; }
    .resume-upload-card p { color:rgba(255,255,255,.55); font-size:.92rem; line-height:1.7; max-width:420px; margin:0 auto 1.8rem; }
    .drop-zone {
      border:2px dashed rgba(201,168,76,.4); border-radius:14px;
      padding:2.5rem 1.5rem; cursor:pointer; transition:all .2s;
      background:rgba(255,255,255,.04);
    }
    .drop-zone:hover { border-color:var(--gold); background:rgba(201,168,76,.06); }
    .drop-zone.dragover { border-color:var(--gold); background:rgba(201,168,76,.1); }
    .drop-zone i { font-size:2.5rem; color:var(--gold); margin-bottom:.8rem; display:block; opacity:.7; }
    .drop-zone p { color:rgba(255,255,255,.55); font-size:.88rem; margin:0; }
    .drop-zone strong { color:var(--gold); }
    .drop-zone input[type=file] { display:none; }
    .upload-progress { display:none; margin-top:1rem; }
    .up-bar { height:4px; background:rgba(255,255,255,.1); border-radius:2px; overflow:hidden; }
    .up-fill { height:100%; background:var(--gold); border-radius:2px; width:0%; transition:width .3s; }
    .up-label { font-size:.75rem; color:rgba(255,255,255,.5); margin-top:.4rem; text-align:left; }
    .upload-success { display:none; }
    .upload-success .us-file { display:flex; align-items:center; gap:.8rem; background:rgba(201,168,76,.12); border:1px solid rgba(201,168,76,.3); border-radius:10px; padding:1rem 1.2rem; margin-top:1rem; }
    .us-file i { color:var(--gold); font-size:1.1rem; }
    .us-file .us-name { color:var(--white); font-size:.88rem; font-weight:600; }
    .us-file .us-size { color:rgba(255,255,255,.4); font-size:.75rem; }
    .us-file .us-remove { margin-left:auto; color:rgba(255,255,255,.4); cursor:pointer; font-size:.85rem; transition:color .2s; }
    .us-file .us-remove:hover { color:var(--red); }

    /* Candidate form */
    .candidate-form-card { background:var(--cream); border-radius:20px; padding:2.5rem; }
    .cf-label { font-size:.82rem; font-weight:600; color:var(--navy); margin-bottom:.4rem; letter-spacing:.2px; display:block; }
    .cf-label .req { color:var(--gold); }
    .cf-input, .cf-select, .cf-textarea {
      width:100%; border:1.5px solid var(--border); border-radius:8px;
      padding:.72rem 1rem; font-size:.9rem; font-family:'DM Sans',sans-serif;
      color:var(--text); background:var(--white); outline:none; transition:border-color .2s, box-shadow .2s;
    }
    .cf-input:focus, .cf-select:focus, .cf-textarea:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(201,168,76,.1); }
    .cf-input::placeholder, .cf-textarea::placeholder { color:var(--gray-light); }
    .cf-textarea { resize:vertical; min-height:110px; }
    .cf-input.error { border-color:var(--red); }

    /* Salary slider */
    .salary-slider { width:100%; accent-color:var(--gold); height:4px; cursor:pointer; margin:1rem 0 .3rem; }
    .salary-display { display:flex; justify-content:space-between; font-size:.8rem; color:var(--gray); }
    .salary-display .current { color:var(--gold); font-weight:700; font-size:.9rem; }

    /* Pref tags */
    .pref-tags { display:flex; flex-wrap:wrap; gap:.5rem; }
    .pref-tag { display:inline-flex; align-items:center; gap:.4rem; background:var(--white); border:1.5px solid var(--border); border-radius:50px; padding:.35rem 1rem; font-size:.8rem; font-weight:600; color:var(--navy); cursor:pointer; transition:all .2s; user-select:none; }
    .pref-tag:hover { border-color:var(--gold); color:var(--gold); }
    .pref-tag input { display:none; }
    .pref-tag.selected { background:var(--navy); color:var(--white); border-color:var(--navy); }

    .btn-submit-cf {
      width:100%; background:var(--navy); color:var(--white); font-weight:700;
      border:none; border-radius:10px; padding:1rem; font-size:.98rem;
      font-family:'DM Sans',sans-serif; cursor:pointer; transition:all .25s;
      display:flex; align-items:center; justify-content:center; gap:.5rem;
    }
    .btn-submit-cf:hover { background:var(--navy-soft); transform:translateY(-1px); box-shadow:0 8px 24px rgba(10,22,40,.2); }
    .spinner-sm { display:none; width:16px; height:16px; border:2px solid rgba(255,255,255,.3); border-top-color:var(--white); border-radius:50%; animation:spin .7s linear infinite; }
    @keyframes spin { to { transform:rotate(360deg); } }

    /* ════════════════════════════════════
       WHY US
    ════════════════════════════════════ */
    .why-section { padding:5.5rem 0; background:var(--navy); }
    .why-card { background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1); border-radius:16px; padding:1.8rem; height:100%; transition:all .3s; }
    .why-card:hover { background:rgba(255,255,255,.1); transform:translateY(-4px); }
    .why-card .wc-icon { width:50px; height:50px; border-radius:12px; background:rgba(201,168,76,.15); display:flex; align-items:center; justify-content:center; margin-bottom:1.1rem; }
    .why-card .wc-icon i { color:var(--gold); font-size:1.2rem; }
    .why-card h5 { color:var(--white); font-size:1rem; margin-bottom:.5rem; }
    .why-card p { color:rgba(255,255,255,.55); font-size:.87rem; line-height:1.7; margin:0; }

    /* ════════════════════════════════════
       TESTIMONIALS
    ════════════════════════════════════ */
    .rec-testimonials { padding:5.5rem 0; background:var(--cream); }
    .rt-card { background:var(--white); border:1px solid var(--border); border-radius:16px; padding:2rem; height:100%; transition:all .3s; position:relative; }
    .rt-card:hover { box-shadow:0 12px 32px rgba(10,22,40,.08); transform:translateY(-3px); }
    .rt-card .quote { font-family:'Playfair Display',serif; font-size:4rem; color:var(--gold); line-height:.6; opacity:.25; position:absolute; top:1.5rem; right:1.8rem; }
    .rt-card .stars { color:var(--gold); font-size:.8rem; margin-bottom:.8rem; }
    .rt-card .type-badge { display:inline-flex; align-items:center; gap:.35rem; background:rgba(201,168,76,.12); color:var(--gold); border-radius:50px; padding:.2rem .75rem; font-size:.68rem; font-weight:700; letter-spacing:.8px; text-transform:uppercase; margin-bottom:.8rem; }
    .rt-card p { color:var(--text); font-size:.9rem; line-height:1.75; margin-bottom:1.4rem; font-style:italic; }
    .rt-author { display:flex; align-items:center; gap:.8rem; }
    .rt-av { width:42px; height:42px; border-radius:50%; background:var(--navy); color:var(--gold); display:flex; align-items:center; justify-content:center; font-family:'Playfair Display',serif; font-weight:700; font-size:.9rem; flex-shrink:0; }
    .rt-card .rt-name { color:var(--navy); font-weight:700; font-size:.88rem; }
    .rt-card .rt-role { color:var(--gray); font-size:.75rem; }

    /* ════════════════════════════════════
       INDUSTRIES / SALARY DATA
    ════════════════════════════════════ */
    .salary-section { padding:5.5rem 0; background:var(--white); }
    .salary-row { display:flex; align-items:center; gap:1rem; padding:.9rem 0; border-bottom:1px solid var(--border); }
    .salary-row:last-child { border-bottom:none; }
    .sr-title { flex:0 0 200px; font-size:.9rem; font-weight:600; color:var(--navy); }
    .sr-bar-wrap { flex:1; height:8px; background:var(--light); border-radius:4px; overflow:hidden; }
    .sr-bar { height:100%; background:linear-gradient(90deg,var(--gold),var(--gold-light)); border-radius:4px; transition:width 1.2s cubic-bezier(.25,.46,.45,.94); width:0; }
    .sr-range { flex:0 0 130px; text-align:right; font-size:.82rem; font-weight:700; color:var(--navy); }
    .sr-range .sr-avg { font-size:.72rem; color:var(--gold); font-weight:600; display:block; }

    /* ════════════════════════════════════
       CTA
    ════════════════════════════════════ */
    .rec-cta { background:linear-gradient(135deg,var(--gold) 0%,#b8922e 100%); padding:5rem 0; text-align:center; }
    .rec-cta h2 { font-size:clamp(1.8rem,3.5vw,2.8rem); color:var(--navy); margin-bottom:1rem; }
    .rec-cta p { color:rgba(10,22,40,.65); font-size:1rem; max-width:520px; margin:0 auto 2.2rem; line-height:1.7; }
    .btn-navy { display:inline-flex; align-items:center; gap:.5rem; background:var(--navy); color:var(--white); font-weight:700; border:none; border-radius:8px; padding:.92rem 2.2rem; font-size:.95rem; text-decoration:none; transition:all .2s; }
    .btn-navy:hover { background:var(--navy-mid); color:var(--white); transform:translateY(-2px); box-shadow:0 8px 24px rgba(0,0,0,.18); }
    .btn-outline-navy { display:inline-flex; align-items:center; gap:.5rem; background:transparent; color:var(--navy); font-weight:700; border:2px solid rgba(10,22,40,.3); border-radius:8px; padding:.9rem 2rem; font-size:.95rem; text-decoration:none; transition:all .2s; }
    .btn-outline-navy:hover { border-color:var(--navy); background:rgba(10,22,40,.08); }

    /* success overlay */
    .submit-success { display:none; text-align:center; padding:2.5rem 1rem; }
    .submit-success .sc { width:72px; height:72px; border-radius:50%; background:rgba(16,185,129,.1); border:2px solid var(--green); display:flex; align-items:center; justify-content:center; margin:0 auto 1.2rem; animation:popIn .4s cubic-bezier(.34,1.56,.64,1); }
    @keyframes popIn { from{transform:scale(0);opacity:0} to{transform:scale(1);opacity:1} }
    .submit-success .sc i { font-size:1.8rem; color:var(--green); }
    .submit-success h4 { color:var(--navy); margin-bottom:.5rem; }
    .submit-success p { color:var(--gray); font-size:.9rem; line-height:1.7; }

    @media(max-width:767px) {
      .hero-dual { grid-template-columns:1fr 1fr; }
      .sr-title { flex:0 0 120px; font-size:.8rem; }
      .sr-range { flex:0 0 100px; }
      .guarantee-card { flex-direction:column; }
      .job-filters { flex-direction:column; }
      .jobs-count { margin-left:0; }
    }

    
    /* ════════════════════════════════════
       BREADCRUMB
    ════════════════════════════════════ */
    .breadcrumb-bar {
      background: var(--white);
      border-bottom: 1px solid var(--border);
      padding: .75rem 0;
    }
    .breadcrumb { margin: 0; font-size: .8rem; }
    .breadcrumb-item a { color: var(--gray); text-decoration: none; transition: color .2s; }
    .breadcrumb-item a:hover { color: var(--gold); }
    .breadcrumb-item.active { color: var(--navy); font-weight: 500; }
    .breadcrumb-item + .breadcrumb-item::before { color: var(--gray-light); }

    /* ════════════════════════════════════
       JOB HERO BANNER
    ════════════════════════════════════ */
    .job-hero {
      background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 60%, var(--navy-soft) 100%);
      padding: 3.5rem 0 3rem;
      position: relative; overflow: hidden;
    }
    .job-hero::before {
      content: ''; position: absolute; top: -80px; right: -80px;
      width: 420px; height: 420px; border-radius: 50%;
      background: radial-gradient(circle, rgba(201,168,76,.1) 0%, transparent 70%);
    }
    .job-hero .inner { position: relative; z-index: 1; }

    /* Company logo tile */
    .company-logo-tile {
      width: 72px; height: 72px; border-radius: 16px;
      background: rgba(255,255,255,.1);
      border: 2px solid rgba(255,255,255,.18);
      display: flex; align-items: center; justify-content: center;
      font-family: 'Playfair Display', serif; font-weight: 900;
      color: var(--gold); font-size: 1.6rem;
      flex-shrink: 0;
    }
    .job-hero h1 {
      font-size: clamp(1.6rem, 3vw, 2.4rem);
      color: var(--white); line-height: 1.2; margin-bottom: .4rem;
    }
    .job-hero .company-name { color: rgba(255,255,255,.65); font-size: .95rem; font-weight: 500; margin-bottom: 1.1rem; }

    /* Meta pills row */
    .meta-pills { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.4rem; }
    .mp {
      display: inline-flex; align-items: center; gap: .4rem;
      background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.18);
      border-radius: 50px; padding: .3rem .9rem;
      color: rgba(255,255,255,.8); font-size: .78rem; font-weight: 500;
    }
    .mp i { color: var(--gold); font-size: .72rem; }
    .mp.hot  { background: rgba(239,68,68,.15); border-color: rgba(239,68,68,.3); color: #fca5a5; }
    .mp.new  { background: rgba(16,185,129,.15); border-color: rgba(16,185,129,.3); color: #6ee7b7; }
    .mp.feat { background: rgba(201,168,76,.15); border-color: rgba(201,168,76,.3); color: var(--gold); }

    /* Salary + actions row */
    .hero-bottom { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; }
    .salary-block .label { color: rgba(255,255,255,.45); font-size: .7rem; text-transform: uppercase; letter-spacing: 1px; margin-bottom: .2rem; }
    .salary-block .amount { font-family: 'Playfair Display', serif; font-size: 1.9rem; font-weight: 900; color: var(--gold); line-height: 1; }
    .salary-block .note { color: rgba(255,255,255,.4); font-size: .75rem; margin-top: .2rem; }
    .hero-actions { display: flex; gap: .7rem; flex-wrap: wrap; }
    .btn-apply-main {
      display: inline-flex; align-items: center; gap: .5rem;
      background: var(--gold); color: var(--navy); font-weight: 700;
      border: none; border-radius: 8px; padding: .85rem 2rem;
      font-size: .95rem; text-decoration: none; cursor: pointer;
      transition: all .2s; font-family: 'DM Sans', sans-serif;
    }
    .btn-apply-main:hover { background: var(--gold-light); color: var(--navy); transform: translateY(-2px); box-shadow: 0 8px 24px rgba(201,168,76,.35); }
    .btn-save-job {
      display: inline-flex; align-items: center; gap: .5rem;
      background: rgba(255,255,255,.1); color: var(--white); font-weight: 600;
      border: 1.5px solid rgba(255,255,255,.25); border-radius: 8px;
      padding: .82rem 1.4rem; font-size: .9rem; cursor: pointer;
      transition: all .2s; font-family: 'DM Sans', sans-serif;
    }
    .btn-save-job:hover { border-color: var(--gold); color: var(--gold); }
    .btn-save-job.saved { border-color: var(--gold); color: var(--gold); background: rgba(201,168,76,.1); }
    .btn-share {
      display: inline-flex; align-items: center; justify-content: center;
      width: 44px; height: 44px; border-radius: 8px;
      background: rgba(255,255,255,.1); border: 1.5px solid rgba(255,255,255,.2);
      color: rgba(255,255,255,.7); cursor: pointer; transition: all .2s;
      position: relative;
    }
    .btn-share:hover { border-color: var(--gold); color: var(--gold); }

    /* Deadline bar */
    .deadline-bar {
      background: rgba(201,168,76,.12); border-top: 1px solid rgba(201,168,76,.2);
      padding: .6rem 0;
    }
    .deadline-bar .db-inner {
      display: flex; align-items: center; justify-content: space-between;
      flex-wrap: wrap; gap: .5rem;
    }
    .deadline-bar span { color: rgba(255,255,255,.6); font-size: .8rem; }
    .deadline-bar strong { color: var(--gold); }
    .deadline-bar .applicants { display: flex; align-items: center; gap: .4rem; color: rgba(255,255,255,.5); font-size: .78rem; }
    .deadline-bar .applicants i { color: var(--gold); font-size: .72rem; }

    /* ════════════════════════════════════
       MAIN LAYOUT
    ════════════════════════════════════ */
    .job-layout { padding: 2.5rem 0 4rem; }

    /* ════════════════════════════════════
       JOB BODY CARD
    ════════════════════════════════════ */
    .job-body-card {
      background: var(--white); border-radius: 16px;
      border: 1px solid var(--border);
      overflow: hidden;
    }

    /* Tab nav inside card */
    .job-tabs { border-bottom: 1px solid var(--border); background: var(--cream); }
    .job-tabs .nav { gap: 0; }
    .job-tabs .nav-link {
      font-size: .83rem; font-weight: 600; color: var(--gray);
      padding: .95rem 1.4rem; border-radius: 0;
      border-bottom: 3px solid transparent;
      transition: all .2s; white-space: nowrap;
    }
    .job-tabs .nav-link:hover { color: var(--navy); background: rgba(10,22,40,.02); }
    .job-tabs .nav-link.active { color: var(--gold); border-bottom-color: var(--gold); background: transparent; }

    /* Tab panes */
    .tab-pane-inner { padding: 2.5rem; }

    /* Overview */
    .section-head {
      font-family: 'DM Sans', sans-serif;
      font-size: .7rem; letter-spacing: 2px;
      text-transform: uppercase; color: var(--gold);
      font-weight: 700; margin-bottom: .6rem;
    }
    .job-description p { color: var(--gray); font-size: .93rem; line-height: 1.8; margin-bottom: 1.2rem; }
    .job-description h5 { font-size: 1.1rem; color: var(--navy); margin: 1.8rem 0 .9rem; }
    .job-description ul { list-style: none; padding: 0; margin: 0 0 1.5rem; }
    .job-description ul li {
      display: flex; align-items: flex-start; gap: .75rem;
      padding: .5rem 0; border-bottom: 1px solid var(--border);
      font-size: .9rem; color: var(--text); line-height: 1.55;
    }
    .job-description ul li:last-child { border-bottom: none; }
    .job-description ul li .li-dot {
      width: 20px; height: 20px; border-radius: 50%;
      background: rgba(201,168,76,.12);
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0; margin-top: 1px;
    }
    .job-description ul li .li-dot i { color: var(--gold); font-size: .55rem; }

    /* Perks grid */
    .perks-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: .8rem; margin-bottom: 1.5rem; }
    .perk-item {
      background: var(--cream); border: 1px solid var(--border);
      border-radius: 12px; padding: 1rem;
      display: flex; align-items: center; gap: .7rem;
      transition: all .2s;
    }
    .perk-item:hover { border-color: var(--gold); }
    .perk-item i { color: var(--gold); font-size: 1rem; flex-shrink: 0; }
    .perk-item span { font-size: .83rem; font-weight: 600; color: var(--navy); line-height: 1.3; }

    /* Skills */
    .skills-wrap { display: flex; flex-wrap: wrap; gap: .5rem; }
    .skill-tag {
      background: var(--navy); color: var(--white);
      border-radius: 8px; padding: .35rem 1rem;
      font-size: .8rem; font-weight: 600;
    }
    .skill-tag.nice { background: var(--light); color: var(--navy); border: 1px solid var(--border); }

    /* Quick facts table */
    .quick-facts { border-radius: 12px; overflow: hidden; border: 1px solid var(--border); }
    .qf-row {
      display: flex; align-items: center;
      padding: .9rem 1.2rem; border-bottom: 1px solid var(--border);
      gap: 1rem;
    }
    .qf-row:last-child { border-bottom: none; }
    .qf-row:nth-child(even) { background: var(--cream); }
    .qf-row .qf-icon { width: 32px; height: 32px; border-radius: 8px; background: rgba(201,168,76,.1); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .qf-row .qf-icon i { color: var(--gold); font-size: .8rem; }
    .qf-row .qf-key { font-size: .78rem; color: var(--gray); min-width: 120px; font-weight: 600; }
    .qf-row .qf-val { font-size: .88rem; color: var(--navy); font-weight: 600; }

    /* Company tab */
    .company-header { display: flex; align-items: center; gap: 1.2rem; margin-bottom: 1.5rem; }
    .co-logo { width: 64px; height: 64px; border-radius: 14px; background: var(--navy); display: flex; align-items: center; justify-content: center; font-family: 'Playfair Display', serif; font-weight: 900; color: var(--gold); font-size: 1.4rem; flex-shrink: 0; }
    .company-header h4 { font-size: 1.3rem; color: var(--navy); margin-bottom: .2rem; }
    .company-header .co-industry { color: var(--gold); font-size: .8rem; font-weight: 700; }
    .co-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: .8rem; margin-bottom: 1.5rem; }
    .co-stat { background: var(--cream); border-radius: 10px; padding: 1rem; text-align: center; }
    .co-stat .cs-num { font-family: 'Playfair Display', serif; font-size: 1.4rem; font-weight: 900; color: var(--navy); line-height: 1; }
    .co-stat .cs-lbl { font-size: .7rem; color: var(--gray); text-transform: uppercase; letter-spacing: .8px; margin-top: .2rem; }
    .co-p { color: var(--gray); font-size: .9rem; line-height: 1.75; margin-bottom: 1rem; }
    .co-links { display: flex; gap: .6rem; flex-wrap: wrap; }
    .co-link { display: inline-flex; align-items: center; gap: .45rem; background: var(--light); border: 1px solid var(--border); border-radius: 8px; padding: .5rem 1rem; font-size: .8rem; font-weight: 600; color: var(--navy); text-decoration: none; transition: all .2s; }
    .co-link:hover { background: var(--navy); color: var(--white); border-color: var(--navy); }

    /* Apply tab — form */
    .apply-form-wrap { max-width: 600px; }
    .af-label { display: block; font-size: .82rem; font-weight: 600; color: var(--navy); margin-bottom: .4rem; }
    .af-label .req { color: var(--gold); }
    .af-input, .af-select, .af-textarea {
      width: 100%; border: 1.5px solid var(--border); border-radius: 8px;
      padding: .72rem 1rem; font-size: .9rem;
      font-family: 'DM Sans', sans-serif; color: var(--text);
      background: var(--white); outline: none;
      transition: border-color .2s, box-shadow .2s;
    }
    .af-input:focus, .af-select:focus, .af-textarea:focus { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(201,168,76,.1); }
    .af-input::placeholder, .af-textarea::placeholder { color: var(--gray-light); }
    .af-input.err, .af-textarea.err { border-color: #ef4444; }
    .af-textarea { resize: vertical; min-height: 110px; }

    /* Resume drop */
    .resume-drop {
      border: 2px dashed var(--border); border-radius: 10px;
      padding: 2rem; text-align: center; cursor: pointer;
      transition: all .2s; background: var(--cream);
    }
    .resume-drop:hover, .resume-drop.over { border-color: var(--gold); background: rgba(201,168,76,.04); }
    .resume-drop i { font-size: 2rem; color: var(--gold); opacity: .6; margin-bottom: .6rem; display: block; }
    .resume-drop p { color: var(--gray); font-size: .85rem; margin: 0; }
    .resume-drop strong { color: var(--gold); }
    .resume-drop input { display: none; }
    .file-attached { display: none; align-items: center; gap: .8rem; background: rgba(16,185,129,.06); border: 1px solid rgba(16,185,129,.2); border-radius: 8px; padding: .8rem 1rem; }
    .file-attached i.fa-file { color: var(--green); }
    .fa-fname { font-size: .88rem; font-weight: 600; color: var(--navy); }
    .fa-size { font-size: .75rem; color: var(--gray); }
    .fa-remove { margin-left: auto; color: var(--gray-light); cursor: pointer; transition: color .2s; }
    .fa-remove:hover { color: #ef4444; }

    /* Submit btn */
    .btn-final-apply {
      width: 100%; background: var(--navy); color: var(--white);
      font-weight: 700; border: none; border-radius: 10px;
      padding: 1rem; font-size: .98rem; cursor: pointer;
      font-family: 'DM Sans', sans-serif;
      display: flex; align-items: center; justify-content: center; gap: .5rem;
      transition: all .25s;
    }
    .btn-final-apply:hover { background: var(--gold); color: var(--navy); }
    .spinner-sm { display: none; width: 16px; height: 16px; border: 2px solid rgba(255,255,255,.3); border-top-color: var(--white); border-radius: 50%; animation: spin .7s linear infinite; }
    @keyframes spin { to { transform: rotate(360deg); } }
    .apply-success { display: none; text-align: center; padding: 2.5rem 1rem; }
    .apply-success .asc { width: 70px; height: 70px; border-radius: 50%; background: rgba(16,185,129,.1); border: 2px solid var(--green); display: flex; align-items: center; justify-content: center; margin: 0 auto 1.2rem; animation: popIn .4s cubic-bezier(.34,1.56,.64,1); }
    @keyframes popIn { from{transform:scale(0);opacity:0} to{transform:scale(1);opacity:1} }
    .apply-success .asc i { font-size: 1.8rem; color: var(--green); }
    .apply-success h4 { color: var(--navy); margin-bottom: .5rem; }
    .apply-success p { color: var(--gray); font-size: .9rem; line-height: 1.7; }

    /* ════════════════════════════════════
       SIDEBAR
    ════════════════════════════════════ */
    .sidebar-widget {
      background: var(--white); border: 1px solid var(--border);
      border-radius: 16px; padding: 1.6rem; margin-bottom: 1.2rem;
    }
    .sw-title { font-family: 'DM Sans', sans-serif; font-size: .7rem; letter-spacing: 2px; text-transform: uppercase; color: var(--gold); font-weight: 700; margin-bottom: 1.1rem; }

    /* Progress bar widget */
    .match-score { text-align: center; padding: .5rem 0 1rem; }
    .ms-ring { position: relative; width: 100px; height: 100px; margin: 0 auto 1rem; }
    .ms-ring svg { transform: rotate(-90deg); }
    .ms-ring .track { fill: none; stroke: var(--light); stroke-width: 8; }
    .ms-ring .fill  { fill: none; stroke: var(--gold); stroke-width: 8; stroke-linecap: round; stroke-dasharray: 283; stroke-dashoffset: 283; transition: stroke-dashoffset 1.5s cubic-bezier(.25,.46,.45,.94); }
    .ms-ring .score-text { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; flex-direction: column; }
    .ms-ring .score-text .pct { font-family: 'Playfair Display', serif; font-size: 1.5rem; font-weight: 900; color: var(--navy); line-height: 1; }
    .ms-ring .score-text .lbl { font-size: .6rem; color: var(--gray); letter-spacing: .8px; text-transform: uppercase; }
    .match-score p { font-size: .82rem; color: var(--gray); line-height: 1.5; }

    /* Recruiter widget */
    .recruiter-av { width: 54px; height: 54px; border-radius: 50%; background: var(--navy); color: var(--gold); display: flex; align-items: center; justify-content: center; font-family: 'Playfair Display', serif; font-weight: 900; font-size: 1.1rem; flex-shrink: 0; }
    .recruiter-name { font-weight: 700; font-size: .95rem; color: var(--navy); }
    .recruiter-role { font-size: .75rem; color: var(--gray); }
    .recruiter-online { display: inline-flex; align-items: center; gap: .35rem; font-size: .72rem; color: var(--green); font-weight: 600; margin-top: .2rem; }
    .recruiter-online::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--green); display: inline-block; }
    .btn-msg { display: flex; align-items: center; justify-content: center; gap: .45rem; width: 100%; background: var(--cream); border: 1.5px solid var(--border); border-radius: 8px; padding: .65rem; font-size: .83rem; font-weight: 700; color: var(--navy); text-decoration: none; margin-top: 1rem; transition: all .2s; }
    .btn-msg:hover { border-color: var(--gold); color: var(--gold); }

    /* Job details list */
    .jd-list { list-style: none; padding: 0; margin: 0; }
    .jd-list li { display: flex; justify-content: space-between; align-items: center; padding: .6rem 0; border-bottom: 1px solid var(--border); font-size: .85rem; }
    .jd-list li:last-child { border-bottom: none; }
    .jd-list .jdl-key { color: var(--gray); display: flex; align-items: center; gap: .45rem; }
    .jd-list .jdl-key i { color: var(--gold); font-size: .72rem; }
    .jd-list .jdl-val { color: var(--navy); font-weight: 600; text-align: right; }

    /* Similar jobs */
    .sim-job { display: flex; gap: .8rem; align-items: flex-start; padding: .8rem 0; border-bottom: 1px solid var(--border); text-decoration: none; transition: all .2s; }
    .sim-job:last-child { border-bottom: none; }
    .sim-job:hover .sj-title { color: var(--gold); }
    .sj-icon { width: 38px; height: 38px; border-radius: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .sj-icon i { color: var(--white); font-size: .85rem; }
    .sji-1 { background: linear-gradient(135deg,#0a2744,#1a3a6e); }
    .sji-2 { background: linear-gradient(135deg,#0d2b1e,#1a4a30); }
    .sji-3 { background: linear-gradient(135deg,#2b1a0a,#4a3010); }
    .sj-title { font-size: .85rem; font-weight: 700; color: var(--navy); line-height: 1.3; transition: color .2s; }
    .sj-co { font-size: .75rem; color: var(--gray); margin-top: .1rem; }
    .sj-salary { font-size: .75rem; color: var(--gold); font-weight: 700; margin-left: auto; flex-shrink: 0; }

    /* Share dropdown */
    .share-dropdown {
      position: absolute; top: calc(100% + 8px); right: 0;
      background: var(--white); border: 1px solid var(--border);
      border-radius: 12px; padding: .5rem; min-width: 160px;
      box-shadow: 0 8px 24px rgba(10,22,40,.12); display: none; z-index: 50;
    }
    .share-dropdown.open { display: block; animation: fadeIn .15s ease; }
    @keyframes fadeIn { from{opacity:0;transform:translateY(-4px)} to{opacity:1;transform:translateY(0)} }
    .sd-item { display: flex; align-items: center; gap: .7rem; padding: .6rem .9rem; border-radius: 8px; font-size: .83rem; font-weight: 600; color: var(--navy); cursor: pointer; transition: background .15s; }
    .sd-item:hover { background: var(--light); }
    .sd-item i { font-size: .85rem; width: 16px; text-align: center; }
    .sd-item.copied { color: var(--green); }

    /* ════════════════════════════════════
       RELATED / BOTTOM
    ════════════════════════════════════ */
    .related-section { padding: 3rem 0 4rem; background: var(--cream); }
    .related-card {
      background: var(--white); border: 1px solid var(--border);
      border-radius: 14px; padding: 1.4rem;
      transition: all .3s; height: 100%; cursor: pointer;
    }
    .related-card:hover { border-color: var(--gold); box-shadow: 0 10px 28px rgba(10,22,40,.08); transform: translateY(-3px); }
    .rc-top { display: flex; align-items: flex-start; gap: .8rem; margin-bottom: .9rem; }
    .rc-icon { width: 42px; height: 42px; border-radius: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .rc-icon i { color: var(--white); font-size: 1rem; }
    .rc-title { font-size: .95rem; font-weight: 700; color: var(--navy); line-height: 1.3; transition: color .2s; }
    .related-card:hover .rc-title { color: var(--gold); }
    .rc-co { font-size: .78rem; color: var(--gray); margin-top: .15rem; }
    .rc-meta { display: flex; gap: .7rem; flex-wrap: wrap; font-size: .75rem; color: var(--gray); margin-bottom: .9rem; }
    .rc-meta span { display: flex; align-items: center; gap: .3rem; }
    .rc-meta i { color: var(--gold); font-size: .65rem; }
    .rc-footer { display: flex; align-items: center; justify-content: space-between; padding-top: .8rem; border-top: 1px solid var(--border); }
    .rc-salary { font-family: 'Playfair Display', serif; font-size: 1rem; font-weight: 700; color: var(--navy); }
    .rc-badge { background: var(--navy); color: var(--white); border-radius: 6px; padding: .3rem .8rem; font-size: .72rem; font-weight: 700; text-decoration: none; transition: background .2s; }
    .rc-badge:hover { background: var(--gold); color: var(--navy); }

    @media(max-width:991px) {
      .hero-bottom { flex-direction: column; align-items: flex-start; }
      .tab-pane-inner { padding: 1.5rem; }
    }
    @media(max-width:767px) {
      .co-stats { grid-template-columns: repeat(3,1fr); }
    }

    
    /* ════════════════════════════════════
       HERO
    ════════════════════════════════════ */
    .exp-hero {
      background: #10203a;
      min-height: 80vh;
      display: flex; align-items: center;
      padding: 7rem 0 5rem;
      position: relative; overflow: hidden;
    }
    .exp-hero::after {
      content: '';
      position: absolute; bottom: -1px; left: 0; right: 0;
      height: 80px; background: #ffffff;
      clip-path: polygon(0 100%, 100% 0, 100% 100%);
      z-index: 2;
    }
    .hero-grid {
      position: absolute; inset: 0; pointer-events: none;
      background-image:
        linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
      background-size: 60px 60px;
    }
    .hero-glow {
      position: absolute; top: -150px; right: -150px;
      width: 600px; height: 600px; border-radius: 50%;
      background: radial-gradient(circle at 40% 40%, rgba(184,150,90,.16) 0%, transparent 65%);
      pointer-events: none;
    }
    .hero-glow-2 {
      position: absolute; bottom: 40px; left: -100px;
      width: 380px; height: 380px; border-radius: 50%;
      background: radial-gradient(circle, rgba(184,150,90,.06) 0%, transparent 70%);
      pointer-events: none;
    }
    /* eyebrow */
    .eyebrow {
      display: inline-flex; align-items: center; gap: .6rem;
      font-size: .72rem; font-weight: 600; letter-spacing: 3px;
      text-transform: uppercase; color: var(--gold); margin-bottom: 1.6rem;
    }
    .eyebrow::before,.eyebrow::after { content:''; width:24px; height:1px; background:var(--gold); opacity:.55; }
    .exp-hero h1 {
      font-size: clamp(3.2rem, 7vw, 6rem);
      color: var(--white); font-weight: 300; line-height: 1.06; margin-bottom: 1.8rem;
    }
    .exp-hero h1 em { color: var(--gold); font-style: italic; }
    .hero-rule { width: 48px; height: 2px; background: linear-gradient(90deg,var(--gold),transparent); margin-bottom: 1.6rem; }
    .hero-lead {
      color: rgba(255,255,255,.58); font-size: 1.05rem; line-height: 1.85;
      max-width: 500px; font-weight: 300;
    }
    .hero-lead strong { color: rgba(255,255,255,.88); font-weight: 500; }
    /* Years tile */
    .years-tile {
      border: 1px solid rgba(184,150,90,.22);
      border-radius: 20px; padding: 3rem 2.8rem;
      background: rgba(255,255,255,.04); backdrop-filter: blur(8px);
      text-align: center; display: inline-block;
    }
    .yt-num { font-family:'Cormorant Garamond',serif; font-size:6rem; font-weight:300; color:var(--gold); line-height:1; }
    .yt-sup { font-size:2.8rem; color:var(--gold-light); vertical-align:super; }
    .yt-label { font-size:.72rem; font-weight:600; letter-spacing:2.5px; text-transform:uppercase; color:rgba(255,255,255,.4); margin-top:.4rem; }
    .yt-sub { font-size:.82rem; color:rgba(255,255,255,.3); line-height:1.5; margin-top:.3rem; }

    /* ════════════════════════════════════
       CONTEXT BAND
    ════════════════════════════════════ */
    .ctx-band { background:var(--gold); padding:.85rem 0; }
    .ctx-inner { display:flex; align-items:center; justify-content:center; gap:2.5rem; flex-wrap:wrap; }
    .ctx-item { display:flex; align-items:center; gap:.55rem; font-size:.77rem; font-weight:600; letter-spacing:.4px; color:var(--ink); }
    .ctx-item i { font-size:.78rem; opacity:.65; }
    .ctx-sep { width:1px; height:16px; background:rgba(14,17,23,.2); }

    /* ════════════════════════════════════
       INTRO
    ════════════════════════════════════ */
    .intro-section { padding:7rem 0 5.5rem; background:var(--cream); position:relative; }
    .intro-section::after {
      content:'FINORA'; position:absolute; bottom:-10px; right:0;
      font-family:'Cormorant Garamond',serif; font-size:9rem; font-weight:700;
      letter-spacing:-3px; color:rgba(14,17,23,.04); line-height:1;
      pointer-events:none; user-select:none;
    }
    .section-tag {
      display:inline-flex; align-items:center; gap:.5rem;
      font-size:.7rem; font-weight:600; letter-spacing:2.5px;
      text-transform:uppercase; color:var(--gold); margin-bottom:.7rem;
    }
    .section-tag::before { content:''; width:18px; height:1.5px; background:var(--gold); display:inline-block; }
    .intro-h2 { font-size:clamp(2.2rem,4vw,3.4rem); color:var(--ink); font-weight:400; line-height:1.2; margin-bottom:1.3rem; }
    .intro-h2 em { font-style:italic; color:var(--gold); }
    .intro-p { color:var(--gray); font-size:.97rem; line-height:1.88; max-width:540px; }
    /* client pills */
    .c-pills { display:flex; flex-wrap:wrap; gap:.6rem; margin-top:2rem; }
    .c-pill {
      display:inline-flex; align-items:center; gap:.5rem;
      background:var(--white); border:1px solid var(--border);
      border-radius:50px; padding:.42rem 1.1rem;
      font-size:.8rem; font-weight:500; color:var(--ink); transition:all .25s;
    }
    .c-pill i { color:var(--gold); font-size:.75rem; }
    .c-pill:hover { background:var(--ink); color:var(--white); border-color:var(--ink); }
    /* quote card */
    .q-card {
      background:var(--ink); border-radius:20px; padding:2.8rem;
      position:relative; overflow:hidden;
    }
    .q-card::before {
      content:'\201C'; font-family:'Cormorant Garamond',serif;
      font-size:14rem; color:rgba(184,150,90,.09);
      position:absolute; top:-30px; left:10px;
      line-height:1; pointer-events:none;
    }
    .q-card blockquote {
      font-family:'Cormorant Garamond',serif;
      font-size:1.5rem; font-weight:400; font-style:italic;
      color:rgba(255,255,255,.82); line-height:1.6;
      position:relative; z-index:1; margin:0 0 1.4rem;
    }
    .q-rule { width:30px; height:2px; background:var(--gold); margin-bottom:.9rem; }
    .q-source { font-size:.75rem; font-weight:600; letter-spacing:1.8px; text-transform:uppercase; color:var(--gold); }

    /* ════════════════════════════════════
       EXPERTISE CARDS
    ════════════════════════════════════ */
    .exp-cards-section { padding:6rem 0; background:var(--white); position:relative; }
    .exp-cards-section::before {
      content:''; position:absolute; top:0; left:0; right:0; height:1px;
    }
    .ec {
      background:var(--cream); border:1px solid var(--border);
      border-radius:16px; padding:2.2rem; height:100%;
      position:relative; overflow:hidden;
      transition:all .35s cubic-bezier(.25,.46,.45,.94);
    }
    .ec::before {
      content:''; position:absolute; top:0; left:0;
      width:3px; height:0; background:var(--gold);
      transition:height .4s ease; border-radius:0 0 3px 0;
    }
    .ec:hover { background:var(--white); border-color:var(--gold-pale); transform:translateY(-5px); box-shadow:0 20px 52px rgba(14,17,23,.07); }
    .ec:hover::before { height:100%; }
    .ec-num { font-family:'Cormorant Garamond',serif; font-size:3.5rem; font-weight:300; color:rgba(14,17,23,.06); line-height:1; margin-bottom:.7rem; transition:color .3s; }
    .ec:hover .ec-num { color:rgba(184,150,90,.12); }
    .ec-ico { width:48px; height:48px; border-radius:12px; background:var(--ink); display:flex; align-items:center; justify-content:center; margin-bottom:1.2rem; transition:background .3s,transform .3s; }
    .ec:hover .ec-ico { background:var(--gold); transform:rotate(-4deg); }
    .ec-ico i { color:var(--gold); font-size:1.1rem; transition:color .3s; }
    .ec:hover .ec-ico i { color:var(--ink); }
    .ec-title { font-family:'Cormorant Garamond',serif; font-size:1.2rem; font-weight:600; color:var(--ink); margin-bottom:.6rem; line-height:1.3; }
    .ec-body { color:var(--gray); font-size:.875rem; line-height:1.75; margin-bottom:1.1rem; }
    .ec-badge { display:inline-block; background:var(--gold-pale); color:var(--gold); border-radius:50px; padding:.18rem .8rem; font-size:.68rem; font-weight:600; letter-spacing:.8px; text-transform:uppercase; }

    /* ════════════════════════════════════
       APPROACH — DARK
    ════════════════════════════════════ */
    .approach-section { padding:7rem 0; background:#10203a; position:relative; overflow:hidden; }
    .approach-section::before {
      content:''; position:absolute; inset:0;
      background-image:
        linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px);
      background-size:50px 50px;
    }
    .a-orb { position:absolute; bottom:-100px; right:-100px; width:500px; height:500px; border-radius:50%; background:radial-gradient(circle,rgba(184,150,90,.08) 0%,transparent 65%); pointer-events:none; }
    .approach-h2 { font-size:clamp(2rem,3.5vw,3rem); color:var(--white); font-weight:400; line-height:1.22; margin-bottom:1.4rem; }
    .approach-h2 em { font-style:italic; color:var(--gold); }
    .approach-p { color:rgba(255,255,255,.52); font-size:.95rem; line-height:1.85; max-width:470px; }
    /* pillar */
    .pillar { display:flex; gap:1.1rem; align-items:flex-start; padding:1.4rem 0; border-bottom:1px solid rgba(255,255,255,.07); }
    .pillar:last-child { border-bottom:none; }
    .p-ico { width:42px; height:42px; border-radius:10px; background:rgba(184,150,90,.11); display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:background .25s; }
    .pillar:hover .p-ico { background:rgba(184,150,90,.22); }
    .p-ico i { color:var(--gold); font-size:.9rem; }
    .pillar h5 { font-family:'Outfit',sans-serif; font-size:.9rem; font-weight:600; color:var(--white); margin-bottom:.3rem; }
    .pillar p { color:rgba(255,255,255,.42); font-size:.82rem; line-height:1.65; margin:0; }
    /* tech bubbles */
    .tech-grid { display:flex; flex-wrap:wrap; gap:.55rem; margin-top:2rem; }
    .t-bubble { display:inline-flex; align-items:center; gap:.4rem; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1); border-radius:50px; padding:.35rem .95rem; font-size:.77rem; font-weight:500; color:rgba(255,255,255,.65); transition:all .2s; }
    .t-bubble:hover { background:rgba(184,150,90,.14); border-color:rgba(184,150,90,.3); color:var(--gold); }
    .t-bubble i { color:var(--gold); font-size:.68rem; }

    .hgrid {
      position:absolute; inset:0; pointer-events:none;
      background-image:
        linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px);
      background-size:60px 60px;
    }
    .hglow {
      position:absolute; top:-130px; right:-100px;
      width:500px; height:500px; border-radius:50%;
      background:radial-gradient(circle at 40% 40%,rgba(184,150,90,.14) 0%,transparent 65%);
      pointer-events:none;
    }
    .eyebrow {
      display:inline-flex; align-items:center; gap:.55rem;
      font-size:.7rem; font-weight:600; letter-spacing:3px;
      text-transform:uppercase; color:var(--gold); margin-bottom:1.4rem;
    }
    .eyebrow::before,.eyebrow::after { content:''; width:22px; height:1px; background:var(--gold); opacity:.5; }
   
    .h-rule { width:42px; height:2px; background:linear-gradient(90deg,var(--gold),transparent); margin-bottom:1.4rem; }
    .hero-lead {
      color:rgba(255,255,255,.56); font-size:1.04rem;
      line-height:1.85; max-width:460px; font-weight:300;
    }
    .hero-lead strong { color:rgba(255,255,255,.88); font-weight:500; }

    /* ════════════ SECTION TAG ════════════ */
    .stag {
      display:inline-flex; align-items:center; gap:.5rem;
      font-size:.7rem; font-weight:600; letter-spacing:2.5px;
      text-transform:uppercase; color:var(--gold); margin-bottom:.7rem;
    }
    .stag::before { content:''; width:18px; height:1.5px; background:var(--gold); display:inline-block; }

    /* ════════════ INTRO ════════════ */
    .intro { padding:6rem 0 5rem; background:var(--cream); }
    .intro h2 { font-size:clamp(2.2rem,4vw,3.3rem); color:var(--ink); font-weight:400; line-height:1.2; margin-bottom:1.2rem; }
    .intro h2 em { font-style:italic; color:var(--gold); }
    .intro p { color:var(--gray); font-size:.96rem; line-height:1.88; max-width:520px; }

    /* quote card */
    .qcard {
      background:var(--ink); border-radius:18px; padding:2.6rem;
      position:relative; overflow:hidden; height:100%;
      display:flex; flex-direction:column; justify-content:center;
    }
    .qcard::before {
      content:'\201C'; font-family:'Cormorant Garamond',serif;
      font-size:13rem; color:rgba(184,150,90,.07);
      position:absolute; top:-30px; left:8px; line-height:1; pointer-events:none;
    }
    .qcard blockquote {
      font-family:'Cormorant Garamond',serif;
      font-size:1.48rem; font-weight:400; font-style:italic;
      color:rgba(255,255,255,.8); line-height:1.6;
      position:relative; z-index:1; margin:0 0 1.3rem;
    }
     .qcard blockquote p{
      font-family:'Cormorant Garamond',serif;
      font-size:1.48rem; font-weight:400; font-style:italic;
      color:rgba(255,255,255,.8); line-height:1.6;
      position:relative; z-index:1; margin:0 0 1.3rem;
    }
    .q-rule { width:28px; height:2px; background:var(--gold); margin-bottom:.8rem; }
    .q-src { font-size:.72rem; font-weight:600; letter-spacing:1.8px; text-transform:uppercase; color:var(--gold); }

    /* ════════════ CREDENTIAL CARDS ════════════ */
    .creds { padding:6rem 0; background:var(--white); position:relative; }
    .creds::before {
      content:''; position:absolute; top:0; left:0; right:0; height:1px;
      background:linear-gradient(90deg,transparent,var(--border),transparent);
    }
    .cc {
      background:var(--white); border:1px solid var(--border);
      border-radius:16px; padding:2rem 1.8rem; height:100%;
      position:relative; overflow:hidden;
      transition:all .32s cubic-bezier(.25,.46,.45,.94);
    }
    .cc::before {
      content:''; position:absolute; top:0; left:0;
      width:3px; height:0; background:var(--gold); transition:height .4s ease;
    }
    .cc:hover { background:var(--white); border-color:var(--gold-pale); transform:translateY(-5px); box-shadow:0 18px 46px rgba(14,17,23,.07); }
    .cc:hover::before { height:100%; }
    .cc-n { font-family:'Cormorant Garamond',serif; font-size:3rem; font-weight:300; color:rgba(14,17,23,.06); line-height:1; margin-bottom:.6rem; transition:color .3s; }
    .cc:hover .cc-n { color:rgba(184,150,90,.12); }
    .cc-ico { width:46px; height:46px; border-radius:12px; background:var(--ink); display:flex; align-items:center; justify-content:center; margin-bottom:1rem; transition:background .3s,transform .3s; }
    .cc:hover .cc-ico { background:var(--gold); transform:rotate(-4deg); }
    .cc-ico i { color:var(--gold); font-size:1.05rem; transition:color .3s; }
    .cc:hover .cc-ico i { color:var(--ink); }
    .cc-title { font-family:'Cormorant Garamond',serif; font-size:1.18rem; font-weight:600; color:var(--ink); margin-bottom:.5rem; line-height:1.3; }
    .cc-body { color:var(--gray); font-size:.85rem; line-height:1.75; }

    /* ════════════ EXPERTISE — DARK ════════════ */
    .exp-dark { padding:6rem 0; background:var(--ink); position:relative; overflow:hidden; }
    .exp-dark::before {
      content:''; position:absolute; inset:0;
      background-image:
        linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px);
      background-size:55px 55px;
    }
    .exp-orb { position:absolute; bottom:-80px; right:-80px; width:440px; height:440px; border-radius:50%; background:radial-gradient(circle,rgba(184,150,90,.08) 0%,transparent 65%); pointer-events:none; }
    .exp-row {
      display:flex; align-items:flex-start; gap:1.1rem;
      padding:1.35rem 0; border-bottom:1px solid rgba(255,255,255,.07);
    }
    .exp-row:last-child { border-bottom:none; padding-bottom:0; }
    .exp-ico { width:42px; height:42px; border-radius:10px; background:rgba(184,150,90,.11); display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:background .25s; }
    .exp-row:hover .exp-ico { background:rgba(184,150,90,.22); }
    .exp-ico i { color:var(--gold); font-size:.88rem; }
    .exp-row h5 { font-family:'Outfit',sans-serif; font-size:.9rem; font-weight:600; color:var(--white); margin-bottom:.28rem; }
    .exp-row p { color:rgba(255,255,255,.4); font-size:.82rem; line-height:1.65; margin:0; }

    /* ════════════ VALUES ════════════ */
    .vals { padding:5.5rem 0; background:var(--cream); }
    .val-item { text-align:center; padding:2rem 1.5rem; }
    .v-ico { width:58px; height:58px; border-radius:50%; background:var(--ink); display:flex; align-items:center; justify-content:center; margin:0 auto 1rem; transition:background .3s,transform .3s; }
    .val-item:hover .v-ico { background:var(--gold); transform:translateY(-4px); }
    .v-ico i { color:var(--gold); font-size:1.15rem; transition:color .3s; }
    .val-item:hover .v-ico i { color:var(--ink); }
    .v-title { font-family:'Cormorant Garamond',serif; font-size:1.2rem; font-weight:600; color:var(--ink); margin-bottom:.45rem; }
    .v-desc { color:var(--gray); font-size:.84rem; line-height:1.7; max-width:190px; margin:0 auto; }
    .v-sep { width:1px; background:var(--border); align-self:stretch; margin:2rem 0; }

    .hglow{position:absolute;top:-140px;right:-100px;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle at 40%,rgba(184,150,90,.15) 0%,transparent 65%);pointer-events:none;}
    .hglow2{position:absolute;bottom:40px;left:-80px;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,rgba(184,150,90,.06) 0%,transparent 70%);pointer-events:none;}
    .eyebrow{display:inline-flex;align-items:center;gap:.55rem;font-size:.7rem;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:var(--gold);margin-bottom:1.4rem;}
    .eyebrow::before,.eyebrow::after{content:'';width:22px;height:1px;background:var(--gold);opacity:.5;}
  
    .h-rule{width:42px;height:2px;background:linear-gradient(90deg,var(--gold),transparent);margin-bottom:1.4rem;}
    .hero-lead{color:rgba(255,255,255,.58);font-size:1.04rem;line-height:1.85;max-width:520px;font-weight:300;}
    .hero-lead strong{color:rgba(255,255,255,.88);font-weight:500;}

    /* hero reward pill */
    .reward-pill{
      display:inline-flex;align-items:center;gap:.6rem;
      background:rgba(184,150,90,.15);border:1px solid rgba(184,150,90,.3);
      border-radius:50px;padding:.5rem 1.3rem;
      font-size:.82rem;font-weight:600;color:var(--gold);
      margin-top:1.8rem;
    }
    .reward-pill i{font-size:.78rem;}

    /* ════════ SECTION TAG ════════ */
    .stag{display:inline-flex;align-items:center;gap:.5rem;font-size:.7rem;font-weight:600;letter-spacing:2.5px;text-transform:uppercase;color:var(--gold);margin-bottom:.7rem;}
    .stag::before{content:'';width:18px;height:1.5px;background:var(--gold);display:inline-block;}

    /* ════════ HOW IT WORKS ════════ */
    .how{padding:6rem 0;background:var(--cream);}
    .how h2{font-size:clamp(2.2rem,4vw,3.2rem);color:var(--ink);font-weight:400;line-height:1.2;margin-bottom:.5rem;}
    .how h2 em{font-style:italic;color:var(--gold);}
    .how .sub{color:var(--gray);font-size:.96rem;line-height:1.85;max-width:520px;margin-bottom:3.5rem;}

    /* step cards */
    .step-wrap{position:relative;}
    /* connector line on desktop */
    .step-connector{
      position:absolute;top:36px;left:calc(16.66% + 36px);
      width:calc(66.66% - 72px);height:2px;
      background:linear-gradient(90deg,var(--gold),var(--gold-lt),var(--gold));
      opacity:.25;z-index:0;
    }
    @media(max-width:767px){.step-connector{display:none;}}

    .step-card{
      background:var(--white);border:1px solid var(--border);
      border-radius:18px;padding:2.2rem 1.8rem;height:100%;
      position:relative;z-index:1;
      transition:all .32s cubic-bezier(.25,.46,.45,.94);
      text-align:center;
    }
    .step-card:hover{border-color:var(--gold-pale);transform:translateY(-5px);box-shadow:0 18px 46px rgba(14,17,23,.07);}
    .step-num{
      width:52px;height:52px;border-radius:50%;
      background:var(--ink);color:var(--gold);
      font-family:'Cormorant Garamond',serif;font-size:1.4rem;font-weight:700;
      display:flex;align-items:center;justify-content:center;
      margin:0 auto 1.2rem;
      border:3px solid var(--cream);
      box-shadow:0 0 0 2px var(--ink);
      transition:background .3s,box-shadow .3s;
    }
    .step-card:hover .step-num{background:var(--gold);color:var(--ink);box-shadow:0 0 0 2px var(--gold);}
    .step-icon{font-size:1.6rem;color:var(--gold);opacity:.35;margin-bottom:.8rem;transition:opacity .3s;}
    .step-card:hover .step-icon{opacity:.7;}
    .step-title{font-family:'Cormorant Garamond',serif;font-size:1.3rem;font-weight:600;color:var(--ink);margin-bottom:.6rem;}
    .step-body{color:var(--gray);font-size:.87rem;line-height:1.75;}

    /* ════════ WHAT YOU EARN ════════ */
    .earn{padding:6rem 0;background:var(--navy);position:relative;overflow:hidden;}
    .earn::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px);background-size:55px 55px;}
    .earn-orb{position:absolute;bottom:-80px;left:-80px;width:440px;height:440px;border-radius:50%;background:radial-gradient(circle,rgba(184,150,90,.08) 0%,transparent 65%);pointer-events:none;}

    .earn h2{font-size:clamp(2rem,3.5vw,3rem);color:var(--white);font-weight:400;line-height:1.2;margin-bottom:.6rem;}
    .earn h2 em{font-style:italic;color:var(--gold);}
    .earn .sub2{color:rgba(255,255,255,.46);font-size:.94rem;line-height:1.8;max-width:400px;margin-bottom:0;}

    /* big reward card */
    .reward-card{
      background:rgba(255,255,255,.05);border:1px solid rgba(184,150,90,.2);
      border-radius:20px;padding:2.8rem 2.5rem;height:100%;
    }
    .rc-num{font-family:'Cormorant Garamond',serif;font-size:4.5rem;font-weight:300;color:var(--gold);line-height:1;}
    .rc-lbl{font-size:.75rem;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:rgba(255,255,255,.4);margin-top:.2rem;}
    .rc-rule{width:32px;height:2px;background:var(--gold);margin:1.2rem 0;}
    .rc-desc{color:rgba(255,255,255,.6);font-size:.9rem;line-height:1.75;}

    /* earn list */
    .earn-list{list-style:none;padding:0;margin:0;}
    .earn-list li{
      display:flex;align-items:flex-start;gap:.9rem;
      padding:1.1rem 0;border-bottom:1px solid rgba(255,255,255,.07);
    }
    .earn-list li:last-child{border-bottom:none;}
    .earn-list .eli{
      width:36px;height:36px;border-radius:9px;
      background:rgba(184,150,90,.12);
      display:flex;align-items:center;justify-content:center;flex-shrink:0;
      transition:background .25s;
    }
    .earn-list li:hover .eli{background:rgba(184,150,90,.22);}
    .earn-list .eli i{color:var(--gold);font-size:.8rem;}
    .earn-list .el-title{font-size:.9rem;font-weight:600;color:var(--white);margin-bottom:.2rem;}
    .earn-list .el-desc{font-size:.81rem;color:rgba(255,255,255,.42);line-height:1.6;margin:0;}

    /* ════════ WHO CAN REFER + WHY REFER ════════ */
    .who-why{padding:6rem 0;background:var(--white);position:relative;}
    .who-why::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--border),transparent);}

    /* who card */
    .who-card{
      background:var(--cream);border:1px solid var(--border);
      border-radius:16px;padding:1.4rem 1.5rem;
      display:flex;align-items:center;gap:.9rem;
      transition:all .28s;
    }
    .who-card:hover{border-color:var(--gold-pale);background:var(--white);transform:translateX(4px);box-shadow:0 6px 20px rgba(14,17,23,.06);}
    .who-ico{width:40px;height:40px;border-radius:10px;background:var(--ink);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .3s;}
    .who-card:hover .who-ico{background:var(--gold);}
    .who-ico i{color:var(--gold);font-size:.85rem;transition:color .3s;}
    .who-card:hover .who-ico i{color:var(--ink);}
    .who-label{font-size:.88rem;font-weight:600;color:var(--ink);}

    /* why list */
    .why-item{
      display:flex;align-items:flex-start;gap:.9rem;
      padding:1rem 0;border-bottom:1px solid var(--border);
    }
    .why-item:last-child{border-bottom:none;padding-bottom:0;}
    .why-ico{width:36px;height:36px;border-radius:9px;background:var(--gold-pale);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .25s;}
    .why-item:hover .why-ico{background:var(--gold);}
    .why-ico i{color:var(--gold);font-size:.8rem;transition:color .3s;}
    .why-item:hover .why-ico i{color:var(--white);}
    .why-text h6{font-family:'Outfit',sans-serif;font-size:.9rem;font-weight:600;color:var(--ink);margin-bottom:.2rem;}
    .why-text p{font-size:.82rem;color:var(--gray);line-height:1.6;margin:0;}

    /* ════════ REFERRAL FORM CTA ════════ */
    .ref-cta{padding:6rem 0;background:var(--cream);position:relative;}
    .ref-cta::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--border),transparent);}

    .form-card{
      background:var(--white);border:1px solid var(--border);
      border-radius:20px;padding:3rem;
      box-shadow:0 4px 24px rgba(14,17,23,.06);
    }
    .fl{display:block;font-size:.82rem;font-weight:600;color:var(--ink);margin-bottom:.4rem;}
    .fl .req{color:var(--gold);}
    .fi,.fs,.ft{
      width:100%;border:1.5px solid var(--border);border-radius:8px;
      padding:.72rem 1rem;font-size:.9rem;font-family:'Outfit',sans-serif;
      color:var(--text);background:var(--white);outline:none;
      transition:border-color .2s,box-shadow .2s;
    }
    .fi:focus,.fs:focus,.ft:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(184,150,90,.1);}
    .fi::placeholder,.ft::placeholder{color:var(--gray-lt);}
    .ft{resize:vertical;min-height:100px;}
    .fi.err{border-color:#ef4444;}

    /* submit + partner btns */
    .btn-gld{display:inline-flex;align-items:center;gap:.55rem;background:var(--gold);color:var(--ink);font-weight:700;border:none;border-radius:8px;padding:.88rem 2.1rem;font-size:.9rem;text-decoration:none;transition:all .25s;font-family:'Outfit',sans-serif;cursor:pointer;}
    .btn-gld:hover{background:var(--gold-lt);color:var(--ink);transform:translateY(-2px);box-shadow:0 10px 28px rgba(184,150,90,.3);}
    .btn-ink{display:inline-flex;align-items:center;gap:.55rem;background:var(--ink);color:var(--white);font-weight:700;border:none;border-radius:8px;padding:.86rem 2rem;font-size:.9rem;text-decoration:none;transition:all .25s;font-family:'Outfit',sans-serif;cursor:pointer;}
    .btn-ink:hover{background:var(--ink-soft);color:var(--white);transform:translateY(-2px);}

    /* success */
    .form-success{display:none;text-align:center;padding:2.5rem 1rem;}
    .fsc{width:68px;height:68px;border-radius:50%;background:rgba(16,185,129,.1);border:2px solid var(--green);display:flex;align-items:center;justify-content:center;margin:0 auto 1.2rem;animation:popIn .4s cubic-bezier(.34,1.56,.64,1);}
    @keyframes popIn{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}
    .fsc i{font-size:1.8rem;color:var(--green);}
    .form-success h4{color:var(--ink);margin-bottom:.5rem;}
    .form-success p{color:var(--gray);font-size:.9rem;line-height:1.7;}

    /* spinner */
    .spin{display:none;width:16px;height:16px;border:2px solid rgba(14,17,23,.2);border-top-color:var(--ink);border-radius:50%;animation:rot .7s linear infinite;}
    @keyframes rot{to{transform:rotate(360deg)}}

    /* partner strip */
    .partner-strip{
      background:linear-gradient(135deg,var(--ink) 0%,var(--ink-soft) 100%);
      padding:5rem 0;position:relative;overflow:hidden;text-align:center;
    }
    .partner-strip::before{content:'';position:absolute;top:-60px;right:-60px;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(184,150,90,.1) 0%,transparent 65%);}
    .partner-strip h2{font-size:clamp(1.9rem,3.5vw,3rem);color:var(--white);font-weight:300;line-height:1.25;margin-bottom:.9rem;}
    .partner-strip h2 em{font-style:italic;color:var(--gold);}
    .partner-strip p{color:rgba(255,255,255,.47);font-size:.94rem;line-height:1.8;max-width:440px;margin:0 auto 2.2rem;}
    .btn-ol{display:inline-flex;align-items:center;gap:.55rem;background:transparent;color:rgba(255,255,255,.7);font-weight:600;border:1.5px solid rgba(255,255,255,.2);border-radius:8px;padding:.86rem 1.8rem;font-size:.9rem;text-decoration:none;transition:all .25s;font-family:'Outfit',sans-serif;}
    .btn-ol:hover{border-color:var(--gold);color:var(--gold);}
    .btn-ol-gold{display:inline-flex;align-items:center;gap:.55rem;background:var(--gold);color:var(--ink);font-weight:700;border:none;border-radius:8px;padding:.88rem 2.1rem;font-size:.9rem;text-decoration:none;transition:all .25s;font-family:'Outfit',sans-serif;}
    .btn-ol-gold:hover{background:var(--gold-lt);color:var(--ink);transform:translateY(-2px);box-shadow:0 10px 28px rgba(184,150,90,.3);}
  


    /* Section header */
    .stag {
      display: inline-flex; align-items: center; gap: .5rem;
      font-size: .7rem; font-weight: 600; letter-spacing: 2.5px;
      text-transform: uppercase; color: var(--gold); margin-bottom: .6rem;
    }
    .stag::before { content: ''; width: 18px; height: 1.5px; background: var(--gold); display: inline-block; }
    .sec-heading {
      font-size: clamp(2rem, 3.8vw, 3rem);
      color: var(--ink); font-weight: 400; line-height: 1.2; margin-bottom: .6rem;
    }
    .sec-heading em { font-style: italic; color: var(--gold); }
    .sec-sub { color: var(--gray); font-size: .94rem; line-height: 1.8; max-width: 500px; }

    /* ── Service Card ── */
    .svc-card {
      background: var(--white);
      border: 1px solid var(--border);
      border-radius: 16px;
      overflow: hidden;
      height: 100%;
      transition: all .35s cubic-bezier(.25,.46,.45,.94);
      position: relative;
    }
    .svc-card::after {
      content: '';
      position: absolute; bottom: 0; left: 0; right: 0;
      height: 3px;
      background: linear-gradient(90deg, var(--gold), var(--gold-lt));
      transform: scaleX(0);
      transform-origin: left;
      transition: transform .4s ease;
    }
    .svc-card:hover {
      transform: translateY(-6px);
      border-color: transparent;
      box-shadow: 0 22px 56px rgba(14,17,23,.1);
    }
    .svc-card:hover::after { transform: scaleX(1); }

    /* Image panel */
    .svc-img {
      position: relative;
      height: 230px;
      overflow: hidden;
    }
    .svc-img .img-placeholder {
      width: 100%; height: 100%;
      display: flex; align-items: center; justify-content: center;
      transition: transform .5s ease;
    }
    .svc-card:hover .img-placeholder { transform: scale(1.04); }

    /* Gradient overlays per card */
    .img-1 { background: linear-gradient(135deg, #0e2240 0%, #1a3a6e 40%, #0e2a50 100%); }
    .img-2 { background: linear-gradient(135deg, #1a1a0e 0%, #2e2a08 40%, #1a1508 100%); }
    .img-3 { background: linear-gradient(135deg, #0a1f2b 0%, #103240 50%, #0d2535 100%); }
    .img-4 { background: linear-gradient(135deg, #1a0e2e 0%, #2e1a4a 50%, #1a0e2e 100%); }
    .img-5 { background: linear-gradient(135deg, #0e1a0e 0%, #1a2e1a 50%, #0e1a0e 100%); }
    .img-6 { background: linear-gradient(135deg, #2e0e0e 0%, #4a1a1a 50%, #2e0e0e 100%); }

    /* Big icon inside image */
    .svc-big-icon { font-size: 4.5rem; color: rgba(255,255,255,.12); position: relative; z-index: 1; }
    /* Floating icon group */
    .svc-icon-cluster {
      position: absolute; inset: 0;
      display: flex; align-items: center; justify-content: center;
      flex-direction: column; gap: 0;
    }
     .svc-icon-cluster img {
      width: 100%;
     }
    .svc-icon-main {
      width: 72px; height: 72px; border-radius: 18px;
      background: rgba(184,150,90,.2); border: 1.5px solid rgba(184,150,90,.35);
      display: flex; align-items: center; justify-content: center;
      transition: background .3s, transform .3s;
    }
    .svc-card:hover .svc-icon-main { background: rgba(184,150,90,.3); transform: scale(1.08) rotate(-3deg); }
    .svc-icon-main i { color: var(--gold); font-size: 1.8rem; }
    /* Small floating chips */
    .chip-row { display: flex; gap: .5rem; margin-top: .8rem; }
    .chip {
      background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.15);
      border-radius: 50px; padding: .22rem .7rem;
      font-size: .65rem; font-weight: 600; color: rgba(255,255,255,.65);
      font-family: 'Outfit', sans-serif; letter-spacing: .4px;
    }
    /* Category label on image */
    .img-label {
      position: absolute; top: 1rem; left: 1rem;
      background: rgba(184,150,90,.2); border: 1px solid rgba(184,150,90,.35);
      border-radius: 50px; padding: .25rem .8rem;
      font-size: .65rem; font-weight: 700; letter-spacing: 1.2px;
      text-transform: uppercase; color: var(--gold);
      font-family: 'Outfit', sans-serif;
    }

    /* Card body */
    .svc-body { padding: 1.6rem 1.8rem 2rem; }
    .svc-title {
      font-family: 'Cormorant Garamond', serif;
      font-size: 1.3rem; font-weight: 600; color: var(--ink);
      margin-bottom: .6rem; line-height: 1.3;
      transition: color .2s;
    }
    .svc-card:hover .svc-title { color: var(--gold); }
    .svc-desc {
      color: var(--gray); font-size: .875rem; line-height: 1.78;
      margin-bottom: 1.3rem;
    }
    .svc-link {
      display: inline-flex; align-items: center; gap: .4rem;
      font-size: .8rem; font-weight: 700; color: var(--gold);
      text-decoration: none; letter-spacing: .3px;
      transition: gap .2s, color .2s;
    }
    .svc-link:hover { color: var(--ink); gap: .7rem; }
    .svc-link i { font-size: .7rem; }