/* Lucent Hire — design tokens & custom utilities (extracted from index.css) */
:root {
  --background: 40 30% 97%;
  --foreground: 240 10% 8%;
  --card: 0 0% 100%;
  --card-foreground: 240 10% 8%;
  --popover: 0 0% 100%;
  --popover-foreground: 240 10% 8%;
  --primary: 24 95% 50%;
  --primary-foreground: 0 0% 100%;
  --primary-glow: 38 95% 55%;
  --secondary: 40 20% 93%;
  --secondary-foreground: 240 10% 8%;
  --muted: 40 15% 92%;
  --muted-foreground: 240 5% 40%;
  --accent: 24 95% 50%;
  --accent-foreground: 0 0% 100%;
  --border: 240 8% 88%;
  --input: 40 15% 92%;
  --ring: 24 95% 50%;
  --radius: 1rem;

  --dark-bg: 240 10% 6%;
  --dark-surface: 240 8% 10%;
  --dark-foreground: 0 0% 98%;
  --dark-muted: 240 5% 65%;

  --glass: 0 0% 100% / 0.7;
  --glass-border: 240 8% 88%;
  --glass-dark: 0 0% 100% / 0.05;
  --glass-dark-border: 0 0% 100% / 0.1;

  --gradient-amber: linear-gradient(135deg, hsl(24 95% 50%), hsl(38 95% 55%));
  --gradient-warm: linear-gradient(135deg, hsl(40 30% 97%), hsl(40 25% 93%));
  --gradient-dark: linear-gradient(135deg, hsl(240 10% 6%), hsl(240 8% 12%));

  --shadow-amber: 0 20px 60px -15px hsl(24 95% 50% / 0.4);
  --shadow-glow: 0 0 30px hsl(24 95% 50% / 0.5);
  --shadow-soft: 0 4px 24px -8px hsl(240 10% 8% / 0.08);
  --shadow-elegant: 0 20px 50px -20px hsl(240 10% 8% / 0.18);
}

* { border-color: hsl(var(--border)); box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  background: hsl(var(--background));
  color: hsl(var(--foreground));
  font-family: 'Inter', system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
  font-feature-settings: 'cv11','ss01';
  margin: 0;
}
::selection { background: hsl(var(--primary) / 0.25); color: hsl(var(--primary)); }

/* Utilities */
.glass {
  background: hsl(var(--glass));
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid hsl(var(--glass-border));
}
.glass-dark {
  background: hsl(var(--glass-dark));
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid hsl(var(--glass-dark-border));
}
.dark-section { background: hsl(var(--dark-bg)); color: hsl(var(--dark-foreground)); }
.text-gradient-amber {
  background: var(--gradient-amber);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
.bg-gradient-amber { background: var(--gradient-amber); }
.bg-gradient-warm { background: var(--gradient-warm); }
.bg-gradient-dark { background: var(--gradient-dark); }
.shadow-amber { box-shadow: var(--shadow-amber); }
.shadow-glow { box-shadow: var(--shadow-glow); }
.shadow-soft { box-shadow: var(--shadow-soft); }
.shadow-elegant { box-shadow: var(--shadow-elegant); }

.grid-pattern {
  background-image:
    linear-gradient(hsl(240 8% 88% / 0.6) 1px, transparent 1px),
    linear-gradient(90deg, hsl(240 8% 88% / 0.6) 1px, transparent 1px);
  background-size: 48px 48px;
}
.grid-pattern-dark {
  background-image:
    linear-gradient(hsl(0 0% 100% / 0.05) 1px, transparent 1px),
    linear-gradient(90deg, hsl(0 0% 100% / 0.05) 1px, transparent 1px);
  background-size: 48px 48px;
}

/* Scan-line over images */
.scan-line { position: relative; }
.scan-line::before {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 0%, transparent 45%,
    hsl(var(--primary) / 0.35) 50%, transparent 55%, transparent 100%);
  background-size: 100% 300%;
  animation: scan-y 4.5s linear infinite;
  mix-blend-mode: screen; pointer-events: none;
}
.scan-line::after {
  content: ""; position: absolute; inset: 0;
  background: repeating-linear-gradient(0deg, transparent 0, transparent 3px,
    hsl(0 0% 100% / 0.025) 3px, hsl(0 0% 100% / 0.025) 4px);
  pointer-events: none;
}

/* Button shine */
.btn-shine { position: relative; overflow: hidden; isolation: isolate; }
.btn-shine::after {
  content: ""; position: absolute; top: 0; left: -150%; height: 100%; width: 60%;
  background: linear-gradient(120deg, transparent 0%, hsl(0 0% 100% / 0.45) 50%, transparent 100%);
  transform: skewX(-20deg); transition: left 0.7s ease; z-index: 1;
}
.btn-shine:hover::after { left: 150%; }

.float-slow { animation: float-slow 6s ease-in-out infinite; }

@keyframes scan-y {
  0% { background-position: 0 -100%; }
  100% { background-position: 0 200%; }
}
@keyframes float-slow {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}
@keyframes fade-up {
  0% { opacity: 0; transform: translateY(20px); }
  100% { opacity: 1; transform: translateY(0); }
}
.animate-fade-up { animation: fade-up 0.8s ease-out forwards; }
@keyframes pulse-dot {
  0%,100% { opacity: 1; }
  50% { opacity: .4; }
}
.animate-pulse-dot { animation: pulse-dot 2s ease-in-out infinite; }

