:root {
    --red:#C0392B;--red2:#E74C3C;--red-light:#FDECEC;
    --green:#27AE60;--green-light:#E8F8EF;
    --gold:#D4A017;--gold-light:#FFF8E7;
    --dark:#1A0A0A;--text:#2C1A1A;--text2:#6B4F4F;
    --bg:#FFFAF8;--bg2:#FFF5F5;--bg3:#F9F0F0;
    --white:#FFFFFF;--border:#F0DADA;
    --shadow:0 4px 24px rgba(192,57,43,0.08);
    --shadow-lg:0 12px 40px rgba(192,57,43,0.14);
    
    --font-heading: 'Syne', sans-serif;
    --font-body: 'DM Sans', sans-serif;
}

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

body {
    background: var(--bg);
    color: var(--text);
    font-family: var(--font-body);
    font-size: 15px;
    min-height: 100vh;
    overflow-x: hidden;
}

/* Background Animations Removed - Kept empty class so HTML doesn't break if abstract tags are still present */
.bg-abstract {
    display: none;
}


/* Navbar */
.navbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 5%;
    background: rgba(5, 5, 5, 0.4);
    backdrop-filter: blur(var(--glass-blur));
    border-bottom: 1px solid var(--border-color);
    position: sticky;
    top: 0;
    z-index: 100;
}

.logo {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-family: var(--font-heading);
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--text-primary);
}

.logo i {
    color: var(--accent-blue);
    font-size: 1.8rem;
}

.nav-links {
    display: flex;
    gap: 2rem;
}

.nav-links a {
    color: var(--text-secondary);
    text-decoration: none;
    font-size: 0.95rem;
    font-weight: 500;
    transition: color 0.3s ease;
}

.nav-links a:hover, .nav-links a.active {
    color: var(--text-primary);
}

/* Layout Container */
.container {
    max-width: 1100px;
    margin: 0 auto;
    padding: 4rem 2rem;
}

/* Views Logic */
.view {
    display: none;
    opacity: 0;
    transform: translateY(20px);
    animation: fadeIn 0.5s forwards ease-out;
}

.active-view {
    display: block;
}

@keyframes fadeIn {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.hidden {
    display: none !important;
}

/* Hero Section */
.hero-text {
    text-align: center;
    margin-bottom: 4rem;
}

.badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--red-light);
    border: 1px solid rgba(192,57,43,0.2);
    border-radius: 50px;
    padding: 6px 16px;
    font-size: 12px;
    color: var(--red);
    margin-bottom: 20px;
    letter-spacing: .4px;
    font-weight: 500;
}

.hero-text h1 {
    font-family: var(--font-heading);
    font-size: clamp(32px,4vw,52px);
    font-weight: 800;
    line-height: 1.1;
    margin-bottom: 1.5rem;
    letter-spacing: -1px;
    color: var(--dark);
}

.highlight {
    background: linear-gradient(to right, var(--red), var(--gold));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.hero-text p {
    font-size: 15px;
    color: var(--text2);
    max-width: 600px;
    margin: 0 auto;
    line-height: 1.7;
}

/* Cards */
.exam-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1.5rem;
}

.card {
    background: var(--white);
    border: 1.5px solid var(--border);
    border-radius: 20px;
    padding: 2rem;
    box-shadow: var(--shadow-lg);
    position: relative;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.card::before {
    content:'';
    position:absolute;
    top:0;
    left:0;
    right:0;
    height:4px;
    background:linear-gradient(90deg,var(--red),var(--gold));
}

.exam-card {
    cursor: pointer;
    display: flex;
    flex-direction: column;
}

.exam-card:hover {
    transform: translateY(-5px);
    border-color: rgba(192, 57, 43, 0.35);
    box-shadow: var(--shadow-lg);
}

.card-icon {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
    margin-bottom: 1.5rem;
    transition: transform 0.3s ease;
}

.exam-card:hover .card-icon {
    transform: scale(1.1);
}

.blue-icon { background: rgba(192, 57, 43, 0.15); color: var(--red); }
.orange-icon { background: rgba(212, 160, 23, 0.15); color: var(--gold); }
.green-icon { background: var(--green-light); color: var(--green); }

.card-content h3 {
    font-family: var(--font-heading);
    font-weight: 800;
    font-size: 1.4rem;
    margin-bottom: 0.5rem;
    color: var(--dark);
}

.card-content p {
    color: var(--text2);
    font-size: 13px;
    line-height: 1.65;
}

.card-arrow {
    position: absolute;
    bottom: 2rem;
    right: 2rem;
    font-size: 1.2rem;
    color: var(--text2);
    opacity: 0;
    transform: translateX(-10px);
    transition: all 0.3s ease;
}

.exam-card:hover .card-arrow {
    opacity: 1;
    transform: translateX(0);
    color: var(--red);
}

/* Forms */
.form-container {
    max-width: 600px;
    margin: 0 auto;
}

.form-header {
    text-align: center;
    margin-bottom: 2.5rem;
}

.form-header h2 {
    font-family: var(--font-heading);
    font-weight: 800;
    font-size: 2rem;
    margin-bottom: 0.5rem;
    color: var(--dark);
}

.form-header p {
    color: var(--text2);
}

.input-group {
    margin-bottom: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    width: 100%;
}

.input-row {
    display: flex;
    gap: 1.5rem;
}

label {
    font-size: 11px;
    letter-spacing: .4px;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--text2);
}

