:root{
  --navy-950:#111d33;
  --navy-900:#16233d;
  --navy-800:#1f3357;
  --navy-700:#2f4a73;
  --navy-600:#3d5c8a;
  --navy-100:#e8edf5;
  --paper:#f6f7fb;
  --white:#ffffff;
  --ink:#1b2436;
  --ink-soft:#5b6577;
  --gold:#c79a3d;
  --gold-soft:#f4e9d3;
  --line:#e3e7ef;
  --radius:14px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;font-family:'Inter',system-ui,sans-serif;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;}
h1,h2,h3,h4,.font-display{font-family:'Plus Jakarta Sans',system-ui,sans-serif;letter-spacing:-.01em;margin:0;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
::selection{background:var(--gold);color:var(--navy-950);}
@media (prefers-reduced-motion: reduce){*{animation-duration:.001ms !important;transition-duration:.001ms !important;}}

/* ---------- utility bar ---------- */
.utility-bar{background:var(--navy-950);color:#c7d0e0;font-size:12.5px;}
.utility-bar .row{min-height:36px;align-items:center;}
.utility-bar span{opacity:.9;}
.utility-links{display:flex;gap:18px;}
.utility-links a:hover{color:#fff;}

/* ---------- header ---------- */
header.main{background:var(--white);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:60;}
.nav-row{min-height:72px;align-items:center;}
.logo{display:flex;align-items:center;gap:9px;font-family:'Plus Jakarta Sans';font-weight:800;font-size:19px;color:var(--navy-800);}
.logo img{height:34px;border-radius:9px;object-fit:cover;}
nav.primary{display:flex;align-items:center;gap: 40px;font-size:14px;font-weight:600;color:var(--navy-800);}
nav.primary .current{color:var(--navy-700);}
.header-cta{display:flex;align-items:center;gap:10px;justify-content:flex-end;}
.btn-brand{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:999px;font-weight:700;font-size:13.5px;border:1px solid transparent;white-space:nowrap;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,background .15s ease;}
.btn-brand:hover{transform:translateY(-1px);}
.btn-gold{background:var(--gold);color:var(--navy-950);box-shadow:0 8px 18px -8px rgba(199,154,61,.6);}
.btn-gold:hover{background:#d6ab4d;color:var(--navy-950);}
.btn-outline-navy{border-color:var(--navy-700);color:var(--navy-700);}
.btn-outline-navy:hover{background:var(--navy-700);color:#fff;}
.btn-block{width:100%;justify-content:center;}
.nav-toggle{background:none;border:none;padding:6px;cursor:pointer;}
.nav-toggle span{display:block;width:22px;height:2px;background:var(--navy-800);margin:5px 0;border-radius:2px;}

/* ---------- breadcrumb strip ---------- */
.breadcrumb-strip{background:var(--navy-950);color:#9fadc7;font-size:12.5px;padding:12px 0;}
.breadcrumb-strip a:hover{color:#fff;}

/* ---------- hero ---------- */
.hero{padding:52px 0 64px;}
.eyebrow{display:inline-flex;align-items:center;gap:8px;background:var(--gold-soft);border:1px solid #e6d3a3;color:#8a6a1f;padding:6px 13px;border-radius:999px;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;margin-bottom:16px;}
.eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--gold);}
.hero h1{font-size:38px;line-height:1.15;font-weight:800;color:var(--navy-950);margin-bottom:16px;}
.hero h1 span{color:var(--navy-700);}
.hero .sub{font-size:15.5px;color:var(--ink-soft);line-height:1.7;margin-bottom:22px;}
.trust-row{display:flex;gap:22px;flex-wrap:wrap;margin-bottom:28px;}
.trust-row .item{display:flex;align-items:center;gap:8px;font-size: 15px;font-weight:600;color:var(--navy-800);}
.trust-row .item img{width:16px;height:16px;flex-shrink:0;}
.hero-image{border-radius:18px;overflow:hidden;border:1px solid var(--line);position:relative;min-height:230px;display:flex;align-items:flex-end;padding:24px;}
.hero-image img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.hero-image .overlay{position:absolute;inset:0;background:linear-gradient(150deg, rgba(17,29,51,.85), rgba(47,74,115,.75));z-index:0;}
.hero-image .cap{position:relative;z-index:1;color:#fff;}
.hero-image .cap b{display:block;font-family:'Plus Jakarta Sans';font-size:16px;font-weight:800;}
.hero-image .cap span{font-size:12.5px;color:#c3cee3;}

/* ---------- sticky enquiry form ---------- */
.enquiry-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:24px;box-shadow:0 24px 48px -30px rgba(17,29,51,.35);position:sticky;top:96px;}
.enquiry-card h3{font-size:17px;font-weight:800;color:var(--navy-950);margin-bottom:4px;}
.enquiry-card p{font-size:12.5px;color:var(--ink-soft);margin:0 0 18px;line-height:1.5;}
.field{margin-bottom:12px;}
.field label{display:block;font-size:12px;font-weight:700;color:var(--navy-800);margin-bottom:5px;}
.field input, .field select{
  width:100%;padding:10px 12px;border-radius:9px;border:1px solid var(--line);
  font-family:inherit;font-size:13.5px;color:var(--ink);background:var(--paper);
}
.field input:focus, .field select:focus{outline:2px solid var(--navy-700);outline-offset:1px;border-color:transparent;}
.enquiry-card .fine{font-size:11px;color:#8b95a8;margin-top:10px;text-align:center;}

/* ---------- trusted brands strip ---------- */
.trusted-brands{background: #f6f7fb;border-top:1px solid var(--line);/* border-bottom:1px solid var(--line); */padding: 45px 0;}
.trusted-brands .label{font-size:11.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);text-align:center;margin-bottom:16px;}
.brand-row{display:flex;align-items:center;justify-content:center;gap:38px;flex-wrap:wrap;}
.brand-row .brand-item{display:flex;align-items:center;justify-content:center;}
.brand-row .brand-logo{height: 43px;/* max-width: 108px; */width:auto;object-fit:contain;/* filter:grayscale(100%); *//* opacity:.55; *//* transition:opacity .2s ease, filter .2s ease; *//* border: 1px solid gainsboro; */}
.brand-row .brand-logo:hover{filter:grayscale(0%);opacity:1;}

/* ---------- client reviews ---------- */
.reviews-section{padding: 20px 0 30px;}
.reviews-section .section-head{text-align:center;max-width:560px;margin:0 auto 28px;}
.reviews-section .section-head span.eyebrow{margin-bottom:10px;}
.reviews-section .section-head h2{font-size:25px;font-weight:800;color:var(--navy-950);margin-bottom:8px;}
.reviews-section .section-head p{font-size:14px;color:var(--ink-soft);margin:0;line-height:1.6;}
.review-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:22px;height:100%;display:flex;flex-direction:column;}
.review-card .stars{color:var(--gold);font-size:14px;letter-spacing:2px;margin-bottom:10px;}
.review-card p.text{font-size:13.5px;color:var(--ink-soft);line-height:1.7;margin:0 0 18px;flex-grow:1;}
.review-card .author{display:flex;align-items:center;gap:10px;padding-top:14px;border-top:1px solid var(--line);}
.review-card .avatar{width:38px;height:38px;border-radius:50%;background:var(--navy-100);color:var(--navy-700);display:flex;align-items:center;justify-content:center;font-family:'Plus Jakarta Sans';font-weight:800;font-size:13.5px;flex-shrink:0;}
.review-card .author b{display:block;font-size:13.5px;color:var(--navy-950);}
.review-card .author span{font-size:12px;color:var(--ink-soft);}

/* ---------- article shell ---------- */
.article-section{padding:10px 0 20px;}
.content h2{font-size:25px;font-weight:800;color:var(--navy-950);margin:44px 0 14px;}
.content h2:first-child{margin-top:0;}
.content h3{font-size:18px;font-weight:700;color:var(--navy-950);margin:26px 0 8px;}
.content p{font-size:14.5px;line-height:1.75;color:var(--ink-soft);margin:0 0 14px;}
.content strong{color:var(--navy-800);}
.content ul, .content ol{margin:0 0 16px;padding-left:20px;color:var(--ink-soft);font-size:14.5px;line-height:1.75;}
.content li{margin-bottom:6px;}
.content a.inline-link{color:var(--navy-700);font-weight:700;text-decoration:underline;text-decoration-color:#c7d3e8;text-underline-offset:3px;}

/* ---------- service entries ---------- */
.service-entry{border-top:1px solid var(--line);padding:22px 0;}
.service-entry:first-of-type{border-top:none;padding-top:6px;}
.service-entry .tag{
  display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:800;
  letter-spacing:.04em;text-transform:uppercase;color:var(--navy-700);
  background:var(--navy-100);padding:4px 10px;border-radius:999px;margin-bottom:10px;
}
.service-entry h3{margin-top:0;margin-bottom:8px;}
.service-entry .learn{font-size:13.5px;font-weight:700;color:var(--navy-700);display:inline-flex;align-items:center;gap:6px;}
.service-entry .learn img{width:13px;height:13px;}

/* ---------- benefits table ---------- */
.tbl-wrap{overflow-x:auto;margin-bottom:20px;border:1px solid var(--line);border-radius:12px;}
table.benefits{width:100%;border-collapse:collapse;font-size:13.5px;background:var(--white);}
table.benefits th{
  background:var(--navy-950);color:#fff;text-align:left;padding:12px 16px;font-weight:700;font-size:12.5px;
  text-transform:uppercase;letter-spacing:.03em;
}
table.benefits td{padding:12px 16px;border-top:1px solid var(--line);color:var(--ink-soft);}
table.benefits tr td:first-child{color:var(--navy-800);font-weight:700;white-space:nowrap;}

/* ---------- process steps ---------- */
.process-list{list-style:none;margin:0 0 20px;padding:0;counter-reset:step;}
.process-list li{
  counter-increment:step;position:relative;padding:14px 0 14px 46px;
  border-top:1px solid var(--line);font-size:14.5px;color:var(--ink-soft);line-height:1.6;
}
.process-list li:first-child{border-top:none;}
.process-list li::before{
  content:counter(step);position:absolute;left:0;top:12px;width:30px;height:30px;border-radius:9px;
  background:var(--navy-700);color:#fff;font-family:'Plus Jakarta Sans';font-weight:800;font-size:13px;
  display:flex;align-items:center;justify-content:center;
}
.process-list li b{display:block;color:var(--navy-950);font-size:14.5px;margin-bottom:2px;}

/* ---------- documents grid ---------- */
.doc-card{border:1px solid var(--line);background:var(--white);border-radius:12px;padding:16px 18px;height:100%;}
.doc-card h4{font-size:14px;font-weight:700;color:var(--navy-950);margin-bottom:5px;display:flex;align-items:center;gap:8px;}
.doc-card h4 img{width:15px;height:15px;flex-shrink:0;}
.doc-card p{font-size:12.5px;color:var(--ink-soft);margin:0;line-height:1.55;}

/* ---------- sidebar ---------- */
.side-stack{position:sticky;top:96px;}
.side-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:20px;margin-bottom:18px;}
.side-card h4{font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--navy-700);margin-bottom:12px;}
.side-card ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;}
.side-card ul a{font-size:13.5px;font-weight:600;color:var(--ink);display:flex;justify-content:space-between;align-items:center;padding:6px 0;border-bottom:1px dashed var(--line);}
.side-card ul li:last-child a{border-bottom:none;}
.side-card ul a:hover{color:var(--navy-700);}
.side-cta{background:linear-gradient(150deg,var(--navy-950),var(--navy-700));border-radius:var(--radius);padding:22px;color:#fff;margin-bottom:18px;}
.side-cta h4{color:#fff;font-size:15px;font-weight:800;margin-bottom:6px;}
.side-cta p{color:#b9c5dd;font-size:12.5px;margin:0 0 14px;line-height:1.55;}

/* ---------- coverage ---------- */
.coverage-col h4{font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--navy-700);margin-bottom:12px;}
.coverage-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;font-size:13.5px;}
.coverage-col a:hover{color:var(--navy-700);text-decoration:underline;}

/* ---------- faq accordion (native <details>) ---------- */
.faq-item{border-bottom:1px solid var(--line);}
.faq-item:first-child{border-top:1px solid var(--line);}
.faq-item summary{
  list-style:none;cursor:pointer;padding:18px 4px;display:flex;justify-content:space-between;align-items:center;gap:16px;
  font-weight:700;font-size:15px;color:var(--navy-950);
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary .plus{
  flex-shrink:0;width:26px;height:26px;border-radius:8px;background:var(--navy-100);color:var(--navy-700);
  display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:800;transition:transform .2s ease;
}
.faq-item[open] summary .plus{transform:rotate(45deg);background:var(--gold);color:var(--navy-950);}
.faq-item .a{padding:0 4px 20px;font-size:14px;color:var(--ink-soft);line-height:1.7;}

/* ---------- CTA banner ---------- */
.cta-banner{
  background:linear-gradient(120deg,var(--navy-950),var(--navy-800));border-radius:20px;padding:40px 42px;color:#fff;
  position:relative;overflow:hidden;margin:52px 0;
}
.cta-banner::after{content:"";position:absolute;right:-50px;top:-50px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle, rgba(199,154,61,.25), transparent 65%);}
.cta-banner h3{font-size:22px;font-weight:800;margin-bottom:6px;color: #fff;}
.cta-banner p{color:#b9c5dd;font-size:13.5px;margin:0;}
.cta-actions{display:flex;gap:12px;flex-wrap:wrap;position:relative;z-index:1;}

/* ---------- footer ---------- */
footer{background:var(--navy-950);color:#8fa0c2;padding:48px 0 22px;font-size:13px;}
.footer-col h5{color:#fff;font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;margin-bottom:14px;}
.footer-col p{font-size:13px;line-height:1.7;color:#8fa0c2;margin:0 0 10px;}
.footer-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;}
.footer-col a:hover{color:#fff;}
.footer-bottom{padding-top:20px;margin-top:32px;border-top:1px solid rgba(255,255,255,.08);font-size:12px;color:#63719a;}

/* ---------- floating whatsapp ---------- */
.float-wa{
  position:fixed;
  right:22px;
  bottom:22px;
  width:54px;
  height:54px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  box-shadow:0 12px 26px -8px rgba(37,211,102,.6);
  z-index:70;
  background:#25D366;
  font-size: 25px;
  color: #fff;
}
.float-wa img{width:27px;height:27px;}

@media (max-width: 991.98px){
  .enquiry-card, .side-stack{position:static;}
}
@media (max-width: 767.98px){
  nav.primary,.header-cta .btn-outline-navy{display:none;}
  .utility-bar{display:none;}
  .hero h1{font-size:29px;}
  .cta-banner{padding:30px 24px;}
  .cta-banner .row{text-align:left;}
  .brand-row{gap:22px;}
  .brand-row .brand-logo{height:22px;max-width:74px;}
}

.service-entry h3 i{
  color: var(--gold);
  font-size: 17px;
  margin-right: 7px;
  width: 20px;
  text-align: center;
}

.service-entry .learn i{
  font-size: 12px;
  margin-left: 2px;
  transition: transform .2s ease;
}

.service-entry .learn:hover i{
  transform: translateX(4px);
}



/* =========================================
   TRADEMARK SERVICES SECTION
========================================= */

.trademark-services-section {
  padding: 20px 0 50px;
}

.trademark-services-section .services-heading {
  max-width: 850px;
  margin-bottom: 28px;
}

.trademark-services-section .services-heading h2 {
  font-size: 25px;
  line-height: 1.3;
  font-weight: 800;
  color: var(--navy-950);
  margin: 0 0 12px;
}

.trademark-services-section .services-heading p {
  font-size: 14.5px;
  line-height: 1.75;
  color: var(--ink-soft);
  margin: 0;
}


/* ---------- Service Card ---------- */

.trademark-services-section .service-entry {
  height: 100%;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 23px 22px 21px;
  margin: 0;
  box-shadow: 0 8px 24px -18px rgba(17, 29, 51, .30);

  display: flex;
  flex-direction: column;

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

.trademark-services-section .service-entry:hover {
  transform: translateY(-4px);
  border-color: #d4dbea;
  box-shadow: 0 18px 35px -20px rgba(17, 29, 51, .38);
}


/* ---------- Tag ---------- */

.trademark-services-section .service-entry .tag {
  display: inline-flex;
  align-items: center;
  width: fit-content;

  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;

  color: var(--navy-700);
  background: var(--navy-100);

  padding: 5px 10px;
  border-radius: 999px;

  margin-bottom: 13px;
}


/* ---------- Heading ---------- */

.trademark-services-section .service-entry h3 {
  display: flex;
  align-items: center;
  gap: 9px;

  font-size: 18px;
  line-height: 1.35;
  font-weight: 800;

  color: var(--navy-950);

  margin: 0 0 10px;
}

.trademark-services-section .service-entry h3 i {
  width: 25px;
  height: 25px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  flex-shrink: 0;

  color: var(--gold);
  font-size: 16px;

  background: var(--gold-soft);
  border-radius: 7px;
}


/* ---------- Description ---------- */

.trademark-services-section .service-entry p {
  font-size: 13.8px;
  line-height: 1.7;
  color: var(--ink-soft);

  margin: 0 0 17px;

  flex-grow: 1;
}


/* ---------- Learn More ---------- */

.trademark-services-section .service-entry .learn {
  display: inline-flex;
  align-items: center;
  gap: 7px;

  width: fit-content;

  font-size: 13px;
  font-weight: 700;

  color: var(--navy-700);

  text-decoration: none;

  transition: color .2s ease;
}

.trademark-services-section .service-entry .learn i {
  font-size: 11px;

  transition: transform .2s ease;
}

.trademark-services-section .service-entry .learn:hover {
  color: var(--gold);
}

.trademark-services-section .service-entry .learn:hover i {
  transform: translateX(4px);
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 767.98px) {

  .trademark-services-section {
    padding: 10px 0 35px;
  }

  .trademark-services-section .services-heading h2 {
    font-size: 22px;
  }

  .trademark-services-section .services-heading p {
    font-size: 14px;
  }

  .trademark-services-section .service-entry {
    padding: 20px 18px;
    border-radius: 14px;
  }

  .trademark-services-section .service-entry h3 {
    font-size: 17px;
  }

  .trademark-services-section .service-entry p {
    font-size: 13.5px;
  }

}






/* =========================================
   TRADEMARK REGISTRATION COVERAGE
========================================= */

.coverage-section {
  width: 100%;
  padding: 55px 0;
  background: #f6f7fb;
  border-top: 1px solid var(--line);
}

.coverage-heading {
  text-align: center;
  max-width: 720px;
  margin: 0 auto 30px;
}

.coverage-label {
  display: inline-flex;
  align-items: center;
  gap: 7px;

  padding: 6px 12px;
  margin-bottom: 12px;

  border-radius: 999px;

  background: var(--gold-soft);
  border: 1px solid #e6d3a3;

  color: #8a6a1f;

  font-size: 11px;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.coverage-label i {
  font-size: 12px;
}

.coverage-heading h2 {
  margin: 0 0 9px;

  color: var(--navy-950);

  font-size: 26px;
  line-height: 1.25;
  font-weight: 800;
}

.coverage-heading p {
  margin: 0;

  color: var(--ink-soft);

  font-size: 14px;
  line-height: 1.7;
}


/* ---------- Location Card ---------- */

.coverage-card {
  position: relative;

  display: flex;
  align-items: center;
  gap: 12px;

  min-height: 72px;

  padding: 14px 16px;

  background: var(--white);

  border: 1px solid var(--line);
  border-radius: 14px;

  color: var(--navy-950);
  text-decoration: none;

  box-shadow: 0 8px 22px -18px rgba(17, 29, 51, .45);

  overflow: hidden;

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

.coverage-card::before {
  content: "";

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

  width: 3px;

  background: var(--gold);

  transform: scaleY(0);
  transform-origin: center;

  transition: transform .2s ease;
}


/* ---------- Location Icon ---------- */

.coverage-icon {
  width: 38px;
  height: 38px;

  display: flex;
  align-items: center;
  justify-content: center;

  flex-shrink: 0;

  border-radius: 10px;

  background: var(--navy-100);

  color: var(--navy-700);

  font-size: 15px;

  transition:
    background .2s ease,
    color .2s ease;
}


/* ---------- Location Name ---------- */

.coverage-name {
  flex: 1;

  font-size: 14px;
  font-weight: 700;

  color: var(--navy-800);
}


/* ---------- Arrow ---------- */

.coverage-arrow {
  color: #9aa5b8;

  font-size: 11px;

  transition:
    transform .2s ease,
    color .2s ease;
}


/* ---------- Hover ---------- */

.coverage-card:hover {
  transform: translateY(-3px);

  background: #fcfcfe;

  border-color: #d3dae7;

  box-shadow: 0 16px 30px -20px rgba(17, 29, 51, .45);
}

.coverage-card:hover::before {
  transform: scaleY(1);
}

.coverage-card:hover .coverage-icon {
  background: var(--gold-soft);
  color: #8a6a1f;
}

.coverage-card:hover .coverage-arrow {
  color: var(--gold);
  transform: translateX(4px);
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 767.98px) {

  .coverage-section {
    padding: 40px 0;
  }

  .coverage-heading {
    margin-bottom: 22px;
  }

  .coverage-heading h2 {
    font-size: 22px;
  }

  .coverage-heading p {
    font-size: 13.5px;
  }

  .coverage-card {
    min-height: 64px;
    padding: 12px 14px;
  }

  .coverage-icon {
    width: 36px;
    height: 36px;
  }

  .coverage-name {
    font-size: 13.5px;
  }

}




/* =========================================
   TRADEMARK PRICING SECTION
========================================= */

.trademark-pricing-section {
  width: 100%;
  padding: 10px 0 55px;
}


/* ---------- Heading ---------- */

.pricing-heading {
  text-align: center;
  max-width: 780px;
  margin: 0 auto 32px;
}

.pricing-label {
  display: inline-flex;
  align-items: center;
  gap: 7px;

  padding: 6px 12px;
  margin-bottom: 12px;

  background: var(--gold-soft);
  border: 1px solid #e5d19a;
  border-radius: 999px;

  color: #87661d;

  font-size: 10.5px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.pricing-label i {
  font-size: 11px;
}

.pricing-heading h2 {
  margin: 0 0 10px;

  color: var(--navy-950);

  font-size: 27px;
  line-height: 1.25;
  font-weight: 800;
}

.pricing-heading p {
  max-width: 680px;
  margin: 0 auto;

  color: var(--ink-soft);

  font-size: 14px;
  line-height: 1.7;
}


/* =========================================
   PRICING CARDS
========================================= */

.pricing-row {
  align-items: stretch;
}

.pricing-card {
  position: relative;

  height: 100%;

  background: var(--white);

  border: 1px solid var(--line);
  border-radius: 17px;

  padding: 27px 22px 22px;

  box-shadow: 0 10px 30px -22px rgba(17, 29, 51, .45);

  display: flex;
  flex-direction: column;

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

.pricing-card:hover {
  transform: translateY(-4px);

  box-shadow: 0 20px 40px -24px rgba(17, 29, 51, .45);
}


/* =========================================
   PACKAGE BADGE
========================================= */

.package-badge {
  position: absolute;

  top: -12px;
  left: 22px;

  display: inline-flex;
  align-items: center;
  gap: 5px;

  padding: 5px 10px;

  background: var(--gold);

  color: #111;

  border-radius: 999px;

  font-size: 10px;
  font-weight: 800;

  box-shadow: 0 5px 12px rgba(196, 151, 43, .25);
}

.package-badge i {
  font-size: 9px;
}


/* =========================================
   BASIC CARD
========================================= */

.basic-card {
  border-color: #e1e5ec;
}

.basic-card:hover {
  border-color: #cbd3df;
}


/* =========================================
   PREMIUM CARD
========================================= */

.premium-card {
  border: 2px solid var(--gold);

  box-shadow: 0 14px 35px -20px rgba(197, 153, 45, .45);
}

.premium-card:hover {
  box-shadow: 0 22px 42px -20px rgba(197, 153, 45, .55);
}

.premium-badge {
  background: var(--gold);
}


/* =========================================
   CARD HEADER
========================================= */

.pricing-card-header {
  padding-top: 8px;
}

.pricing-card-header h3 {
  margin: 0 0 9px;

  color: var(--navy-950);

  font-size: 17px;
  line-height: 1.4;
  font-weight: 800;
}


/* ---------- Price ---------- */

.price {
  color: var(--navy-700);

  font-size: 30px;
  line-height: 1;

  font-weight: 900;

  margin-bottom: 9px;
}

.price span {
  margin-left: 3px;

  color: var(--ink-soft);

  font-size: 12px;
  font-weight: 600;
}


/* ---------- Price Note ---------- */

.price-note {
  margin: 0;

  color: var(--ink-soft);

  font-size: 12px;
  line-height: 1.55;
}


/* =========================================
   PRICE DETAILS
========================================= */

.pricing-details {
  margin-top: 20px;

  display: flex;
  flex-direction: column;
  gap: 12px;
}

.price-detail {
  display: flex;
  align-items: flex-start;
  gap: 9px;

  color: var(--navy-800);

  font-size: 13px;
  line-height: 1.5;
}

.price-detail i {
  width: 19px;
  height: 19px;

  display: flex;
  align-items: center;
  justify-content: center;

  flex-shrink: 0;

  color: var(--gold);

  font-size: 12px;
}

.price-detail strong {
  color: var(--navy-950);
  font-weight: 800;
}


/* =========================================
   BUTTON
========================================= */

.pricing-btn {
  width: 100%;

  margin-top: auto;
  padding: 11px 18px;

  min-height: 43px;

  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;

  border-radius: 999px;

  text-decoration: none;

  font-size: 13px;
  font-weight: 800;

  transition:
    transform .2s ease,
    box-shadow .2s ease,
    background .2s ease;
}

.basic-btn {
  margin-top: 25px;

  background: var(--white);

  border: 2px solid var(--navy-700);

  color: var(--navy-700);
}

.basic-btn:hover {
  color: var(--navy-700);

  background: #f7f9fc;

  transform: translateY(-2px);
}


.premium-btn {
  margin-top: 25px;

  background: var(--gold);

  border: 2px solid var(--gold);

  color: #111;

  box-shadow: 0 10px 20px -10px rgba(197, 153, 45, .55);
}

.premium-btn:hover {
  color: #111;

  background: #d2a333;

  transform: translateY(-2px);

  box-shadow: 0 14px 25px -10px rgba(197, 153, 45, .65);
}

.pricing-btn i {
  font-size: 11px;

  transition: transform .2s ease;
}

.pricing-btn:hover i {
  transform: translateX(3px);
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 767.98px) {

  .trademark-pricing-section {
    padding: 5px 0 40px;
  }

  .pricing-heading {
    margin-bottom: 27px;
  }

  .pricing-heading h2 {
    font-size: 22px;
  }

  .pricing-heading p {
    font-size: 13.5px;
  }

  .pricing-card {
    padding: 25px 18px 19px;
    border-radius: 15px;
  }

  .pricing-card-header h3 {
    font-size: 16px;
  }

  .price {
    font-size: 27px;
  }

  .price-detail {
    font-size: 12.5px;
  }

}




/* =========================================
   ATTORNEY SECTION
========================================= */

.attorney-section {
  width: 100%;
  padding: 55px 0;
  background: var(--paper);
}

.attorney-heading {
  text-align: center;
  max-width: 720px;
  margin: 0 auto 34px;
}

.attorney-label {
  display: inline-flex;
  align-items: center;
  gap: 7px;

  padding: 6px 12px;
  margin-bottom: 12px;

  border-radius: 999px;

  background: var(--gold-soft);
  border: 1px solid #e6d3a3;

  color: #8a6a1f;

  font-size: 11px;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.attorney-label i {
  font-size: 12px;
}

.attorney-heading h2 {
  margin: 0 0 9px;
  color: var(--navy-950);
  font-size: 26px;
  line-height: 1.25;
  font-weight: 800;
}

.attorney-heading p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.7;
}

/* ---------- Card ---------- */

.attorney-card {
  height: 100%;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 26px 22px 22px;

  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;

  box-shadow: 0 8px 24px -18px rgba(17, 29, 51, .30);

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

.attorney-card:hover {
  transform: translateY(-4px);
  border-color: #d4dbea;
  box-shadow: 0 18px 35px -20px rgba(17, 29, 51, .38);
}

/* ---------- Photo ---------- */

.attorney-photo {
  position: relative;
  width: 92px;
  height: 92px;
  margin-bottom: 16px;
}

.attorney-photo img {
  width: 92px;
  height: 92px;
  border-radius: 50%;
  object-fit: cover;
  border: 3px solid var(--navy-100);
}

.attorney-badge {
  position: absolute;
  right: 0;
  bottom: 2px;

  width: 22px;
  height: 22px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 50%;
  border: 2px solid var(--white);

  background: var(--gold);
  color: var(--navy-950);

  font-size: 10px;
}

/* ---------- Name / role ---------- */

.attorney-card h3 {
  font-size: 15.5px;
  font-weight: 800;
  color: var(--navy-950);
  margin: 0 0 3px;
}

.attorney-role {
  display: block;
  font-size: 12px;
  font-weight: 700;
  color: var(--navy-700);
  margin-bottom: 13px;
}

/* ---------- Meta row ---------- */

.attorney-meta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;

  margin-bottom: 13px;
}

.attorney-meta span {
  display: inline-flex;
  align-items: center;
  gap: 5px;

  font-size: 11px;
  font-weight: 700;
  color: var(--navy-800);

  background: var(--navy-100);
  padding: 5px 10px;
  border-radius: 999px;
}

.attorney-meta i {
  font-size: 10px;
  color: var(--navy-700);
}

/* ---------- Focus line ---------- */

.attorney-focus {
  font-size: 12.8px;
  line-height: 1.6;
  color: var(--ink-soft);
  margin: 0 0 17px;
  flex-grow: 1;
}

/* ---------- Link ---------- */

.attorney-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;

  font-size: 12.5px;
  font-weight: 700;
  color: var(--navy-700);

  text-decoration: none;
  transition: color .2s ease;
}

.attorney-link i {
  font-size: 10px;
  transition: transform .2s ease;
}

.attorney-link:hover {
  color: var(--gold);
}

.attorney-link:hover i {
  transform: translateX(4px);
}

/* ---------- Slider (Owl Carousel) ---------- */

.attorney-slider .owl-stage-outer {
  padding: 4px 2px 10px;
}

.attorney-slider .owl-item .attorney-card {
  margin: 0 0 4px;
}

.attorney-slider .owl-dots {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 22px;
}

.attorney-slider .owl-dot span {
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--navy-100);
  transition: background .2s ease, transform .2s ease;
}

.attorney-slider .owl-dot.active span,
.attorney-slider .owl-dot:hover span {
  background: var(--gold);
  transform: scale(1.15);
}

/* ---------- Prev / Next arrows ---------- */

.attorney-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-top: 6px;
}

.attorney-arrow {
  width: 42px;
  height: 42px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 50%;
  border: 1px solid var(--line);
  background: var(--white);
  color: var(--navy-700);

  font-size: 14px;
  cursor: pointer;

  transition:
    background .2s ease,
    color .2s ease,
    border-color .2s ease,
    transform .2s ease;
}

.attorney-arrow:hover {
  background: var(--navy-700);
  border-color: var(--navy-700);
  color: #fff;
  transform: translateY(-2px);
}

.attorney-arrow:active {
  transform: translateY(0);
}

/* =========================================
   MOBILE
========================================= */

@media (max-width: 767.98px) {

  .attorney-section {
    padding: 40px 0;
  }

  .attorney-heading {
    margin-bottom: 24px;
  }

  .attorney-heading h2 {
    font-size: 22px;
  }

  .attorney-heading p {
    font-size: 13.5px;
  }

  .attorney-card {
    padding: 22px 18px 18px;
  }

  .attorney-arrow {
    width: 38px;
    height: 38px;
    font-size: 13px;
  }

}

.doc-card h4 i{
  width:15px;
  flex-shrink:0;
  color:var(--gold);
  font-size:14px;
}

.takeaway {
    background: #eaf3ed;
    border: 1px solid #c8ddd0;
    border-radius: 4px;
    padding: 18px 18px 16px;
    margin: 20px 0;
    color: #0d2b45;
}

.takeaway-label {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    color: #496b5a;
    margin-bottom: 10px;
}

.takeaway p {
    margin: 0;
    font-size: 15px;
    line-height: 1.65;
    font-weight: 400;
    color: #092b46;
}

/* Mobile Responsive */
@media (max-width: 576px) {
    .takeaway {
        padding: 15px;
    }

    .takeaway-label {
        font-size: 11px;
        margin-bottom: 8px;
    }

    .takeaway p {
        font-size: 14px;
        line-height: 1.6;
    }
}