/* ============================================= AURRUM HOME PAGE CSS — Full Updated Stylesheet ============================================= */
 :root {
     --gold: #BA9E6A;
     --gold-light: #D4B87E;
     --dark: #003E5A;
     --dark-2: #004564;
     --dark-3: #004F72;
     --mid: #005580;
     --text-muted: #8FB8CC;
     --text-light: #C8E0EC;
     --white: #ffffff;
}
 *, *::before, *::after {
     box-sizing: border-box;
     margin: 0;
     padding: 0;
}
 html {
     scroll-behavior: smooth;
}
 body {
     font-family: 'DM Sans', sans-serif;
     background: var(--dark);
     color: var(--white);
     overflow-x: hidden;
}
 body::before {
     content: '';
     position: fixed;
     inset: 0;
     background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.03'/%3E%3C/svg%3E");
     pointer-events: none;
     z-index: 9999;
     opacity: 0.35;
}
/* ===== NAVBAR ===== */
 nav {
     position: fixed;
     top: 0;
     left: 0;
     right: 0;
     z-index: 200;
     padding: 0 60px;
     height: 72px;
     display: flex;
     align-items: center;
     justify-content: space-between;
     background: rgba(0,62,90,0.97);
     backdrop-filter: blur(14px);
     border-bottom: 1px solid rgba(186,158,106,0.18);
}
 .logo {
     font-family: 'Cormorant Garamond', serif;
     font-size: 26px;
     font-weight: 700;
     letter-spacing: 3px;
     color: var(--gold);
     text-transform: uppercase;
     text-decoration: none;
     flex-shrink: 0;
}
 .logo span {
     color: var(--white);
}
 .nav-links {
     display: flex;
     gap: 36px;
     list-style: none;
}
 .nav-links a {
     font-size: 11px;
     font-weight: 500;
     letter-spacing: 2px;
     text-transform: uppercase;
     color: var(--text-light);
     text-decoration: none;
     transition: color 0.3s;
}
 .nav-links a:hover {
     color: var(--gold);
}
 .nav-cta {
     border: 1px solid var(--gold);
     color: var(--gold) !important;
     padding: 9px 22px;
     font-size: 11px;
     font-weight: 600;
     letter-spacing: 2px;
     text-transform: uppercase;
     text-decoration: none;
     transition: all 0.3s;
     display: flex;
     align-items: center;
     gap: 7px;
}
 .nav-cta:hover {
     background: var(--gold);
     color: var(--dark) !important;
}
 .hamburger {
     display: none;
     flex-direction: column;
     gap: 5px;
     cursor: pointer;
     padding: 4px;
}
 .hamburger span {
     display: block;
     width: 24px;
     height: 2px;
     background: var(--gold);
     transition: all 0.3s;
     border-radius: 2px;
}
 .hamburger.open span:nth-child(1) {
     transform: rotate(45deg) translate(5px,5px);
}
 .hamburger.open span:nth-child(2) {
     opacity: 0;
}
 .hamburger.open span:nth-child(3) {
     transform: rotate(-45deg) translate(5px,-5px);
}
 .mobile-menu {
     display: none;
     position: fixed;
     top: 72px;
     left: 0;
     right: 0;
     background: rgba(0,56,82,0.99);
     backdrop-filter: blur(16px);
     border-bottom: 1px solid rgba(186,158,106,0.2);
     padding: 20px 28px 28px;
     z-index: 150;
     flex-direction: column;
}
 .mobile-menu.open {
     display: flex;
}
 .mobile-menu a {
     font-size: 13px;
     font-weight: 500;
     letter-spacing: 2px;
     text-transform: uppercase;
     color: var(--text-light);
     text-decoration: none;
     padding: 13px 0;
     border-bottom: 1px solid rgba(255,255,255,0.06);
     transition: color 0.3s;
     display: flex;
     align-items: center;
     gap: 10px;
}
 .mobile-menu a i {
     color: var(--gold);
     width: 16px;
}
 .mobile-menu a:hover {
     color: var(--gold);
}
 .mobile-cta {
     margin-top: 18px !important;
     background: var(--gold);
     color: var(--dark) !important;
     padding: 13px 20px;
     font-weight: 700;
     justify-content: center;
     border-bottom: none !important;
}
/* ===== HERO ===== */
 .hero {
     position: relative;
     min-height: 100vh;
     display: grid;
     grid-template-columns: 1fr 1fr;
     align-items: center;
     overflow: hidden;
     padding: 100px 60px 80px;
     gap: 60px;
}
 .hero-bg {
     position: absolute;
     inset: 0;
     background: radial-gradient(ellipse 70% 70% at 80% 50%, rgba(186,158,106,0.09) 0%, transparent 70%), radial-gradient(ellipse 40% 40% at 10% 80%, rgba(186,158,106,0.05) 0%, transparent 60%), var(--dark);
}
 .hero-grid-lines {
     position: absolute;
     inset: 0;
     background-image: linear-gradient(rgba(186,158,106,0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(186,158,106,0.04) 1px, transparent 1px);
     background-size: 80px 80px;
}
 .hero-content {
     position: relative;
     z-index: 2;
}
 .hero-label {
     display: inline-flex;
     align-items: center;
     gap: 10px;
     font-size: 11px;
     font-weight: 600;
     letter-spacing: 4px;
     text-transform: uppercase;
     color: var(--gold);
     margin-bottom: 26px;
     animation: fadeUp 0.8s ease both;
}
 .hero-label::before {
     content: '';
     width: 34px;
     height: 1px;
     background: var(--gold);
     display: block;
}
 .hero-title {
     font-family: 'Cormorant Garamond', serif;
     font-size: clamp(46px, 5.5vw, 88px);
     font-weight: 300;
     line-height: 1.0;
     letter-spacing: -1px;
     margin-bottom: 26px;
     animation: fadeUp 0.8s 0.1s ease both;
}
 .hero-title em {
     font-style: italic;
     color: var(--gold);
}
 .hero-desc {
     font-size: 15px;
     font-weight: 300;
     line-height: 1.85;
     color: var(--text-light);
     max-width: 460px;
     margin-bottom: 36px;
     animation: fadeUp 0.8s 0.2s ease both;
}
 .hero-actions {
     display: flex;
     gap: 18px;
     align-items: center;
     flex-wrap: wrap;
     animation: fadeUp 0.8s 0.3s ease both;
}
 .hero-stats {
     display: flex;
     gap: 40px;
     margin-top: 52px;
     animation: fadeUp 0.8s 0.4s ease both;
}
 .stat-num {
     font-family: 'Cormorant Garamond', serif;
     font-size: 44px;
     font-weight: 600;
     color: var(--gold);
     line-height: 1;
     display: block;
}
 .stat-label {
     font-size: 10px;
     font-weight: 500;
     letter-spacing: 2px;
     text-transform: uppercase;
     color: var(--text-muted);
     display: block;
     margin-top: 3px;
}
 .hero-visual {
     position: relative;
     z-index: 2;
     display: flex;
     align-items: center;
     justify-content: center;
     animation: fadeUp 0.8s 0.25s ease both;
}
/* ===== BUTTONS ===== */
 .btn-primary {
     background: var(--gold);
     color: var(--dark) !important;
     padding: 14px 34px;
     font-family: 'DM Sans', sans-serif;
     font-size: 12px;
     font-weight: 700;
     letter-spacing: 2px;
     text-transform: uppercase;
     text-decoration: none;
     transition: all 0.3s;
     display: inline-flex;
     align-items: center;
     gap: 8px;
     border: none;
     cursor: pointer;
}
 .btn-primary:hover {
     background: var(--gold-light) !important;
     transform: translateY(-2px);
     box-shadow: 0 12px 40px rgba(186,158,106,0.35);
}
 .btn-ghost {
     color: var(--white);
     font-size: 12px;
     font-weight: 500;
     letter-spacing: 2px;
     text-transform: uppercase;
     text-decoration: none;
     display: inline-flex;
     align-items: center;
     gap: 9px;
     transition: color 0.3s;
     background: none;
     border: none;
     cursor: pointer;
}
 .btn-ghost:hover {
     color: var(--gold);
}
 .btn-ghost .fa-arrow-right {
     transition: transform 0.3s;
}
 .btn-ghost:hover .fa-arrow-right {
     transform: translateX(4px);
}
/* ===== TICKER ===== */
 .countries-ticker {
     background: var(--gold);
     padding: 13px 0;
     overflow: hidden;
}
 .ticker-track {
     display: flex;
     gap: 56px;
     animation: ticker 22s linear infinite;
     width: max-content;
}
 .ticker-item {
     display: flex;
     align-items: center;
     gap: 9px;
     font-size: 13px;
     font-weight: 700;
     letter-spacing: 2px;
     text-transform: uppercase;
     color: var(--dark) !important;
     white-space: nowrap;
}
 .ticker-dot {
     width: 5px;
     height: 5px;
     background: var(--dark);
     border-radius: 50%;
     flex-shrink: 0;
}
 @keyframes ticker {
     from {
         transform: translateX(0);
    }
     to {
         transform: translateX(-50%);
    }
}
/* ===== SECTIONS ===== */
 .section {
     padding: 110px 60px;
}
 .section-label {
     font-size: 10px;
     font-weight: 700;
     letter-spacing: 4px;
     text-transform: uppercase;
     color: var(--gold);
     margin-bottom: 16px;
     display: flex;
     align-items: center;
     gap: 10px;
}
 .section-label::before {
     content: '';
     width: 26px;
     height: 1px;
     background: var(--gold);
     display: block;
}
 .section-label.center {
     justify-content: center;
}
 .section-label.center::before {
     display: none;
}
 .section-title {
     font-family: 'Cormorant Garamond', serif;
     font-size: clamp(30px, 3.8vw, 50px);
     font-weight: 300;
     line-height: 1.1;
     margin-bottom: 18px;
}
 .section-title em {
     font-style: italic;
     color: var(--gold);
}
 .divider {
     width: 52px;
     height: 1px;
     background: var(--gold);
     margin: 26px 0;
}
/* ===== ABOUT ===== */
 .about-grid {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 80px;
     align-items: center;
}
 .about-text p {
     font-size: 15px;
     font-weight: 300;
     line-height: 1.9;
     color: var(--text-light);
     margin-bottom: 16px;
}
 .pillar {
     padding: 26px 0;
     border-top: 1px solid rgba(255,255,255,0.07);
     display: grid;
     grid-template-columns: 40px 1fr;
     gap: 18px;
     transition: border-color 0.3s;
}
 .pillar:last-child {
     border-bottom: 1px solid rgba(255,255,255,0.07);
}
 .pillar:hover {
     border-top-color: rgba(186,158,106,0.4);
}
 .pillar-num {
     font-family: 'Cormorant Garamond', serif;
     font-size: 13px;
     font-weight: 600;
     color: var(--gold);
     padding-top: 2px;
}
 .pillar-title {
     font-size: 13px;
     font-weight: 600;
     letter-spacing: 1px;
     text-transform: uppercase;
     margin-bottom: 6px;
}
 .pillar-title i {
     color: var(--gold);
     margin-right: 6px;
     font-size: 10px;
}
 .pillar-text {
     font-size: 13px;
     font-weight: 300;
     line-height: 1.7;
     color: var(--text-muted);
}
/* ===== SERVICES ===== */
 .services-bg {
     background: var(--dark-2);
}
 .services-grid {
     display: grid;
     grid-template-columns: repeat(3,1fr);
     gap: 1px;
     background: rgba(186,158,106,0.12);
     margin-top: 52px;
}
 .service-card {
     background: var(--dark-2);
     padding: 40px 34px;
     position: relative;
     overflow: hidden;
     transition: background 0.4s;
}
 .service-card::before {
     content: '';
     position: absolute;
     bottom: 0;
     left: 0;
     right: 0;
     height: 2px;
     background: var(--gold);
     transform: scaleX(0);
     transition: transform 0.4s;
     transform-origin: left;
}
 .service-card:hover {
     background: var(--dark-3);
}
 .service-card:hover::before {
     transform: scaleX(1);
}
 .service-icon-wrap {
     width: 50px;
     height: 50px;
     background: rgba(186,158,106,0.1);
     border: 1px solid rgba(186,158,106,0.25);
     border-radius: 12px;
     display: flex;
     align-items: center;
     justify-content: center;
     margin-bottom: 20px;
     transition: all 0.3s;
}
 .service-card:hover .service-icon-wrap {
     background: rgba(186,158,106,0.18);
     border-color: var(--gold);
}
 .service-icon-wrap i {
     font-size: 19px;
     color: var(--gold);
}
 .service-title {
     font-family: 'Cormorant Garamond', serif;
     font-size: 21px;
     font-weight: 600;
     margin-bottom: 12px;
}
 .service-desc {
     font-size: 13px;
     font-weight: 300;
     line-height: 1.8;
     color: var(--text-muted);
}
 .service-num {
     position: absolute;
     top: 34px;
     right: 34px;
     font-family: 'Cormorant Garamond', serif;
     font-size: 42px;
     font-weight: 700;
     color: rgba(186,158,106,0.07);
     line-height: 1;
}
/* ===== PROCESS — REDESIGNED ===== */
 .process-bg {
     background: var(--dark);
}
 .process-header {
     text-align: center;
     margin-bottom: 68px;
}
 .process-subtitle {
     font-size: 15px;
     font-weight: 300;
     color: var(--text-muted);
     margin-top: 10px;
     line-height: 1.7;
}
/* Grid: 3 columns, 2 rows — snake/boustrophedon flow */
 .process-grid {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: 0;
     position: relative;
}
/* Individual card */
 .process-card {
     background: var(--dark-2);
     border: 1px solid rgba(186,158,106,0.1);
     padding: 36px 32px 48px;
     position: relative;
     transition: background 0.35s, border-color 0.35s, transform 0.35s;
     display: flex;
     flex-direction: column;
     gap: 14px;
     overflow: visible;
}
 .process-card:hover {
     background: var(--dark-3);
     border-color: rgba(186,158,106,0.35);
     transform: translateY(-4px);
     z-index: 2;
}
/* Row 2 has a slightly darker tint */
 .process-card--alt {
     background: rgba(0,69,100,0.6);
}
 .process-card--alt:hover {
     background: var(--dark-3);
}
/* Top row: card top with number + icon */
 .process-card-top {
     display: flex;
     align-items: center;
     justify-content: space-between;
     margin-bottom: 6px;
}
 .process-step-num {
     font-family: 'Cormorant Garamond', serif;
     font-size: 52px;
     font-weight: 700;
     color: rgba(186,158,106,0.13);
     line-height: 1;
     user-select: none;
     flex-shrink: 0;
}
 .process-card .process-icon-wrap {
     width: 52px;
     height: 52px;
     border: 1px solid rgba(186,158,106,0.3);
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     background: rgba(186,158,106,0.07);
     flex-shrink: 0;
     transition: all 0.3s;
}
 .process-card:hover .process-icon-wrap {
     background: rgba(186,158,106,0.16);
     border-color: var(--gold);
}
 .process-card .process-icon-wrap i {
     font-size: 20px;
     color: var(--gold);
}
 .process-card-title {
     font-family: 'Cormorant Garamond', serif;
     font-size: 20px;
     font-weight: 600;
     line-height: 1.25;
     color: var(--white);
}
 .process-card-desc {
     font-size: 13px;
     font-weight: 300;
     line-height: 1.8;
     color: var(--text-muted);
     flex: 1;
}
/* Gold bottom-accent line on hover */
 .process-card::after {
     content: '';
     position: absolute;
     bottom: 0;
     left: 0;
     right: 0;
     height: 2px;
     background: var(--gold);
     transform: scaleX(0);
     transform-origin: left;
     transition: transform 0.4s;
}
 .process-card:hover::after {
     transform: scaleX(1);
}
/* ── Connector Arrows ── Absolutely positioned at the right / bottom / left edge so they float between adjacent cards. */
 .process-connector {
     position: absolute;
     display: flex;
     align-items: center;
     justify-content: center;
     width: 32px;
     height: 32px;
     background: var(--gold);
     border-radius: 50%;
     color: var(--dark) !important;
     font-size: 13px;
     z-index: 3;
     box-shadow: 0 0 0 4px var(--dark);
     pointer-events: none;
}
/* Right arrow: sits on the right edge, vertically centered */
 .process-connector--right {
     right: -16px;
     top: 50%;
     transform: translateY(-50%);
}
/* Down arrow: sits on the bottom edge, horizontally centered */
 .process-connector--down {
     bottom: -16px;
     left: 50%;
     transform: translateX(-50%);
}
/* Left arrow: sits on the left edge, vertically centered */
 .process-connector--left {
     left: -16px;
     top: 50%;
     transform: translateY(-50%);
}
/* ===== CAROUSEL CONTROLS (shared) ===== */
 .carousel-header {
     display: flex;
     align-items: flex-end;
     justify-content: space-between;
     margin-bottom: 44px;
     flex-wrap: wrap;
     gap: 20px;
}
 .carousel-controls {
     display: flex;
     align-items: center;
     gap: 14px;
     flex-shrink: 0;
}
 .car-btn {
     width: 46px;
     height: 46px;
     border-radius: 50%;
     border: 1px solid rgba(186,158,106,0.4);
     background: transparent;
     color: var(--gold);
     font-size: 14px;
     cursor: pointer;
     display: flex;
     align-items: center;
     justify-content: center;
     transition: all 0.3s;
}
 .car-btn:hover {
     background: var(--gold);
     color: var(--dark) !important;
     border-color: var(--gold);
}
 .car-btn:disabled {
     opacity: 0.25;
     cursor: default;
     pointer-events: none;
}
 .car-dots {
     display: flex;
     gap: 7px;
     align-items: center;
}
 .car-dot {
     width: 7px;
     height: 7px;
     border-radius: 50%;
     background: rgba(186,158,106,0.25);
     cursor: pointer;
     transition: all 0.3s;
     border: none;
     padding: 0;
}
 .car-dot.active {
     background: var(--gold);
     width: 22px;
     border-radius: 4px;
}
/* ===== TEAM ===== */
 .team-bg {
     background: var(--dark-3);
}
 .team-viewport {
     overflow: hidden;
}
 .team-track {
     display: flex;
     gap: 22px;
     transition: transform 0.52s cubic-bezier(0.25,0.46,0.45,0.94);
     will-change: transform;
}
 .team-card {
     flex: 0 0 calc(25% - 17px);
     background: var(--dark-2);
     border: 1px solid rgba(255,255,255,0.05);
     overflow: hidden;
     position: relative;
     transition: box-shadow 0.35s, transform 0.35s;
}
 .team-card:hover {
     transform: translateY(-6px);
     box-shadow: 0 22px 56px rgba(0,0,0,0.35);
}
 .team-photo {
     position: relative;
     height: 270px;
     overflow: hidden;
     background: var(--mid);
}
 .team-photo img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     object-position: top;
     display: block;
     transition: transform 0.55s ease;
}
 .team-card:hover .team-photo img {
     transform: scale(1.07);
}
 .team-photo-overlay {
     position: absolute;
     inset: 0;
     background: linear-gradient(to top, rgba(0,50,75,0.88) 0%, rgba(0,50,75,0.1) 55%, transparent 100%);
}
 .team-photo-name {
     position: absolute;
     bottom: 0;
     left: 0;
     right: 0;
     padding: 18px 20px;
     z-index: 2;
}
 .team-name {
     font-family: 'Cormorant Garamond', serif;
     font-size: 20px;
     font-weight: 600;
     color: var(--white);
     line-height: 1.2;
     margin-bottom: 3px;
}
 .team-role-tag {
     font-size: 9px;
     font-weight: 600;
     letter-spacing: 2px;
     text-transform: uppercase;
     color: var(--gold);
     display: flex;
     align-items: center;
     gap: 5px;
}
 .team-role-tag i {
     font-size: 9px;
}
 .team-footer {
     padding: 14px 20px;
     background: rgba(0,0,0,0.18);
     border-top: 1px solid rgba(186,158,106,0.12);
     display: flex;
     align-items: center;
     justify-content: space-between;
}
 .team-country {
     font-size: 11px;
     font-weight: 300;
     color: var(--text-muted);
     display: flex;
     align-items: center;
     gap: 6px;
}
 .team-country i {
     font-size: 10px;
     color: var(--gold);
}
 .team-li-btn {
     width: 30px;
     height: 30px;
     border-radius: 50%;
     border: 1px solid rgba(186,158,106,0.25);
     display: flex;
     align-items: center;
     justify-content: center;
     color: var(--text-muted);
     font-size: 11px;
     text-decoration: none;
     transition: all 0.3s;
}
 .team-li-btn:hover {
     border-color: var(--gold);
     color: var(--gold);
     background: rgba(186,158,106,0.1);
}
/* ===== CLIENTS ===== */
 .clients-strip {
     padding: 68px 60px;
     background: var(--dark);
     border-top: 1px solid rgba(255,255,255,0.04);
     border-bottom: 1px solid rgba(255,255,255,0.04);
}
 .clients-title {
     text-align: center;
     font-size: 10px;
     font-weight: 700;
     letter-spacing: 4px;
     text-transform: uppercase;
     color: var(--text-muted);
     margin-bottom: 40px;
}
 .clients-row {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 52px;
     flex-wrap: wrap;
}
 .client-name {
     font-family: 'Cormorant Garamond', serif;
     font-size: 22px;
     font-weight: 600;
     color: rgba(255,255,255,0.17);
     text-transform: uppercase;
     letter-spacing: 3px;
     transition: color 0.3s;
     cursor: default;
}
 .client-name:hover {
     color: var(--gold);
}
/* ===== TESTIMONIALS ===== */
 .testi-bg {
     background: var(--dark-2);
}
 .testi-viewport {
     overflow: hidden;
}
 .testi-track {
     display: flex;
     gap: 22px;
     transition: transform 0.52s cubic-bezier(0.25,0.46,0.45,0.94);
     will-change: transform;
}
 .testi-card {
     flex: 0 0 calc(33.333% - 15px);
     background: var(--dark-3);
     border: 1px solid rgba(186,158,106,0.1);
     padding: 38px 34px;
     display: flex;
     flex-direction: column;
     gap: 20px;
     position: relative;
     transition: all 0.35s;
}
 .testi-card:hover {
     border-color: rgba(186,158,106,0.38);
     transform: translateY(-4px);
     box-shadow: 0 18px 48px rgba(0,0,0,0.28);
}
 .testi-big-quote {
     position: absolute;
     top: 20px;
     right: 26px;
     font-size: 80px;
     line-height: 1;
     color: rgba(186,158,106,0.09);
     font-family: Georgia, serif;
     pointer-events: none;
     user-select: none;
}
 .testi-stars {
     display: flex;
     gap: 4px;
}
 .testi-stars i {
     color: var(--gold);
     font-size: 12px;
}
 .testi-text {
     font-size: 14px;
     font-weight: 300;
     line-height: 1.9;
     color: var(--text-light);
     font-style: italic;
     flex: 1;
}
 .testi-author {
     display: flex;
     align-items: center;
     gap: 14px;
     padding-top: 20px;
     border-top: 1px solid rgba(186,158,106,0.1);
}
 .testi-avatar {
     width: 50px;
     height: 50px;
     border-radius: 50%;
     overflow: hidden;
     flex-shrink: 0;
     border: 2px solid rgba(186,158,106,0.3);
}
 .testi-avatar img {
     width: 100%;
     height: 100%;
     object-fit: cover;
}
 .testi-author-name {
     font-family: 'Cormorant Garamond', serif;
     font-size: 18px;
     font-weight: 600;
     margin-bottom: 2px;
}
 .testi-author-role {
     font-size: 10px;
     font-weight: 600;
     letter-spacing: 1.5px;
     text-transform: uppercase;
     color: var(--gold);
}
 .testi-summary {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 48px;
     margin-top: 52px;
     padding: 32px 48px;
     background: var(--dark-3);
     border: 1px solid rgba(186,158,106,0.1);
     flex-wrap: wrap;
}
 .tsum-item {
     text-align: center;
}
 .tsum-num {
     font-family: 'Cormorant Garamond', serif;
     font-size: 46px;
     font-weight: 600;
     color: var(--gold);
     line-height: 1;
}
 .tsum-label {
     font-size: 10px;
     font-weight: 600;
     letter-spacing: 2px;
     text-transform: uppercase;
     color: var(--text-muted);
     margin-top: 4px;
}
 .tsum-div {
     width: 1px;
     height: 52px;
     background: rgba(186,158,106,0.15);
}
/* ===== CTA STRIP ===== */
 .cta-strip {
     padding: 80px 60px;
     background: linear-gradient(135deg, var(--dark-2) 0%, var(--dark-3) 100%);
     position: relative;
     overflow: hidden;
     text-align: center;
}
 .cta-strip::before {
     content: '';
     position: absolute;
     top: -200px;
     right: -200px;
     width: 600px;
     height: 600px;
     border-radius: 50%;
     background: radial-gradient(circle, rgba(186,158,106,0.07) 0%, transparent 70%);
}
 .cta-inner {
     position: relative;
     z-index: 1;
     max-width: 680px;
     margin: 0 auto;
}
 .cta-title {
     font-family: 'Cormorant Garamond', serif;
     font-size: clamp(34px, 4.5vw, 58px);
     font-weight: 300;
     line-height: 1.1;
     margin-bottom: 18px;
}
 .cta-title em {
     font-style: italic;
     color: var(--gold);
}
 .cta-text {
     font-size: 15px;
     font-weight: 300;
     line-height: 1.8;
     color: var(--text-light);
     margin-bottom: 36px;
}
/* ===== CONTACT ===== */
 .contact-section {
     background: var(--dark-2);
     padding: 110px 60px;
}
 .contact-grid {
     display: grid;
     grid-template-columns: 1fr 1.4fr;
     gap: 80px;
     align-items: start;
}
 .contact-info-list {
     margin-top: 36px;
     display: flex;
     flex-direction: column;
     gap: 24px;
}
 .contact-info-row {
     display: flex;
     align-items: flex-start;
     gap: 16px;
}
 .ci-icon {
     width: 46px;
     height: 46px;
     border: 1px solid rgba(186,158,106,0.3);
     border-radius: 12px;
     display: flex;
     align-items: center;
     justify-content: center;
     flex-shrink: 0;
}
 .ci-icon i {
     color: var(--gold);
     font-size: 16px;
}
 .ci-label {
     font-size: 9px;
     font-weight: 700;
     letter-spacing: 3px;
     text-transform: uppercase;
     color: var(--gold);
     margin-bottom: 3px;
}
 .ci-val {
     font-size: 14px;
     font-weight: 300;
     color: var(--text-light);
     line-height: 1.6;
}
 .contact-socials {
     display: flex;
     gap: 10px;
     margin-top: 36px;
}
 .cs-btn {
     width: 40px;
     height: 40px;
     border: 1px solid rgba(255,255,255,0.1);
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     color: var(--text-muted);
     text-decoration: none;
     transition: all 0.3s;
}
 .cs-btn:hover {
     border-color: var(--gold);
     color: var(--gold);
     background: rgba(186,158,106,0.08);
}
 .contact-form-wrap {
     background: var(--dark-3);
     border: 1px solid rgba(186,158,106,0.12);
     padding: 44px 40px;
}
 .form-title {
     font-family: 'Cormorant Garamond', serif;
     font-size: 28px;
     font-weight: 600;
     margin-bottom: 6px;
}
 .form-sub {
     font-size: 13px;
     font-weight: 300;
     color: var(--text-muted);
     margin-bottom: 32px;
     line-height: 1.6;
}
 .form-row {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 16px;
}
 .form-group {
     display: flex;
     flex-direction: column;
     gap: 6px;
     margin-bottom: 16px;
}
 .form-group label {
     font-size: 10px;
     font-weight: 700;
     letter-spacing: 2px;
     text-transform: uppercase;
     color: var(--gold);
     display: flex;
     align-items: center;
     gap: 5px;
}
 .form-group input, .form-group select, .form-group textarea {
     background: rgba(0,62,90,0.6);
     border: 1px solid rgba(186,158,106,0.18);
     color: var(--white);
     padding: 12px 15px;
     font-family: 'DM Sans', sans-serif;
     font-size: 14px;
     font-weight: 300;
     outline: none;
     transition: border-color 0.3s;
     width: 100%;
     appearance: none;
}
 .form-group input::placeholder, .form-group textarea::placeholder {
     color: var(--text-muted);
     opacity: 0.7;
}
 .form-group input:focus, .form-group select:focus, .form-group textarea:focus {
     border-color: var(--gold);
     background: rgba(0,62,90,0.9);
}
 .form-group select option {
     background: var(--dark-2);
}
 .form-group textarea {
     resize: vertical;
     min-height: 110px;
}
 .form-submit {
     display: flex;
     align-items: center;
     justify-content: space-between;
     gap: 14px;
     flex-wrap: wrap;
     margin-top: 4px;
}
 .form-note {
     font-size: 12px;
     font-weight: 300;
     color: var(--text-muted);
     display: flex;
     align-items: center;
     gap: 5px;
}
 .form-note i {
     color: var(--gold);
     font-size: 10px;
}
 .form-success {
     display: none;
     text-align: center;
     padding: 28px;
     background: rgba(186,158,106,0.08);
     border: 1px solid rgba(186,158,106,0.3);
}
 .form-success i {
     font-size: 30px;
     color: var(--gold);
     margin-bottom: 10px;
     display: block;
}
/* ===== FOOTER ===== */
 footer {
     background: var(--dark);
     border-top: 1px solid rgba(186,158,106,0.17);
     padding: 68px 60px 34px;
}
 .footer-grid {
     display: grid;
     grid-template-columns: 2fr 1fr 1fr 1fr;
     gap: 52px;
     margin-bottom: 52px;
}
 .footer-brand .logo {
     display: block;
     margin-bottom: 16px;
}
 .footer-brand p {
     font-size: 13px;
     font-weight: 300;
     line-height: 1.8;
     color: var(--text-muted);
     max-width: 260px;
}
 .footer-social {
     display: flex;
     gap: 10px;
     margin-top: 22px;
}
 .social-link {
     width: 38px;
     height: 38px;
     border: 1px solid rgba(255,255,255,0.1);
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     color: var(--text-muted);
     text-decoration: none;
     transition: all 0.3s;
}
 .social-link i {
     font-size: 14px;
}
 .social-link:hover {
     border-color: var(--gold);
     color: var(--gold);
}
 .footer-col h4 {
     font-size: 10px;
     font-weight: 700;
     letter-spacing: 3px;
     text-transform: uppercase;
     margin-bottom: 20px;
}
 .footer-col ul {
     list-style: none;
}
 .footer-col li {
     margin-bottom: 10px;
}
 .footer-col a {
     font-size: 13px;
     font-weight: 300;
     color: var(--text-muted);
     text-decoration: none;
     transition: color 0.3s;
     display: flex;
     align-items: center;
     gap: 7px;
}
 .footer-col a i {
     font-size: 9px;
     color: var(--gold);
     opacity: 0.5;
}
 .footer-col a:hover {
     color: var(--gold);
}
 .footer-col a:hover i {
     opacity: 1;
}
 .footer-contact-item {
     margin-bottom: 13px;
}
 .f-label {
     font-size: 9px;
     font-weight: 700;
     letter-spacing: 2px;
     text-transform: uppercase;
     color: var(--gold);
     display: flex;
     align-items: center;
     gap: 4px;
     margin-bottom: 2px;
}
 .f-val {
     font-size: 13px;
     font-weight: 300;
     color: var(--text-muted);
}
 .footer-bottom {
     padding-top: 32px;
     border-top: 1px solid rgba(255,255,255,0.05);
     display: flex;
     justify-content: space-between;
     align-items: center;
     flex-wrap: wrap;
     gap: 10px;
}
 .footer-copy {
     font-size: 12px;
     font-weight: 300;
     color: var(--text-muted);
}
 .footer-tagline {
     font-family: 'Cormorant Garamond', serif;
     font-size: 14px;
     font-style: italic;
     color: var(--gold);
}
/* ===== ANIMATIONS ===== */
 @keyframes fadeUp {
     from {
         opacity: 0;
         transform: translateY(26px);
    }
     to {
         opacity: 1;
         transform: translateY(0);
    }
}
 .reveal {
     opacity: 0;
     transform: translateY(32px);
     transition: opacity 0.7s ease, transform 0.7s ease;
}
 .reveal.visible {
     opacity: 1;
     transform: translateY(0);
}
/* ===== RESPONSIVE ===== */
/* 1280px and below */
 @media (max-width: 1280px) {
     nav {
         padding: 0 40px;
    }
     .hero {
         padding: 100px 40px 72px;
    }
     .section {
         padding: 90px 40px;
    }
     .contact-section {
         padding: 90px 40px;
    }
     .clients-strip, .cta-strip {
         padding: 64px 40px;
    }
     footer {
         padding: 60px 40px 30px;
    }
     .team-card {
         flex: 0 0 calc(33.333% - 15px);
    }
}
/* 1024px and below — tablet */
 @media (max-width: 1024px) {
     .nav-links, .nav-cta {
         display: none;
    }
     .hamburger {
         display: flex;
    }
    /* Hero */
     .hero {
         grid-template-columns: 1fr;
         padding: 92px 32px 64px;
         text-align: center;
         gap: 32px;
    }
     .hero-label {
         justify-content: center;
    }
     .hero-label::before {
         display: none;
    }
     .hero-content {
         display: flex;
         flex-direction: column;
         align-items: center;
    }
     .hero-desc {
         max-width: 540px;
    }
     .hero-actions {
         justify-content: center;
    }
     .hero-stats {
         justify-content: center;
         gap: 28px;
    }
     .hero-visual {
         order: -1;
    }
    /* About */
     .about-grid {
         grid-template-columns: 1fr;
         gap: 48px;
    }
    /* Services */
     .services-grid {
         grid-template-columns: repeat(2,1fr);
    }
    /* Process — 2 columns on tablet */
     .process-grid {
         grid-template-columns: repeat(2, 1fr);
    }
    /* Hide the snake connectors on tablet — flow is reordered */
     .process-connector--right, .process-connector--down, .process-connector--left {
         display: none;
    }
    /* Team / Testi */
     .team-card {
         flex: 0 0 calc(50% - 11px);
    }
     .testi-card {
         flex: 0 0 calc(50% - 11px);
    }
    /* Contact */
     .contact-grid {
         grid-template-columns: 1fr;
         gap: 48px;
    }
    /* Footer */
     .footer-grid {
         grid-template-columns: 1fr 1fr;
         gap: 36px;
    }
     .section {
         padding: 80px 32px;
    }
     .contact-section {
         padding: 80px 32px;
    }
     .clients-strip, .cta-strip {
         padding: 56px 32px;
    }
     footer {
         padding: 56px 32px 28px;
    }
}
/* 768px and below — mobile */
 @media (max-width: 768px) {
     nav {
         padding: 0 20px;
         height: 64px;
    }
     .mobile-menu {
         top: 64px;
    }
     .hero {
         padding: 86px 20px 56px;
    }
     .stat-num {
         font-size: 36px;
    }
    /* Services */
     .services-grid {
         grid-template-columns: 1fr;
    }
    /* Process — 1 column, simple stacked list */
     .process-grid {
         grid-template-columns: 1fr;
    }
     .process-connector {
         display: none;
    }
     .process-card, .process-card--alt, .process-card--corner, .process-card--last {
         border-left: 3px solid rgba(186,158,106,0.3);
         padding-left: 28px;
    }
     .process-card:hover {
         border-left-color: var(--gold);
    }
    /* Team */
     .team-card {
         flex: 0 0 calc(50% - 11px);
    }
     .team-photo {
         height: 230px;
    }
    /* Testi */
     .testi-card {
         flex: 0 0 100%;
    }
     .testi-summary {
         gap: 24px;
         padding: 28px 24px;
    }
     .tsum-div {
         display: none;
    }
    /* Footer */
     .footer-grid {
         grid-template-columns: 1fr;
         gap: 28px;
    }
     .footer-brand p {
         max-width: 100%;
    }
     .footer-bottom {
         flex-direction: column;
         text-align: center;
    }
     .section {
         padding: 68px 20px;
    }
     .contact-section {
         padding: 68px 20px;
    }
     .clients-strip {
         padding: 48px 20px;
    }
     .cta-strip {
         padding: 60px 20px;
    }
     footer {
         padding: 48px 20px 24px;
    }
     .contact-form-wrap {
         padding: 28px 22px;
    }
     .form-row {
         grid-template-columns: 1fr;
    }
}
/* 480px and below — small mobile */
 @media (max-width: 480px) {
     .hero-title {
         font-size: 38px;
    }
     .hero-actions {
         flex-direction: column;
         width: 100%;
    }
     .btn-primary, .btn-ghost {
         width: 100%;
         justify-content: center;
    }
     .team-card {
         flex: 0 0 80%;
    }
     .testi-card {
         flex: 0 0 100%;
    }
     .form-submit {
         flex-direction: column;
    }
     .form-submit .btn-primary {
         width: 100%;
         justify-content: center;
    }
     .process-subtitle {
         font-size: 13px;
    }
     .process-card {
         padding: 24px 20px 32px;
    }
     .process-card-title {
         font-size: 17px;
    }
}