input, select {
    width: 100%;
    padding: 1rem 1.2rem;
    background: var(--bg);
    border: 1.5px solid var(--border);
    border-radius: 9px;
    color: var(--text);
    font-family: var(--font-body);
    font-size: 1rem;
    transition: all 0.3s ease;
    outline: none;
    -webkit-appearance: none;
}

select {
    padding-right: 2.5rem;
    background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%236B4F4F%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.4-12.8z%22%2F%3E%3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: right 1rem top 50%;
    background-size: 0.65rem auto;
}

option {
    background: var(--white);
    color: var(--text);
}

input:focus, select:focus {
    border-color: var(--red);
    background: var(--white);
    box-shadow: 0 0 0 3px rgba(192,57,43,0.08);
}

.btn-primary {
    width: 100%;
    background: linear-gradient(135deg, var(--red), #A93226);
    color: #fff;
    border: none;
    border-radius: 10px;
    padding: 14px;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    font-family: var(--font-body);
    transition: all .25s;
    margin-top: 8px;
    letter-spacing: .2px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 28px rgba(192,57,43,0.35);
}

.btn-back {
    background: transparent;
    border: none;
    color: var(--text2);
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    transition: color 0.3s;
}

.btn-back:hover {
    color: var(--red);
}

.results-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
}

.btn-export {
    background: transparent;
    border: 1.5px solid var(--border);
    color: var(--text);
    padding: 0.6rem 1.2rem;
    border-radius: 8px;
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

.btn-export:hover {
    background: var(--red-light);
    border-color: rgba(192,57,43,0.4);
    color: var(--red);
    transform: translateY(-2px);
}

.btn-export.hidden {
    display: none !important;
}

/* Results View */
.results-header {
    margin-bottom: 3rem;
}

.results-header h2 {
    font-family: var(--font-heading);
    font-weight: 800;
    font-size: 2.5rem;
    margin-bottom: 0.5rem;
    color: var(--dark);
}

.results-header p {
    color: var(--text2);
    font-size: 15px;
}

.spinner-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 300px;
}

.spinner {
    width: 50px;
    height: 50px;
    border: 4px solid var(--border);
    border-top-color: var(--red);
    border-radius: 50%;
    animation: spin 1s linear infinite;
    margin-bottom: 1.5rem;
}

@keyframes spin {
    100% { transform: rotate(360deg); }
}

.results-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 1.5rem;
}

.result-card {
    background: var(--white);
    border: 1.5px solid var(--border);
    border-radius: 14px;
    padding: 1.5rem;
    transition: all 0.25s;
}

.result-card:hover {
    border-color: rgba(192,57,43,0.3);
    box-shadow: var(--shadow);
}

.college-name {
    font-family: var(--font-heading);
    font-size: 1.2rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    color: var(--dark);
}

.college-branch {
    color: var(--text2);
    font-size: 0.95rem;
    font-weight: 500;
    margin-bottom: 1.5rem;
}

.college-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 1rem;
    border-top: 1px solid var(--border);
}

.meta-item {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.meta-label {
    font-size: 0.75rem;
    color: var(--text2);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.meta-value {
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--dark);
}

.chance-badge {
    padding: 0.3rem 0.8rem;
    border-radius: 20px;
    font-size: 10px;
    letter-spacing: .5px;
    font-weight: 700;
    text-transform: uppercase;
    background: var(--green-light);
    color: var(--green);
    border: 1px solid rgba(39, 174, 96, 0.25);
}

/* Responsive */
@media (max-width: 768px) {
    .hero-text h1 {
        font-size: 2.8rem;
    }
    
    .input-row {
        flex-direction: column;
        gap: 0;
    }
}

/* Print Styles for Native Browser Export */
@media print {
    /* Hide navigation and footers */
    nav, footer, .mobile-menu, .btn-back, .btn-export, .top-bar {
        display: none !important;
    }
    
    /* Ensure white background */
    body {
        background: #FFF !important;
        color: #000 !important;
    }
    
    /* Make results expand natively to take up space */
    .container {
        padding: 0 !important;
        max-width: 100% !important;
    }

    .form-container, .hero-text {
        display: none !important;
    }
    
    .results-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        page-break-inside: avoid;
    }
    
    .result-card {
        box-shadow: none !important;
        border: 1px solid #CCC !important;
        page-break-inside: avoid;
        margin-bottom: 10px;
    }
    
    /* Force exact coloring so badges and fonts keep their gradients */
    * {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }
}

