:root {
   --brand-green: #71c8a9;
   --brand-dark: #0d1b1e;
   --brand-gray: #f5f5f3;
 }

 * {
   box-sizing: border-box;
 }

 body {
   font-family: "Plus Jakarta Sans", sans-serif;
   overflow-x: hidden;
 }

 .text-green {
   color: #71c8a9;
 }


 /* NAV */
 .navbar {
   background: rgba(255, 255, 255, 0.85) !important;
   backdrop-filter: blur(8px);
 }

 .navbar-brand img {
   height: 50px;
 }

 .nav-link {
   color: rgba(255, 255, 255, 0.8) !important;
   font-size: .9rem;
   font-weight: 500;
   letter-spacing: .5px;
 }

 .nav-link:hover {
   color: var(--brand-green) !important;
 }

 .btn-nav {
   background: var(--brand-green);
   color: #fff !important;
   border-radius: 3px;
   padding: 6px 18px;
   font-size: .85rem;
 }

 .btn-nav:hover {
   background: #25a06c;
 }

 /* HERO */
 .hero {
   position: relative;
   min-height: 100vh;
   display: flex;
   align-items: center;
   overflow: hidden;
 }

 .hero-video {
   position: absolute;
   inset: 0;
   width: 100%;
   height: 100%;
   object-fit: cover;
   z-index: 0;
 }

 .hero-overlay {
   position: absolute;
   inset: 0;
   background: linear-gradient(135deg, rgba(13, 27, 30, .82) 55%, rgba(13, 27, 30, .45) 100%);
   z-index: 1;
 }

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

 .hero-eyebrow {
   color: var(--brand-green);
   font-size: .8rem;
   font-weight: 600;
   letter-spacing: 2px;
   text-transform: uppercase;
 }

 .hero h1 {
   font-family: "Plus Jakarta Sans", sans-serif;
   font-size: clamp(2.4rem, 6vw, 4.5rem);
   font-weight: 700;
   line-height: 1.1;
   color: #fff;
 }

 .hero h1 span {
   color: var(--brand-green);
 }

 .hero p {
   color: rgba(255, 255, 255, .75);
   font-size: 1rem;
   max-width: 480px;
 }

 .btn-primary-custom {
   background: var(--brand-green);
   color: #fff;
   border: none;
   border-radius: 3px;
   padding: 12px 28px;
   font-weight: 600;
   font-size: .9rem;
   letter-spacing: .5px;
 }

 .btn-primary-custom:hover {
   background: #25a06c;
   color: #fff;
 }

 .btn-outline-custom {
   border: 1.5px solid rgba(255, 255, 255, .5);
   color: #fff;
   border-radius: 3px;
   padding: 12px 28px;
   font-weight: 600;
   font-size: .9rem;
   background: transparent;
 }

 .btn-outline-custom:hover {
   border-color: var(--brand-green);
   color: var(--brand-green);
 }

 /* HERO STATS */
 .hero-stats {
   border-left: 1px solid rgba(255, 255, 255, .15);
   padding-left: 1.5rem;
 }

 .hero-stats .stat-number {
   font-family: "Plus Jakarta Sans", sans-serif;
   font-size: 2rem;
   font-weight: 700;
   color: #fff;
   line-height: 1;
 }

 .hero-stats .stat-number span {
   color: var(--brand-green);
 }

 .hero-stats .stat-label {
   font-size: .75rem;
   color: rgba(255, 255, 255, .6);
   text-transform: uppercase;
   letter-spacing: 1px;
 }

 /* SECTION LABELS */
 .section-label {
   font-size: .75rem;
   font-weight: 600;
   letter-spacing: 2px;
   text-transform: uppercase;
   color: var(--brand-green);
 }

 .section-title {
   font-family: "Plus Jakarta Sans", sans-serif;
   font-size: clamp(1.8rem, 4vw, 2.6rem);
   font-weight: 700;
   color: var(--brand-dark);
 }

 .section-title span {
   color: var(--brand-green);
 }

 /* CASE STUDIES */
 #case-studies {
   background: #fff;
 }

 .case-card {
   overflow: hidden;
   position: relative;
   cursor: pointer;
 }

 .case-card img {
   width: 100%;
   height: 220px;
   object-fit: cover;
   transition: transform .45s ease;
   display: block;
 }

 .case-card:hover img {
   transform: scale(1.04);
 }

 .case-card-body {
   padding: 1rem 0;
 }

 .case-card-body h5 {
   font-family: "Plus Jakarta Sans", sans-serif;
   font-size: 1.1rem;
   font-weight: 700;
   color: var(--brand-dark);
   margin-bottom: .25rem;
 }

 .case-card-body p {
   font-size: 1rem;
   color: #666;
   margin-bottom: .4rem;
 }

 .case-card-body a {
   font-size: .8rem;
   font-weight: 600;
   color: var(--brand-green);
   text-decoration: none;
   letter-spacing: .5px;
 }

 .case-card-body a:hover {
   text-decoration: underline;
 }

 .case-card-featured img {
   height: 340px;
 }

 /* =============================================
       SERVICES ACCORDION — FIXED
       ============================================= */
 #services {
   background: var(--brand-gray);
 }

 .svc-item {
   border-top: 1px solid #e0e0e0;
 }

 /* Always-visible row */
 .svc-header {
   display: grid;
   grid-template-columns: 1fr 2fr auto;
   align-items: center;
   gap: 1.5rem;
   padding: 1.2rem 0;
   cursor: pointer;
 }

 .svc-header h5 {
   font-family: "Plus Jakarta Sans", sans-serif;
   font-size: 1.4rem;
   font-weight: 700;
   color: var(--brand-dark);
   margin: 0;
 }

 .svc-header img {
   width: 100%;
   height: 180px;
   object-fit: cover;
   border-radius: 6px;
   display: block;
 }

 .svc-toggle-btn {
   width: 28px;
   height: 28px;
   border-radius: 50%;
   border: 1.5px solid #aaa;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 1.2rem;
   line-height: 1;
   color: #555;
   flex-shrink: 0;
   transition: all .2s;
   user-select: none;
   background: transparent;
   cursor: pointer;
 }

 /* Panel — hidden by default via max-height transition */
 .svc-panel {
   max-height: 0;
   overflow: hidden;
   transition: max-height 0.4s ease, opacity 0.3s ease;
   opacity: 0;
 }

 .svc-panel-inner {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 2rem;
   padding-bottom: 1.5rem;
 }

 .svc-panel-inner p {
   font-size: .88rem;
   color: #555;
   line-height: 1.7;
   margin: 0;
 }

 .svc-tools-title {
   font-size: .85rem;
   font-weight: 700;
   color: var(--brand-dark);
   margin-bottom: .75rem;
 }

 .svc-tools-list {
   list-style: none;
   padding: 0;
   margin: 0;
 }

 .svc-tools-list li {
   display: flex;
   align-items: center;
   gap: .6rem;
   margin-bottom: .5rem;
   font-size: .88rem;
   color: #333;
 }

 .svc-check {
   width: 22px;
   height: 22px;
   border-radius: 50%;
   background: var(--brand-green);
   display: flex;
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
   color: #fff;
   font-size: .7rem;
 }

 /* Open state */
 .svc-item.is-open .svc-panel {
   max-height: 100% !important;
   opacity: 1;
 }

 .svc-item.is-open .svc-toggle-btn {
   border-color: #555;
   color: #333;
 }

 @media (max-width: 768px) {
   .svc-header {
     grid-template-columns: 1fr auto;
   }

   .svc-header img {
     display: none;
   }

   .svc-panel-inner {
     grid-template-columns: 1fr;
   }
 }

 /* PROCESS */
 #process {
   background: #fff;
 }

 .process-item {
   display: flex;
   align-items: flex-start;
   gap: 1.25rem;
   padding: 1.2rem 0;
   border-bottom: 1px solid #eee;
 }

 .process-item:last-child {
   border-bottom: none;
 }

 .process-num {
   font-family: "Plus Jakarta Sans", sans-serif;
   font-size: 2.2rem;
   font-weight: 700;
   color: #e0e0e0;
   line-height: 1;
   min-width: 48px;
 }

 .process-item h6 {
   font-weight: 700;
   font-size: .95rem;
   color: var(--brand-dark);
   margin-bottom: .2rem;
 }

 .process-item p {
   font-size: .85rem;
   color: #666;
   margin: 0;
 }

 .process-icon {
   color: var(--brand-green);
   font-size: 1.5rem;
   margin-left: auto;
   flex-shrink: 0;
   align-self: center;
 }

 /* MARQUEE */
 .marquee-section {
   background: var(--brand-green);
   overflow: hidden;
   padding: 1rem 0;
 }

 .marquee-track {
   display: flex;
   white-space: nowrap;
   animation: marquee 20s linear infinite;
 }

 .marquee-track span {
   font-family: "Plus Jakarta Sans", sans-serif;
   font-size: clamp(1.8rem, 4vw, 2.8rem);
   font-weight: 700;
   color: #fff;
   padding: 0 2rem;
 }

 .marquee-track span.dot {
   color: rgba(255, 255, 255, .4);
   font-size: 1rem;
   padding: 0 .5rem;
   align-self: center;
 }

 @keyframes marquee {
   from {
     transform: translateX(0);
   }

   to {
     transform: translateX(-50%);
   }
 }

 /* ABOUT */

 /* ── ABOUT LABEL ── */
 .about-label {
   font-size: 0.72rem;
   font-weight: 500;
   letter-spacing: 0.12em;
   text-transform: uppercase;
   color: #71c8a9;
   margin-bottom: 1rem;
 }

 /* ── HERO HEADING ── */
 .hero-heading {
   font-family: "Plus Jakarta Sans", sans-serif;
   font-size: clamp(1.8rem, 4vw, 2.6rem);
   font-weight: 700;
   color: var(--brand-dark);
 }

 /* ── SECTION DIVIDER ── */
 .section-top {
   padding-top: 3.5rem;
   padding-bottom: 3.5rem;
 }

 /* ── VMC CARDS ── */
 .vmc-label {
   font-size: 1rem;
   font-weight: 600;
   color: #111;
   margin-bottom: 0.55rem;
 }

 .vmc-text {
   font-size: 0.875rem;
   color: #444;
   line-height: 1.65;
 }

 /* ── BOTTOM SECTION ── */
 .bottom-section {
   padding-top: 2.5rem;
   padding-bottom: 4rem;
 }

 .intro-text {
   font-size: 0.9rem;
   color: #333;
   line-height: 1.7;
   max-width: 480px;
   margin-bottom: 2rem;
 }

 /* ── LEFT IMAGE ── */
 .img-left {
   width: 100%;
   height: 100%;
   object-fit: cover;
   display: block;
 }

 .img-left-wrapper {
   height: 560px;
   overflow: hidden;
 }

 /* ── RIGHT SPLIT IMAGE ── */
 .split-image-wrapper {
   position: relative;
   width: 100%;
   height: 490px;
   overflow: hidden;
 }

 .split-image-wrapper img {
   position: absolute;
   top: 0;
   height: auto;
   object-fit: cover;
 }

 .split-image-wrapper img.split-left {
   left: 0;
   filter: grayscale(20%);
 }

 .split-image-wrapper img.split-right {
   right: 0;
 }

 /* diagonal divider */
 .split-divider {
   position: absolute;
   top: 0;
   left: 50%;
   transform: translateX(-50%) rotate(8deg);
   width: 4px;
   height: 120%;
   background: #fff;
   z-index: 2;
   transform-origin: top center;
 }

 /* ── CAPTION ── */
 .caption-text {
   font-size: 0.875rem;
   color: #333;
   line-height: 1.7;
   margin-top: 1.25rem;
   margin-bottom: 1.75rem;
 }

 /* ── BUTTONS ── */
 .btn-start {
   background: #71c8a9;
   color: #fff;
   border: none;
   padding: 0.65rem 1.4rem;
   font-size: 0.78rem;
   font-weight: 600;
   letter-spacing: 0.06em;
   text-transform: uppercase;
   border-radius: 0;
   cursor: pointer;
   transition: background 0.2s;
 }

 .btn-start:hover {
   background: #4aa38d;
   color: #fff;
 }

 .btn-view {
   background: transparent;
   color: #111;
   border: none;
   padding: 0.65rem 1.4rem;
   font-size: 0.78rem;
   font-weight: 600;
   letter-spacing: 0.06em;
   text-transform: uppercase;
   border-radius: 0;
   border-bottom: 1px solid #aaa;
   cursor: pointer;
   transition: border-color 0.2s;
 }

 .btn-view:hover {
   border-color: #111;
 }

 /* ── DIVIDERS ── */
 hr.section-rule {
   border: none;
   border-top: 1px solid #e0e0e0;
   margin: 0;
 }


 /* CTA BANNER */
 .cta-banner {
   background: var(--brand-dark);
   padding: 4rem 0;
 }

 .cta-banner h2 {
   font-family: "Plus Jakarta Sans", sans-serif;
   font-size: clamp(1.8rem, 4vw, 3rem);
   font-weight: 700;
   color: #fff;
 }

 .cta-banner p {
   color: rgba(255, 255, 255, .65);
   font-size: .95rem;
 }

 /*Request*/

 .request-form {
   background-image: url('assets/images/form-bg.png');
   background-size: cover;
   background-position: left;
   background-repeat: no-repeat;
   display: flex;
   justify-content: center;
   padding: 100px;
 }

 .card-wrapper {
   width: 100%;
   max-width: 790px;
   background: rgb(255 255 255 / 50%);
   backdrop-filter: blur(3px);
   border-radius: 10px;
   overflow: hidden;
   border: 1px solid #fff;
 }

 .form-section {
   padding: 36px 44px 32px 44px;
 }

 .get-in-touch {
   font-size: 11px;
   font-weight: 700;
   letter-spacing: 0.10em;
   color: #71c8a9;
   text-transform: uppercase;
   margin-bottom: 8px;
 }

 .page-title {
   font-size: 2.1rem;
   font-weight: 400;
   color: #1c1c1c;
   margin-bottom: 14px;
   letter-spacing: -0.01em;
 }

 .page-desc {
   font-size: 13.5px;
   color: #444;
   margin-bottom: 30px;
   line-height: 1.55;
   max-width: 580px;
 }

 .field-label {
   font-size: 13px;
   color: #2a2a2a;
   margin-bottom: 5px;
   display: block;
   font-weight: 400;
 }

 .form-input {
   width: 100%;
   background: rgba(255, 255, 255, 0.65);
   border: 1px solid rgba(200, 200, 200, 0.7);
   border-radius: 5px;
   padding: 9px 13px;
   font-size: 14px;
   color: #222;
   outline: none;
   transition: border-color 0.15s, background 0.15s;
 }

 .form-input:focus {
   border-color: #71c8a9;
   background: rgba(255, 255, 255, 0.88);
 }

 .form-input::placeholder {
   color: #777;
 }

 textarea.form-input {
   resize: vertical;
   min-height: 120px;
 }

 .field-group {
   margin-bottom: 16px;
 }

 .two-col {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 16px;
   margin-bottom: 16px;
 }

 .btn-request {
   display: inline-flex;
   align-items: center;
   gap: 9px;
   background-color: #71c8a9;
   color: #fff;
   border: none;
   border-radius: 6px;
   padding: 11px 20px;
   font-size: 11.5px;
   font-weight: 700;
   letter-spacing: 0.09em;
   text-transform: uppercase;
   cursor: pointer;
   margin-top: 6px;
   transition: background 0.18s;
 }

 .btn-request:hover {
   background-color: #71c8a9;
 }

 .btn-request .icon {
   width: 22px;
   height: 22px;
   border-radius: 50%;
   background: rgba(0, 0, 0, 0.15);
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 13px;
   line-height: 1;
 }

 .form-img {
   padding-top: 20px;
 }

 .bottom-image {
   width: 100%;
   display: block;
   height: 210px;
   object-fit: cover;
   border-radius: 20px;
 }

 /* ── Mobile styles ── */
 @media (max-width: 600px) {
   .request-form {
     padding: 40px 10px 40px 10px;
     background-position: center center;
   }

   .card-wrapper {
     border-radius: 8px;
   }

   .form-section {
     padding: 24px 18px 24px 18px;
   }

   .page-title {
     font-size: 1.55rem;
     margin-bottom: 10px;
   }

   .page-desc {
     font-size: 13px;
     margin-bottom: 22px;
   }

   .two-col {
     grid-template-columns: 1fr;
     gap: 12px;
     margin-bottom: 12px;
   }

   .field-group {
     margin-bottom: 12px;
   }

   .form-input {
     font-size: 16px;
     /* prevents iOS zoom on focus */
     padding: 10px 12px;
   }

   textarea.form-input {
     min-height: 100px;
   }

   .btn-request {
     width: 100%;
     justify-content: center;
     padding: 13px 20px;
     font-size: 12px;
   }

   .bottom-image {
     height: 160px;
     border-radius: 12px;
   }

   .form-img {
     padding-top: 16px;
   }
 }

 /* ── Small tablet tweak ── */
 @media (min-width: 601px) and (max-width: 768px) {
   .form-section {
     padding: 28px 28px 28px 28px;
   }

   .page-title {
     font-size: 1.75rem;
   }
 }

 /* CTA Section */
 .cta-section {
   background-color: #1a1a1a;
   border-bottom: 1px solid #333;
   padding: 60px 0;
 }

 .cta-section h1 {
   font-size: 3rem;
   font-weight: 700;
   color: #ffffff;
 }

 .cta-section p {
   color: #cccccc;
   font-size: 0.95rem;
 }

 .btn-appointment {
   background-color: #71c8a9;
   color: #000000;
   font-weight: 600;
   font-size: 0.8rem;
   letter-spacing: 0.05em;
   padding: 12px 24px;
   border-radius: 4px;
   border: none;
   text-transform: uppercase;
 }

 .btn-appointment:hover {
   background-color: #71c8a9;
   color: #000000;
 }

 /* Footer Section */
 .footer-main {
   background-color: #1a1a1a;
   padding: 60px 0 30px;
   border-bottom: 1px solid #333;
 }

 .footer-logo {
   width: 250px !important;
   height: auto;
 }

 .logo-icon {
   width: 40px;
   height: 40px;
   margin-right: 8px;
 }

 .footer-description {
   color: #999999;
   font-size: 0.85rem;
   line-height: 1.6;
   margin-top: 16px;
 }

 .footer-contact {
   color: #999999;
   font-size: 0.85rem;
   margin-top: 20px;
   line-height: 2;
 }

 .footer-contact a {
   color: #cccccc;
   text-decoration: none;
 }

 .footer-contact a:hover {
   color: #71c8a9;
 }

 .footer-heading {
   color: #ffffff;
   font-weight: 600;
   font-size: 1rem;
   margin-bottom: 20px;
 }

 .footer-links {
   list-style: none;
   padding: 0;
   margin: 0;
 }

 .footer-links li {
   margin-bottom: 12px;
 }

 .footer-links a {
   color: #999999;
   text-decoration: none;
   font-size: 0.9rem;
 }

 .footer-links a:hover {
   color: #4ecdc4;
 }

 /* Newsletter */
 .newsletter-label {
   font-size: 1rem;
   font-weight: 600;
   color: #ffffff;
   line-height: 1.4;
   margin-bottom: 20px;
 }

 .email-label {
   font-size: 0.85rem;
   color: #cccccc;
   margin-bottom: 8px;
 }

 .newsletter-input {
   background-color: #2a2a2a;
   border: 1px solid #444;
   color: #ffffff;
   border-radius: 4px 0 0 4px;
   padding: 10px 14px;
   font-size: 0.85rem;
   width: 100%;
 }

 .newsletter-input::placeholder {
   color: #666;
 }

 .newsletter-input:focus {
   outline: none;
   border-color: #71c8a9;
   background-color: #2a2a2a;
   color: #fff;
   box-shadow: none;
 }

 .btn-send {
   background-color: #ffffff;
   color: #000000;
   font-weight: 700;
   font-size: 0.8rem;
   padding: 12px 18px;
   border: none;
   border-radius: 0 4px 4px 0;
   letter-spacing: 0.05em;
   white-space: nowrap;
 }

 .btn-send:hover {
   background-color: #71c8a9;
   color: #000;
 }

 .no-spam {
   color: #666;
   font-size: 0.8rem;
   margin-top: 10px;
 }

 /* Bottom Bar */
 .footer-bottom {
   background-color: #1a1a1a;
   padding: 20px 0;
 }

 .footer-bottom-text {
   color: #666;
   font-size: 0.85rem;
 }

 .social-links {
   color: #999;
   font-size: 0.85rem;
 }

 .social-links a {
   color: #999;
   text-decoration: none;
   margin-left: 20px;
 }

 .social-links a:hover {
   color: #71c8a9;
 }

 .social-label {
   color: #666;
   margin-right: 4px;
 }

 /*projects detail page*/

 .project-hero-section {
   position: relative;
   overflow: hidden;
   min-height: 560px;
 }

 .project-hero-section img.project-hero-img {
   width: 100%;
   object-fit: cover;
   min-height: 560px;
   display: block;
   filter: brightness(.55);
 }

 .project-hero-overlay {
   position: absolute;
   inset: 0;
   background: linear-gradient(to bottom, rgba(0, 0, 0, .15) 0%, rgba(0, 0, 0, .5) 100%);
 }

 .project-hero-content {
   position: absolute;
   inset: 0;
 }

 .project-hero-title {
   font-size: clamp(2rem, 4vw, 3.2rem);
   font-weight: 300;
   color: #fff;
   letter-spacing: .04em;
 }

 .project-hero-badge {
   display: inline-block;
   border: 1px solid rgba(255, 255, 255, .5);
   color: rgba(255, 255, 255, .8);
   font-size: .7rem;
   letter-spacing: .12em;
   text-transform: uppercase;
   padding: .25rem .75rem;
   margin-top: .5rem;
 }

 .project-hero-desc {
   color: rgba(255, 255, 255, .7);
   font-size: .82rem;
   line-height: 1.7;
   max-width: 380px;
 }

 .project-btn-hero {
   border: 1px solid rgba(255, 255, 255, .55);
   color: #fff;
   font-size: .75rem;
   letter-spacing: .1em;
   text-transform: uppercase;
   padding: .55rem 1.4rem;
   border-radius: 0;
   background: transparent;
   margin-top: .75rem;
 }

 .project-btn-hero:hover {
   background: rgba(255, 255, 255, .15);
   color: #fff;
 }

 /* ── META INFO STRIP ── */
 .meta-strip {
   padding: 2.5rem 0;
   border-bottom: 1px solid #e8e4de;
 }

 .meta-label {
   font-size: .68rem;
   text-transform: uppercase;
   letter-spacing: .14em;
   color: var(--clr-mid);
   margin-bottom: .25rem;
 }

 .meta-value {
   font-family: var(--font-display);
   font-size: 1rem;
   color: var(--clr-dark);
 }

 .meta-thumb img {
   width: 100%;
   object-fit: cover;
   aspect-ratio: 4/3;
 }

 /* ── GALLERY GRID ── */
 .gallery-img {
   width: 100%;
   object-fit: cover;
   aspect-ratio: 4/3;
   display: block;
 }

 .gallery-img-tall {
   width: 100%;
   object-fit: cover;
   aspect-ratio: 3/4;
   display: block;
 }

 /* ── SECTION PADDING ── */
 .section-block {
   padding: 2rem 0;
 }

 /* ── BODY TEXT ── */
 .body-text {
   font-size: .88rem;
   line-height: 1.85;
   color: #4a4540;
 }

 /* ── PANORAMIC IMAGE ── */
 .pano-img {
   width: 100%;
   object-fit: cover;
   aspect-ratio: 21/8;
   display: block;
 }

 /* ── SECTION HEADING ── */
 .section-heading {
   font-family: var(--font-display);
   font-size: clamp(1.5rem, 2.5vw, 2.1rem);
   font-weight: 300;
   letter-spacing: .02em;
 }

 /* ── OTHER PROJECTS ── */
 .other-projects-bar {
   border-top: 1px solid #e8e4de;
   border-bottom: 1px solid #e8e4de;
   padding: 1.25rem 0;
 }

 .other-projects-bar .label {
   font-family: var(--font-display);
   font-size: 1.25rem;
   font-weight: 300;
 }

 .btn-all {
   border: 1px solid var(--clr-dark);
   font-size: .7rem;
   letter-spacing: .1em;
   text-transform: uppercase;
   padding: .4rem 1rem;
   border-radius: 0;
   background: transparent;
   color: var(--clr-dark);
 }

 .btn-all:hover {
   background: var(--clr-dark);
   color: #fff;
 }