/* Accordion */
.acc-item { border-bottom: 1px solid hsl(var(--border)); }
.acc-trigger {
  width: 100%; display: flex; justify-content: space-between; align-items: center;
  padding: 1rem 0; font-weight: 700; text-align: left; background: none; border: 0; cursor: pointer; color: black; font-size: 1rem;
}
.acc-trigger .chev { transition: transform .25s ease; }
.acc-trigger[aria-expanded="true"] .chev { transform: rotate(180deg); }
.acc-content {
  max-height: 0; overflow: hidden; transition: max-height .3s ease; color: hsl(var(--muted-foreground)); font-size: .875rem; line-height: 1.6;
}
.acc-content > div { padding: 0 0 1rem; }

/* Lightbox */
.lb-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.85); z-index: 90; display: none; align-items: center; justify-content: center; padding: 2rem; }
.lb-overlay.open { display: flex; }
.lb-overlay img { max-width: 95vw; max-height: 90vh; object-fit: contain; }

/* Smooth fade-in for elements */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .8s ease, transform .8s ease; }
.reveal.in { opacity: 1; transform: none; }

.bg-primary\/30,
.bg-primary\/20 {
    background-color: #54290F !important;
}

.text-primary {
  color: #f9700a !important;
}

.third{
    color: #f9700a !important;

}

body{
  background: #FAF8F5 !important;

}
.bg-primary\/10 {
    background-color: #FEEFE6
 !important;
}
h1, h2, h3, h4, h5, h6, * {
    font-family: 'Inter', system-ui, sans-serif !important;
}



/* =========================
   NAV WRAPPER GLASS STYLE
========================= */

/*#main-nav .max-w-7xl {*/
/*    background: rgba(255, 255, 255, 0.7);*/
/*    backdrop-filter: blur(16px);*/
/*    border: 1px solid rgba(255, 255, 255, 0.4);*/
/*    box-shadow: 0 10px 30px rgba(0,0,0,0.08);*/
/*}*/

/* =========================
   PARENT ITEM
========================= */

#main-nav .menu-item-has-children {
    position: relative;
    display: inline-block;
}

/* parent link layout */
#main-nav .menu-item-has-children > a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

/* =========================
   DROPDOWN SYMBOL (WORKING)
========================= */

/* Only menu items with submenu */
.menu-item-has-children > a {
    display: flex;
    align-items: center;
    gap: 6px;
}

/* Add SVG arrow */
.menu-item-has-children > a::after {
    content: "";
    width: 14px;
    height: 14px;
    display: inline-block;

    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");

    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    transition: transform 0.3s ease;
}

/* Rotate only when hover */
.menu-item-has-children:hover > a::after {
    transform: rotate(180deg);
}

/* =========================
   DROPDOWN BASE (HIDDEN)
========================= */

#main-nav .sub-menu {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(12px);

    width: 18rem;
    margin-top: 12px;
    padding: 8px;

    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(24px);

    border-radius: 18px;
    border: 1px solid rgba(0,0,0,0.08);

    box-shadow: 0 20px 50px rgba(0,0,0,0.12);

    z-index: 999;

    /* hidden state */
    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transition: all 0.2s ease;
}

/* =========================
   SHOW ON HOVER (FIXED)
========================= */

#main-nav .menu-item-has-children:hover > .sub-menu,
#main-nav .menu-item-has-children .sub-menu:hover {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
}

/* hover bridge (prevents flicker) */
#main-nav .menu-item-has-children::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    height: 12px;
}

/* =========================
   DROPDOWN ITEMS
========================= */

#main-nav .sub-menu li {
    list-style: none;
}

#main-nav .sub-menu li a {
    display: block;
    padding: 12px 14px;
    border-radius: 12px;

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

    color: #111;

    transition: 0.2s ease;
}

#main-nav .sub-menu li a:hover {
    background: rgba(0,0,0,0.05);
    transform: translateX(3px);
}

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

@media (max-width: 1024px) {
    #main-nav .sub-menu {
        position: static;
        transform: none !important;

        opacity: 1;
        visibility: visible;
        pointer-events: auto;

        display: none;

        background: transparent;
        border: none;
        box-shadow: none;
        padding: 0;
        margin-top: 10px;
    }
}

    .blog-content {
        color: #6b7280;
        /* default paragraph color */
    }

    /* paragraphs */
    .blog-content p {
        color: inherit;
        margin-bottom: 1rem;
        line-height: 1.8;
    }

    /* headings */
    .blog-content h2 {
        font-size: 1.75rem;
        font-weight: 700;
        margin-top: 2.5rem;
        margin-bottom: 1rem;
        color: #111;
    }

    /* lists */
    .blog-content ul {
        list-style: disc;
        padding-left: 1.5rem;
        margin: 1rem 0;
    }

    .blog-content li {
        margin-bottom: 0.6rem;
        line-height: 1.8;
    }
/* smooth transition */
#main-nav .menu-item a span {
    transition: color 0.2s ease;
    color:#333!important;
}

/* hover color */
#main-nav ul> .menu-item:hover > a span {
    color: #F98110 !important;
}


/* active menu item */
#main-nav .current-menu-item > a span,
#main-nav .current_page_item > a span,
#main-nav .current-menu-ancestor > a span {
    color: #F98110 !important;
}
.content-style ul {
    list-style-type: disc;
    padding-left: 35px;
}

.content-style ol {
    list-style-type: decimal;
    padding-left: 1.5rem;
}

.content-style li {
    margin-bottom: 0.5rem;
}

.content-style h3 {
    color:  #f9700a;
}
.service-content ul {
  list-style: none;
  padding-left: 0;
  margin-top: 1rem;
}

.service-content li {
  position: relative;
  padding-left: 30px;
  margin-bottom: 12px;
  line-height: 1.6;
}

.service-content li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  color: #F9720B;
  font-weight: 900;
  font-size: 14px;
}