/* IMPORTED THEME ELEMENTS */
/* NAV - WORKING VERSION */
nav{position:sticky;top:0;z-index:100;background:rgba(255,255,255,0.98);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);padding:0 5%}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:64px;max-width:1400px;margin:0 auto}
.nav-logo{cursor:pointer;transition:opacity .2s}
.nav-logo:hover{opacity:0.8}
.nav-logo img{height:48px;width:auto;object-fit:contain}
.nav-links{display:flex;gap:4px;list-style:none;align-items:center;margin:0;padding:0}
.nav-item{position:relative}
.nav-item>a{color:var(--text);text-decoration:none;font-size:14px;font-weight:500;padding:10px 18px;display:inline-flex;align-items:center;gap:6px;border-radius:6px;transition:all .2s;cursor:pointer}
.nav-item>a:hover{color:var(--red);background:var(--red-light)}
.nav-item.active>a{color:var(--red);font-weight:600}
.dropdown-arrow{font-size:9px;transition:transform .2s;margin-left:2px}
.nav-item:hover .dropdown-arrow{transform:rotate(180deg)}

/* DROPDOWN - HIDDEN BY DEFAULT */
.nav-item .dropdown{
  visibility:hidden;
  opacity:0;
  position:absolute;
  top:100%;
  left:0;
  margin-top:8px;
  background:var(--white);
  border:1px solid var(--border);
  border-radius:12px;
  min-width:280px;
  padding:12px;
  box-shadow:0 8px 28px rgba(0,0,0,0.12);
  z-index:9999;
  pointer-events:none;
  transition:opacity 0.2s, visibility 0.2s;
}

/* SHOW ON HOVER */
.nav-item:hover > .dropdown{
  visibility:visible;
  opacity:1;
  pointer-events:auto;
}

/* Dropdown links */
.dropdown a{
  display:block;
  padding:11px 14px;
  color:var(--text);
  text-decoration:none;
  font-size:13.5px;
  font-weight:500;
  border-radius:8px;
  transition:all .2s;
  white-space:nowrap;
  line-height:1.4;
}
.dropdown a:hover{
  background:var(--red-light);
  color:var(--red);
  transform:translateX(3px);
}
.dropdown-divider{
  height:1px;
  background:var(--border);
  margin:10px 6px;
}

/* Right side */
.nav-right{display:flex;align-items:center;gap:20px;flex-shrink:0}
.nav-phone{
  font-size:14px;
  color:var(--text);
  text-decoration:none;
  font-weight:600;
  display:flex;
  align-items:center;
  gap:6px;
  transition:color .2s;
  padding:8px 12px;
  border-radius:6px;
}
.nav-phone:hover{
  color:var(--red);
  background:var(--red-light);
}
.nav-cta{
  background:var(--red);
  color:#fff;
  padding:11px 26px;
  border-radius:8px;
  font-size:14px;
  font-weight:600;
  text-decoration:none;
  transition:all .25s;
  white-space:nowrap;
  box-shadow:0 2px 8px rgba(192,57,43,0.2);
}
.nav-cta:hover{
  background:var(--red2);
  transform:translateY(-2px);
  box-shadow:0 4px 12px rgba(192,57,43,0.3);
}

/* Mobile */
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:8px}
.hamburger span{width:24px;height:2.5px;background:var(--text);border-radius:2px;transition:.3s}
.mobile-menu{
  display:none;
  position:fixed;
  top:64px;
  left:0;
  right:0;
  background:var(--white);
  border-bottom:1px solid var(--border);
  padding:24px 5%;
  z-index:99;
  box-shadow:0 8px 24px rgba(0,0,0,0.08);
  max-height:calc(100vh - 64px);
  overflow-y:auto;
}
.mobile-menu.open{display:block}
.mobile-nav-group{margin-bottom:28px}
.mobile-nav-group:last-of-type{margin-bottom:16px}
.mobile-nav-group-title{
  font-size:11px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--text2);
  font-weight:700;
  margin-bottom:14px;
  padding-left:4px;
  border-bottom:1px solid var(--border);
  padding-bottom:8px;
}
.mobile-menu a{
  color:var(--text);
  text-decoration:none;
  font-size:14.5px;
  font-weight:500;
  padding:10px 4px;
  display:block;
  transition:all .2s;
  border-radius:6px;
}
.mobile-menu a:hover{
  color:var(--red);
  background:var(--red-light);
  padding-left:12px;
}
.mobile-menu .nav-phone{
  margin-top:20px;
  padding-top:20px;
  border-top:2px solid var(--border);
  font-weight:600;
}

@media(max-width:768px){
  .nav-links,.nav-phone{display:none}
  .hamburger{display:flex}
  .nav-inner{height:60px}
  .nav-logo img{height:44px}
}

@media(max-width:480px){
  nav{padding:0 4%}
  .mobile-menu{padding:20px 4%}
}

/* DROPDOWN - WITH INVISIBLE GAP BRIDGE */
.dropdown{
  display:none !important;
  position:absolute !important;
  top:100% !important;
  left:0 !important;
  margin-top:0px !important;
  padding-top:8px !important;
  background:transparent;
  z-index:9999 !important;
}

/* Inner dropdown container with actual styling */
.dropdown::before{
  content:'';
  display:block;
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:8px;
  background:transparent;
}

.dropdown::after{
  content:'';
  display:block;
  background:var(--white);
  border:1px solid var(--border);
  border-radius:12px;
  box-shadow:0 8px 28px rgba(0,0,0,0.12);
  position:absolute;
  top:8px;
  left:0;
  right:0;
  bottom:0;
  z-index:-1;
}

/* Show dropdown on hover - KEEP VISIBLE */
.nav-item:hover .dropdown,
.nav-item .dropdown:hover{
  display:block !important;
}

/* Dropdown links - positioned above the background */
.dropdown a{
  display:block;
  padding:11px 14px;
  color:var(--text);
  text-decoration:none;
  font-size:13.5px;
  font-weight:500;
  border-radius:8px;
  transition:all .2s;
  white-space:nowrap;
  line-height:1.4;
  position:relative;
  z-index:1;
  margin:0 12px;
  min-width:256px;
}
.dropdown a:first-child{
  margin-top:8px;
}
.dropdown a:last-child{
  margin-bottom:8px;
}
.dropdown a:hover{
  background:var(--red-light);
  color:var(--red);
  transform:translateX(3px);
}
.dropdown-divider{
  height:1px;
  background:var(--border);
  margin:10px 18px;
  position:relative;
  z-index:1;
}

/* Right side nav items */
.nav-right{display:flex;align-items:center;gap:20px;flex-shrink:0}
.nav-phone{
  font-size:14px;
  color:var(--text);
  text-decoration:none;
  font-weight:600;
  display:flex;
  align-items:center;
  gap:6px;
  transition:color .2s;
  padding:8px 12px;
  border-radius:6px;
}
.nav-phone:hover{
  color:var(--red);
  background:var(--red-light);
}
.nav-cta{
  background:var(--red);
  color:#fff;
  padding:11px 26px;
  border-radius:8px;
  font-size:14px;
  font-weight:600;
  text-decoration:none;
  transition:all .25s;
  white-space:nowrap;
  box-shadow:0 2px 8px rgba(192,57,43,0.2);
}
.nav-cta:hover{
  background:var(--red2);
  transform:translateY(-2px);
  box-shadow:0 4px 12px rgba(192,57,43,0.3);
}

/* Mobile Menu */
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:8px}
.hamburger span{width:24px;height:2.5px;background:var(--text);border-radius:2px;transition:.3s}

.mobile-menu{
  display:none;
  position:fixed;
  top:64px;
  left:0;
  right:0;
  background:var(--white);
  border-bottom:1px solid var(--border);
  padding:24px 5%;
  z-index:99;
  box-shadow:0 8px 24px rgba(0,0,0,0.08);
  max-height:calc(100vh - 64px);
  overflow-y:auto;
}
.mobile-menu.open{display:block}
.mobile-nav-group{margin-bottom:28px}
.mobile-nav-group:last-of-type{margin-bottom:16px}
.mobile-nav-group-title{
  font-size:11px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--text2);
  font-weight:700;
  margin-bottom:14px;
  padding-left:4px;
  border-bottom:1px solid var(--border);
  padding-bottom:8px;
}
.mobile-menu a{
  color:var(--text);
  text-decoration:none;
  font-size:14.5px;
  font-weight:500;
  padding:10px 4px;
  display:block;
  transition:all .2s;
  border-radius:6px;
}
.mobile-menu a:hover{
  color:var(--red);
  background:var(--red-light);
  padding-left:12px;
}
.mobile-menu .nav-phone{
  margin-top:20px;
  padding-top:20px;
  border-top:2px solid var(--border);
  font-weight:600;
}

/* Responsive adjustments */
@media(max-width:768px){
  .nav-links,.nav-phone{display:none !important}
  .hamburger{display:flex !important}
  .nav-inner{height:60px}
  .nav-logo img{height:44px}
}

@media(max-width:480px){
  nav{padding:0 4%}
  .mobile-menu{padding:20px 4%}
}

/* CRITICAL: Dropdown must be hidden and positioned absolutely */
.dropdown{
  display:none !important;
  position:absolute !important;
  top:100% !important;
  left:0 !important;
  margin-top:4px !important;
  background:var(--white);
  border:1px solid var(--border);
  border-radius:12px;
  min-width:280px;
  padding:12px;
  box-shadow:0 8px 28px rgba(0,0,0,0.12);
  z-index:9999 !important;
}

/* Show dropdown on hover */
.nav-item:hover .dropdown{
  display:block !important;
}

/* Dropdown links */
.dropdown a{
  display:block;
  padding:11px 14px;
  color:var(--text);
  text-decoration:none;
  font-size:13.5px;
  font-weight:500;
  border-radius:8px;
  transition:all .2s;
  white-space:nowrap;
  line-height:1.4;
}
.dropdown a:hover{
  background:var(--red-light);
  color:var(--red);
  transform:translateX(3px);
}
.dropdown-divider{
  height:1px;
  background:var(--border);
  margin:10px 6px;
}

/* Right side nav items */
.nav-right{display:flex;align-items:center;gap:20px;flex-shrink:0}
.nav-phone{
  font-size:14px;
  color:var(--text);
  text-decoration:none;
  font-weight:600;
  display:flex;
  align-items:center;
  gap:6px;
  transition:color .2s;
  padding:8px 12px;
  border-radius:6px;
}
.nav-phone:hover{
  color:var(--red);
  background:var(--red-light);
}
.nav-cta{
  background:var(--red);
  color:#fff;
  padding:11px 26px;
  border-radius:8px;
  font-size:14px;
  font-weight:600;
  text-decoration:none;
  transition:all .25s;
  white-space:nowrap;
  box-shadow:0 2px 8px rgba(192,57,43,0.2);
}
.nav-cta:hover{
  background:var(--red2);
  transform:translateY(-2px);
  box-shadow:0 4px 12px rgba(192,57,43,0.3);
}

/* Mobile Menu */
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:8px}
.hamburger span{width:24px;height:2.5px;background:var(--text);border-radius:2px;transition:.3s}

.mobile-menu{
  display:none;
  position:fixed;
  top:64px;
  left:0;
  right:0;
  background:var(--white);
  border-bottom:1px solid var(--border);
  padding:24px 5%;
  z-index:99;
  box-shadow:0 8px 24px rgba(0,0,0,0.08);
  max-height:calc(100vh - 64px);
  overflow-y:auto;
}
.mobile-menu.open{display:block}
.mobile-nav-group{margin-bottom:28px}
.mobile-nav-group:last-of-type{margin-bottom:16px}
.mobile-nav-group-title{
  font-size:11px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--text2);
  font-weight:700;
  margin-bottom:14px;
  padding-left:4px;
  border-bottom:1px solid var(--border);
  padding-bottom:8px;
}
.mobile-menu a{
  color:var(--text);
  text-decoration:none;
  font-size:14.5px;
  font-weight:500;
  padding:10px 4px;
  display:block;
  transition:all .2s;
  border-radius:6px;
}
.mobile-menu a:hover{
  color:var(--red);
  background:var(--red-light);
  padding-left:12px;
}
.mobile-menu .nav-phone{
  margin-top:20px;
  padding-top:20px;
  border-top:2px solid var(--border);
  font-weight:600;
}

/* Responsive adjustments */
@media(max-width:768px){
  .nav-links,.nav-phone{display:none !important}
  .hamburger{display:flex !important}
  .nav-inner{height:60px}
  .nav-logo img{height:44px}
}

@media(max-width:480px){
  nav{padding:0 4%}
  .mobile-menu{padding:20px 4%}
}

/* Dropdown Menu - CRITICAL: Hidden by default, shows only on hover */
.dropdown{
  display:none;
  position:absolute;
  top:calc(100% + 4px);
  left:0;
  background:var(--white);
  border:1px solid var(--border);
  border-radius:12px;
  min-width:280px;
  padding:12px;
  box-shadow:0 8px 28px rgba(0,0,0,0.12);
  opacity:0;
  visibility:hidden;
  transform:translateY(-10px);
  transition:opacity .25s ease, transform .25s ease, visibility .25s;
  z-index:1000;
}

/* Show dropdown on parent hover */
.nav-item:hover > .dropdown{
  display:block;
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}

/* Keep dropdown visible when hovering over it */
.dropdown:hover{
  display:block;
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}

/* Dropdown links */
.dropdown a{
  display:block;
  padding:11px 14px;
  color:var(--text);
  text-decoration:none;
  font-size:13.5px;
  font-weight:500;
  border-radius:8px;
  transition:all .2s;
  white-space:nowrap;
  line-height:1.4;
}
.dropdown a:hover{
  background:var(--red-light);
  color:var(--red);
  transform:translateX(3px);
}
.dropdown-divider{
  height:1px;
  background:var(--border);
  margin:10px 6px;
}

/* Right side nav items */
.nav-right{display:flex;align-items:center;gap:20px;flex-shrink:0}
.nav-phone{
  font-size:14px;
  color:var(--text);
  text-decoration:none;
  font-weight:600;
  display:flex;
  align-items:center;
  gap:6px;
  transition:color .2s;
  padding:8px 12px;
  border-radius:6px;
}
.nav-phone:hover{
  color:var(--red);
  background:var(--red-light);
}
.nav-cta{
  background:var(--red);
  color:#fff;
  padding:11px 26px;
  border-radius:8px;
  font-size:14px;
  font-weight:600;
  text-decoration:none;
  transition:all .25s;
  white-space:nowrap;
  box-shadow:0 2px 8px rgba(192,57,43,0.2);
}
.nav-cta:hover{
  background:var(--red2);
  transform:translateY(-2px);
  box-shadow:0 4px 12px rgba(192,57,43,0.3);
}

/* Mobile Menu */
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:8px}
.hamburger span{width:24px;height:2.5px;background:var(--text);border-radius:2px;transition:.3s}
.hamburger.open span:nth-child(1){transform:rotate(45deg) translate(6px, 6px)}
.hamburger.open span:nth-child(2){opacity:0}
.hamburger.open span:nth-child(3){transform:rotate(-45deg) translate(6px, -6px)}

.mobile-menu{
  display:none;
  position:fixed;
  top:64px;
  left:0;
  right:0;
  background:var(--white);
  border-bottom:1px solid var(--border);
  padding:24px 5%;
  z-index:99;
  box-shadow:0 8px 24px rgba(0,0,0,0.08);
  max-height:calc(100vh - 64px);
  overflow-y:auto;
}
.mobile-menu.open{display:block}
.mobile-nav-group{margin-bottom:28px}
.mobile-nav-group:last-of-type{margin-bottom:16px}
.mobile-nav-group-title{
  font-size:11px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--text2);
  font-weight:700;
  margin-bottom:14px;
  padding-left:4px;
  border-bottom:1px solid var(--border);
  padding-bottom:8px;
}
.mobile-menu a{
  color:var(--text);
  text-decoration:none;
  font-size:14.5px;
  font-weight:500;
  padding:10px 4px;
  display:block;
  transition:all .2s;
  border-radius:6px;
}
.mobile-menu a:hover{
  color:var(--red);
  background:var(--red-light);
  padding-left:12px;
}
.mobile-menu .nav-phone{
  margin-top:20px;
  padding-top:20px;
  border-top:2px solid var(--border);
  font-weight:600;
}

/* Responsive adjustments */
@media(max-width:768px){
  .nav-links,.nav-phone{display:none}
  .hamburger{display:flex}
  .nav-inner{height:60px}
  .nav-logo img{height:44px}
}

@media(max-width:480px){
  nav{padding:0 4%}
  .mobile-menu{padding:20px 4%}
}

/* Dropdown Menu - Enhanced with better spacing */
.dropdown{
  display:none;
  position:absolute;
  top:100%;
  left:0;
  background:var(--white);
  border:1px solid var(--border);
  border-radius:12px;
  min-width:280px;
  padding:12px;
  margin-top:8px;
  box-shadow:0 8px 28px rgba(0,0,0,0.12);
  opacity:0;
  transform:translateY(-10px);
  transition:all .3s cubic-bezier(0.4, 0, 0.2, 1);
  transition-delay:0s;
}
.nav-item:hover .dropdown{
  display:block;
  opacity:1;
  transform:translateY(0);
  transition-delay:0s;
}
.dropdown:hover{
  display:block;
  opacity:1;
  transform:translateY(0);
}
.nav-item .dropdown{pointer-events:none}
.nav-item:hover .dropdown{pointer-events:auto}

/* Dropdown section headers */
.dropdown-section-title{
  font-size:10px;
  letter-spacing:1.2px;
  text-transform:uppercase;
  color:var(--text2);
  font-weight:700;
  padding:8px 12px 6px;
  margin-bottom:4px;
  border-bottom:1px solid var(--border);
}

/* Dropdown links */
.dropdown a{
  display:block;
  padding:11px 14px;
  color:var(--text);
  text-decoration:none;
  font-size:13.5px;
  font-weight:500;
  border-radius:8px;
  transition:all .2s;
  white-space:nowrap;
  line-height:1.4;
}
.dropdown a:hover{
  background:var(--red-light);
  color:var(--red);
  transform:translateX(3px);
}
.dropdown-divider{
  height:1px;
  background:var(--border);
  margin:10px 6px;
}

/* Right side nav items */
.nav-right{display:flex;align-items:center;gap:20px;flex-shrink:0}
.nav-phone{
  font-size:14px;
  color:var(--text);
  text-decoration:none;
  font-weight:600;
  display:flex;
  align-items:center;
  gap:6px;
  transition:color .2s;
  padding:8px 12px;
  border-radius:6px;
}
.nav-phone:hover{
  color:var(--red);
  background:var(--red-light);
}
.nav-cta{
  background:var(--red);
  color:#fff;
  padding:11px 26px;
  border-radius:8px;
  font-size:14px;
  font-weight:600;
  text-decoration:none;
  transition:all .25s;
  white-space:nowrap;
  box-shadow:0 2px 8px rgba(192,57,43,0.2);
}
.nav-cta:hover{
  background:var(--red2);
  transform:translateY(-2px);
  box-shadow:0 4px 12px rgba(192,57,43,0.3);
}

/* Mobile Menu */
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:8px}
.hamburger span{width:24px;height:2.5px;background:var(--text);border-radius:2px;transition:.3s}
.hamburger.open span:nth-child(1){transform:rotate(45deg) translate(6px, 6px)}
.hamburger.open span:nth-child(2){opacity:0}
.hamburger.open span:nth-child(3){transform:rotate(-45deg) translate(6px, -6px)}

.mobile-menu{
  display:none;
  position:fixed;
  top:64px;
  left:0;
  right:0;
  background:var(--white);
  border-bottom:1px solid var(--border);
  padding:24px 5%;
  z-index:99;
  box-shadow:0 8px 24px rgba(0,0,0,0.08);
  max-height:calc(100vh - 64px);
  overflow-y:auto;
}
.mobile-menu.open{display:block}
.mobile-nav-group{margin-bottom:28px}
.mobile-nav-group:last-of-type{margin-bottom:16px}
.mobile-nav-group-title{
  font-size:11px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--text2);
  font-weight:700;
  margin-bottom:14px;
  padding-left:4px;
  border-bottom:1px solid var(--border);
  padding-bottom:8px;
}
.mobile-menu a{
  color:var(--text);
  text-decoration:none;
  font-size:14.5px;
  font-weight:500;
  padding:10px 4px;
  display:block;
  transition:all .2s;
  border-radius:6px;
}
.mobile-menu a:hover{
  color:var(--red);
  background:var(--red-light);
  padding-left:12px;
}
.mobile-menu .nav-phone{
  margin-top:20px;
  padding-top:20px;
  border-top:2px solid var(--border);
  font-weight:600;
}

/* Responsive adjustments */
@media(max-width:768px){
  .nav-links,.nav-phone{display:none}
  .hamburger{display:flex}
  .nav-inner{height:60px}
  .nav-logo img{height:44px}
}

@media(max-width:480px){
  nav{padding:0 4%}
  .mobile-menu{padding:20px 4%}
}

/* Dropdown Menu - FIXED: Added delay before hiding */
.dropdown{display:none;position:absolute;top:100%;left:0;background:var(--white);border:1px solid var(--border);border-radius:12px;min-width:240px;padding:8px;margin-top:8px;box-shadow:0 8px 24px rgba(0,0,0,0.08);opacity:0;transform:translateY(-10px);transition:all .3s;transition-delay:0s}
.nav-item:hover .dropdown{display:block;opacity:1;transform:translateY(0);transition-delay:0s}
.dropdown:hover{display:block;opacity:1;transform:translateY(0)}
.nav-item .dropdown{pointer-events:none}
.nav-item:hover .dropdown{pointer-events:auto}
.dropdown a{display:block;padding:10px 14px;color:var(--text2);text-decoration:none;font-size:13px;border-radius:8px;transition:all .2s;white-space:nowrap}
.dropdown a:hover{background:var(--red-light);color:var(--red)}
.dropdown-divider{height:1px;background:var(--border);margin:8px 0}

.nav-right{display:flex;align-items:center;gap:20px;flex-shrink:0}
.nav-phone{font-size:14px;color:var(--text);text-decoration:none;font-weight:500;display:flex;align-items:center;gap:6px;transition:color .2s}
.nav-phone:hover{color:var(--red)}
.nav-cta{background:var(--red);color:#fff;padding:10px 24px;border-radius:8px;font-size:14px;font-weight:600;text-decoration:none;transition:all .2s;white-space:nowrap}
.nav-cta:hover{background:var(--red2);transform:translateY(-1px)}

/* Mobile Menu */
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:4px}
.hamburger span{width:22px;height:2px;background:var(--text);border-radius:2px;transition:.3s}
.mobile-menu{display:none;position:fixed;top:64px;left:0;right:0;background:var(--white);border-bottom:1px solid var(--border);padding:20px 5%;z-index:99;box-shadow:0 8px 24px rgba(0,0,0,0.08);max-height:calc(100vh - 64px);overflow-y:auto}
.mobile-menu.open{display:block}
.mobile-nav-group{margin-bottom:24px}
.mobile-nav-group-title{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--text2);font-weight:700;margin-bottom:12px;padding-left:4px}
.mobile-menu a{color:var(--text2);text-decoration:none;font-size:14px;padding:8px 4px;display:block;transition:color .2s}
.mobile-menu a:hover{color:var(--red)}
.mobile-menu .nav-phone{margin-top:16px;padding-top:16px;border-top:1px solid var(--border)}

/* Dropdown Menu */
.dropdown{display:none;position:absolute;top:100%;left:0;background:var(--white);border:1px solid var(--border);border-radius:12px;min-width:240px;padding:8px;margin-top:8px;box-shadow:0 8px 24px rgba(0,0,0,0.08);opacity:0;transform:translateY(-10px);transition:all .3s}
.nav-item:hover .dropdown{display:block;opacity:1;transform:translateY(0)}
.dropdown a{display:block;padding:10px 14px;color:var(--text2);text-decoration:none;font-size:13px;border-radius:8px;transition:all .2s;white-space:nowrap}
.dropdown a:hover{background:var(--red-light);color:var(--red)}
.dropdown-divider{height:1px;background:var(--border);margin:8px 0}

.nav-right{display:flex;align-items:center;gap:20px;flex-shrink:0}
.nav-phone{font-size:14px;color:var(--text);text-decoration:none;font-weight:500;display:flex;align-items:center;gap:6px;transition:color .2s}
.nav-phone:hover{color:var(--red)}
.nav-cta{background:var(--red);color:#fff;padding:10px 24px;border-radius:8px;font-size:14px;font-weight:600;text-decoration:none;transition:all .2s;white-space:nowrap}
.nav-cta:hover{background:var(--red2);transform:translateY(-1px)}

/* Mobile Menu */
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:4px}
.hamburger span{width:22px;height:2px;background:var(--text);border-radius:2px;transition:.3s}
.mobile-menu{display:none;position:fixed;top:64px;left:0;right:0;background:var(--white);border-bottom:1px solid var(--border);padding:20px 5%;z-index:99;box-shadow:0 8px 24px rgba(0,0,0,0.08);max-height:calc(100vh - 64px);overflow-y:auto}
.mobile-menu.open{display:block}
.mobile-nav-group{margin-bottom:24px}
.mobile-nav-group-title{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--text2);font-weight:700;margin-bottom:12px;padding-left:4px}
.mobile-menu a{color:var(--text2);text-decoration:none;font-size:14px;padding:8px 4px;display:block;transition:color .2s}
.mobile-menu a:hover{color:var(--red)}
.mobile-menu .nav-phone{margin-top:16px;padding-top:16px;border-top:1px solid var(--border)}

/* FOOTER */
footer{background:var(--dark);color:#F0E8E8;padding:52px 5% 30px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;margin-bottom:36px}
.footer-logo-wrap{margin-bottom:14px}
.footer-logo-wrap img{height:56px;object-fit:contain;filter:brightness(1.1)}
.footer-brand p{font-size:13px;color:#B09090;line-height:1.7;margin-bottom:18px;max-width:270px}
.footer-contact{font-size:13px;color:#B09090;line-height:2.2}
.footer-contact a{color:#F4A4A4;text-decoration:none;transition:color .2s}
.footer-contact a:hover{color:#fff}
.footer-col h5{font-family:'Syne',sans-serif;font-size:12px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;margin-bottom:16px;color:#F0E8E8}
.footer-col ul{list-style:none}
.footer-col li{margin-bottom:10px}
.footer-col a{color:#B09090;text-decoration:none;font-size:13px;transition:color .2s}
.footer-col a:hover{color:#F4A4A4}
.footer-bottom{border-top:1px solid rgba(255,255,255,0.08);padding-top:22px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px}
.footer-bottom p{font-size:12px;color:#7A5A5A}
.social-row{display:flex;gap:10px}
.social-btn{width:34px;height:34px;border-radius:9px;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.1);display:flex;align-items:center;justify-content:center;font-size:13px;text-decoration:none;transition:all .2s;color:#B09090}
.social-btn:hover{background:rgba(192,57,43,0.2);border-color:rgba(192,57,43,0.4);color:#F4A4A4;transform:translateY(-2px)}
.play-btn{display:inline-flex;align-items:center;gap:10px;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.12);border-radius:10px;padding:10px 16px;text-decoration:none;color:#F0E8E8;font-size:13px;transition:all .2s;margin-top:14px}
.play-btn:hover{border-color:rgba(192,57,43,0.4);color:#F4A4A4}