/*
Theme Name: RK Financial Advisors — Kinetic Glass 3D
Theme URI: https://www.vbwebsol.com
Author: VB Web and Software Solution
Author URI: https://www.vbwebsol.com
Description: A completely different visual direction for RK Financial Advisors — dark glassmorphism, a WebGL 3D hero, floating 3D icons, kinetic animated headlines, scroll-reveal motion, and a 3D coverflow gallery of the real RK Financial Advisors office. Same solid backend as the "Elegant Diagonal" theme (Services, Team & Office Gallery post types, native contact form, built-in SEO, one-click setup).
Version: 1.0.8
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: rk-financial
*/

/* ============ DESIGN TOKENS ============ */
:root{
  --bg-deep:#060F17;
  --bg-navy:#0A2739;
  --bg-navy-2:#0F3750;
  --bg-navy-3:#123F5B;
  --glass-bg:rgba(255,255,255,0.055);
  --glass-bg-strong:rgba(255,255,255,0.09);
  --glass-border:rgba(255,255,255,0.12);
  --glass-border-strong:rgba(231,183,126,0.45);
  --tan:#C9925A;
  --tan-bright:#E7B77E;
  --tan-deep:#A9743F;
  --gold-glow:rgba(231,183,126,0.35);
  --ink:#F3F6F8;
  --muted:#B9C6CE;
  --paper:#FBF8F2;
  --paper-ink:#1C2B33;
  --paper-muted:#4B5A63;
  --paper-line:#E7E2D5;
  --radius:20px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:'Inter',sans-serif; color:var(--ink); background:var(--bg-deep);
  line-height:1.65; -webkit-font-smoothing:antialiased; overflow-x:hidden; margin:0;
}
h1,h2,h3,h4{font-family:'Space Grotesk',sans-serif; font-weight:700; margin:0; color:var(--ink); letter-spacing:-0.01em;}
p{margin:0 0 1em;}
a{color:inherit;}
img{max-width:100%; height:auto; display:block;}
ul{list-style:none; margin:0; padding:0;}
.wrap{max-width:1200px; margin:0 auto; padding:0 32px;}
.icon{width:24px; height:24px; stroke:currentColor; fill:none; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round;}
.screen-reader-text{position:absolute !important; left:-9999px;}

/* Kinetic gradient headline text */
.kinetic-text{
  background:linear-gradient(100deg,#fff 0%, var(--tan-bright) 35%, #fff 60%, var(--tan-bright) 85%);
  background-size:220% auto; -webkit-background-clip:text; background-clip:text; color:transparent;
  animation:rk-shine 7s linear infinite;
}
@keyframes rk-shine{ to{ background-position:220% center; } }

/* Scroll-reveal system (see main.js) */
.reveal{opacity:0; transform:translateY(30px); transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1);}
.reveal.in-view{opacity:1; transform:translateY(0);}

/* Floating idle animation for icon badges */
@keyframes rk-float{ 0%,100%{transform:translateY(0) rotate(0deg);} 50%{transform:translateY(-8px) rotate(4deg);} }
.icon-float{animation:rk-float 4.6s ease-in-out infinite;}
.icon-float.d1{animation-delay:.2s;} .icon-float.d2{animation-delay:.6s;} .icon-float.d3{animation-delay:1s;}
.icon-float.d4{animation-delay:1.4s;} .icon-float.d5{animation-delay:1.8s;} .icon-float.d6{animation-delay:2.2s;}

/* Ambient aurora background blobs (used behind hero + CTA bands) */
.aurora{position:absolute; inset:0; overflow:hidden; z-index:0; pointer-events:none;}
.aurora span{position:absolute; border-radius:50%; filter:blur(48px); opacity:.35; animation:rk-drift 16s ease-in-out infinite; will-change:transform;}
.aurora span:nth-child(1){width:420px; height:420px; background:var(--tan); top:-120px; left:-80px; animation-duration:18s;}
.aurora span:nth-child(2){width:360px; height:360px; background:var(--bg-navy-3); bottom:-100px; right:-60px; animation-duration:22s; animation-delay:2s;}
.aurora span:nth-child(3){width:260px; height:260px; background:var(--tan-bright); top:40%; left:60%; animation-duration:20s; animation-delay:4s; opacity:.2;}
@keyframes rk-drift{ 0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(40px,-30px) scale(1.12);} }

/* Glass surface */
.glass{
  background:var(--glass-bg); border:1px solid var(--glass-border);
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  border-radius:var(--radius);
  transition:border-color .25s, box-shadow .25s, transform .25s;
}
.glass:hover{border-color:var(--glass-border-strong); box-shadow:0 22px 50px rgba(0,0,0,0.45), 0 0 0 1px var(--gold-glow) inset;}

/* Buttons */
.btn-gold{
  background:linear-gradient(135deg, var(--tan), var(--tan-bright)); color:var(--bg-deep);
  padding:15px 28px; border-radius:100px; text-decoration:none; font-weight:700; font-size:13.5px;
  display:inline-block; border:none; cursor:pointer; font-family:'Inter',sans-serif;
  box-shadow:0 10px 26px var(--gold-glow); transition:transform .18s, box-shadow .18s;
}
.btn-gold:hover{transform:translateY(-3px); box-shadow:0 16px 34px rgba(231,183,126,0.5);}
.btn-gold:active{transform:translateY(-1px);}
.btn-glass{
  background:var(--glass-bg); border:1.5px solid var(--glass-border); color:var(--ink);
  padding:14px 27px; border-radius:100px; text-decoration:none; font-weight:600; font-size:13.5px; display:inline-block;
  backdrop-filter:blur(12px); transition:border-color .18s, transform .18s, background .18s;
}
.btn-glass:hover{border-color:var(--glass-border-strong); transform:translateY(-3px); background:var(--glass-bg-strong);}
.btn-dark{
  background:var(--bg-navy); color:#fff; padding:14px 27px; border-radius:100px; text-decoration:none;
  font-weight:600; font-size:13.5px; display:inline-block; border:1px solid var(--bg-navy-3); transition:.18s;
}
.btn-dark:hover{background:var(--bg-navy-2); transform:translateY(-3px);}

/* ============ TOP BAR (light, always legible) ============ */
.topbar{background:var(--paper); color:var(--paper-muted); font-size:12.5px; border-bottom:1px solid var(--paper-line);}
.topbar .wrap{display:flex; justify-content:space-between; align-items:center; padding:9px 32px; flex-wrap:wrap; gap:8px;}
.topbar .right{display:flex; align-items:center; gap:18px;}
.topbar a{color:var(--paper-ink); text-decoration:none; font-weight:600;}
.topbar a:hover{color:var(--tan-deep);}
.topbar .social{display:flex; gap:10px;}
.topbar .social a{width:26px; height:26px; border-radius:50%; background:linear-gradient(135deg, var(--tan), var(--tan-deep)); display:flex; align-items:center; justify-content:center; transition:.2s; box-shadow:0 3px 8px rgba(169,116,63,0.35);}
.topbar .social a:hover{transform:translateY(-2px); box-shadow:0 6px 14px rgba(169,116,63,0.5);}
.topbar .social svg{width:13px; height:13px; stroke:#fff; fill:none; stroke-width:2;}
.rk-tagline{font-family:'Fraunces',serif; font-style:italic; font-weight:500; font-size:13.5px; letter-spacing:.01em; color:var(--paper-ink);}

/* ============ NAV (light glass, permanently readable over any hero) ============ */
header.site{position:sticky; top:0; z-index:60; background:rgba(251,248,242,0.92); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); border-bottom:1px solid var(--paper-line); transition:box-shadow .3s, background .3s;}
header.site.scrolled{background:rgba(251,248,242,0.98); box-shadow:0 10px 30px rgba(15,55,80,0.1);}
nav.main-nav{display:flex; align-items:center; justify-content:space-between; padding:14px 32px; max-width:1200px; margin:0 auto;}
.brand{display:flex; align-items:center; gap:14px; text-decoration:none;}

/* Lit logo badge: soft pulsing gold glow + slow-rotating light ring behind
   the icon mark, so the navy logo always has a bright surface to sit on —
   in the header (light bg) it's a flourish; in the footer (dark bg) the
   glow doubles as the contrast fix that makes the navy ink readable. */
.logo-badge{position:relative; width:56px; height:56px; flex-shrink:0; display:flex; align-items:center; justify-content:center;}
.logo-badge .glow{position:absolute; inset:-16px; border-radius:50%; background:radial-gradient(circle, var(--gold-glow) 0%, transparent 72%); filter:blur(7px); animation:rk-logo-pulse 3.2s ease-in-out infinite; pointer-events:none;}
.logo-badge .ring{position:absolute; inset:-11px; border-radius:50%; background:conic-gradient(from 0deg, transparent 0%, var(--tan-bright) 12%, transparent 26%, transparent 74%, var(--tan) 88%, transparent 100%); -webkit-mask:radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 2px)); mask:radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 2px)); animation:rk-ring-spin 7s linear infinite; opacity:.9; pointer-events:none;}
.logo-badge .plate{position:absolute; inset:-5px; border-radius:50%; background:#fff; box-shadow:0 4px 14px rgba(15,55,80,0.18); z-index:0;}
.logo-badge img{position:relative; z-index:1; height:40px; width:auto;}
@keyframes rk-logo-pulse{0%,100%{opacity:.55; transform:scale(1);} 50%{opacity:1; transform:scale(1.12);}}
@keyframes rk-ring-spin{to{transform:rotate(360deg);}}

footer .logo-badge .plate{background:linear-gradient(160deg, #fff, #F1E7D6);}

.brand .btxt strong{display:block; font-family:'Space Grotesk',sans-serif; font-size:16.5px; color:var(--paper-ink); font-weight:700;}
.brand .btxt span{display:block; font-size:10px; color:var(--tan-deep); letter-spacing:.05em; text-transform:uppercase;}
.navlinks{display:flex; gap:6px; list-style:none; align-items:center; margin:0; padding:0;}
.navlinks > li{position:relative;}
.navlinks > li > a{color:var(--paper-ink); text-decoration:none; font-size:13.5px; font-weight:600; padding:10px 15px; display:block; border-radius:100px; transition:.2s;}
.navlinks > li > a:hover, .navlinks > li.current-menu-item > a, .navlinks > li.current_page_item > a, .navlinks > li.current-menu-ancestor > a{color:var(--bg-deep); background:var(--tan-bright);}
.navlinks ul.sub-menu{position:absolute; top:100%; left:0; background:#fff; border:1px solid var(--paper-line); box-shadow:0 20px 40px rgba(15,55,80,0.16); min-width:250px; padding:10px; opacity:0; visibility:hidden; transform:translateY(8px); transition:.2s; margin:0; list-style:none; z-index:40; border-radius:16px;}
.navlinks li:hover > ul.sub-menu{opacity:1; visibility:visible; transform:translateY(0);}
.navlinks ul.sub-menu a{display:block; padding:10px 14px; font-size:13px; color:var(--paper-ink); text-decoration:none; border-radius:10px;}
.navlinks ul.sub-menu a:hover{background:var(--paper); color:var(--tan-deep);}
.navcta{margin-left:8px; white-space:nowrap;}
.nav-right{display:flex; align-items:center;}
.menu-toggle{display:none; background:none; border:none; cursor:pointer; padding:8px;}
.menu-toggle span{display:block; width:24px; height:2px; background:var(--paper-ink); margin:5px 0; border-radius:2px;}

/* ============ HERO ============ */
.hero{position:relative; min-height:100vh; display:flex; align-items:center; overflow:hidden; background:radial-gradient(ellipse at 30% 20%, var(--bg-navy-3) 0%, var(--bg-deep) 65%);}
.hero-3d-stage{position:absolute; inset:0; z-index:1;}
#rk-hero-canvas{position:absolute; inset:0; width:100%; height:100%; display:block;}
.hero .wrap{position:relative; z-index:3; padding-left:22px;}
.hero-inner{max-width:760px; padding:130px 0 100px;}
.hero-copy .eyebrow{display:inline-flex; align-items:center; gap:8px; background:var(--glass-bg); border:1px solid var(--glass-border); padding:9px 18px; border-radius:100px; font-family:'Fraunces',serif; font-style:italic; font-weight:500; font-size:14px; letter-spacing:.01em; text-transform:none; color:var(--tan-bright); margin-bottom:26px; backdrop-filter:blur(10px);}
.hero-copy .eyebrow .dot{width:7px; height:7px; border-radius:50%; background:var(--tan-bright); animation:rk-pulse-dot 1.8s ease-in-out infinite;}
@keyframes rk-pulse-dot{0%,100%{opacity:1; transform:scale(1);} 50%{opacity:.4; transform:scale(1.4);}}
.hero-copy h1{font-size:64px; line-height:1.08; margin-bottom:24px;}
.hero-copy p{color:var(--muted); font-size:18px; max-width:580px; margin-bottom:36px;}
.hero-ctas{display:flex; gap:16px; flex-wrap:wrap; margin-bottom:60px;}
.scroll-cue{display:flex; align-items:center; gap:10px; color:var(--muted); font-size:12px; letter-spacing:.05em; text-transform:uppercase;}
.scroll-cue .chevrons{display:flex; flex-direction:column;}
.scroll-cue .chevrons svg{width:14px; height:14px; stroke:var(--tan-bright); animation:rk-chev 1.6s ease-in-out infinite;}
.scroll-cue .chevrons svg:nth-child(2){animation-delay:.2s;}
@keyframes rk-chev{0%{opacity:0; transform:translateY(-4px);} 40%{opacity:1;} 100%{opacity:0; transform:translateY(6px);}}

/* Trust chip strip overlapping hero bottom edge */
.trust-strip{position:relative; z-index:5; margin-top:-56px; padding-bottom:70px;}
.trust-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px;}
.trust-chip{padding:20px 22px; display:flex; gap:14px; align-items:center;}
.trust-chip .ic{width:42px; height:42px; border-radius:50%; background:linear-gradient(135deg, var(--tan), var(--tan-deep)); display:flex; align-items:center; justify-content:center; flex-shrink:0; color:var(--bg-deep);}
.trust-chip h4{font-size:13.5px; color:#fff; margin-bottom:2px;}
.trust-chip p{font-size:11.8px; color:var(--muted); margin:0;}

/* ============ SECTION GENERIC ============ */
section{padding:100px 0; position:relative;}
.kicker{display:inline-flex; align-items:center; gap:8px; font-size:12.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--tan-bright); margin-bottom:16px;}
.kicker::before{content:""; width:20px; height:1px; background:var(--tan-bright); display:inline-block;}
.section-head{max-width:640px; margin:0 auto 52px; text-align:center;}
.section-head h2{font-size:36px; line-height:1.2;}
.section-head p{margin-top:14px; color:var(--muted); font-size:15.5px;}
.section-head.left{text-align:left; margin-left:0;}

/* Light "paper" section variant, for contrast/readability breaks */
.section-paper{background:var(--paper); color:var(--paper-ink);}
.section-paper .muted, .section-paper p{color:var(--paper-muted);}
.section-paper h1, .section-paper h2, .section-paper h3{color:var(--paper-ink);}
.section-paper .kicker{color:var(--tan-deep);}
.section-paper .kicker::before{background:var(--tan-deep);}
.section-paper .glass{background:#fff; border-color:var(--paper-line); backdrop-filter:none;}
.section-paper .glass:hover{border-color:var(--tan-deep); box-shadow:0 20px 45px rgba(15,55,80,0.12);}
.section-paper .office-nav-btn{background:#fff; border-color:var(--paper-line); color:var(--paper-ink); box-shadow:0 6px 16px rgba(15,55,80,0.1);}
.section-paper .office-nav-btn:hover{background:var(--tan); border-color:var(--tan); color:#fff;}
.section-paper .office-dots button{background:var(--paper-line);}
.section-paper .office-dots button.active{background:var(--tan-deep);}
.section-paper .office-slide{border-color:rgba(15,55,80,0.12); box-shadow:0 30px 60px rgba(15,55,80,0.22);}

/* ============ SERVICES BENTO ============ */
.services-bento{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.svc-card{padding:32px 28px; text-decoration:none; display:block; perspective:900px; position:relative; overflow:hidden;}
.svc-card.big{grid-column:span 2;}
.svc-card .ic-wrap{width:58px; height:58px; border-radius:18px; background:linear-gradient(135deg, rgba(231,183,126,0.18), rgba(201,146,90,0.06)); border:1px solid var(--glass-border-strong); display:flex; align-items:center; justify-content:center; margin-bottom:20px; color:var(--tan-bright);}
.svc-card h3{font-size:19px; margin-bottom:10px; color:#fff;}
.svc-card p{font-size:14px; color:var(--muted); margin-bottom:16px;}
.svc-card .readmore{font-size:12.5px; font-weight:700; color:var(--tan-bright); letter-spacing:.03em; text-transform:uppercase; display:inline-flex; align-items:center; gap:6px;}
.svc-card .readmore svg{width:14px; height:14px; transition:transform .2s;}
.svc-card:hover .readmore svg{transform:translateX(4px);}
.services-more{text-align:center; margin-top:44px;}

/* ============ OFFICE 3D GALLERY ============ */
.office-gallery-wrap{position:relative;}
.office-stage{position:relative; height:520px; perspective:1500px; margin-bottom:34px;}
.office-track{position:relative; width:100%; height:100%; transform-style:preserve-3d;}
.office-slide{
  position:absolute; top:50%; left:50%; width:320px; height:440px; margin:-220px 0 0 -160px;
  border-radius:22px; overflow:hidden; background:var(--bg-navy); border:1px solid var(--glass-border);
  transition:transform .65s cubic-bezier(.2,.7,.2,1), opacity .65s, filter .65s;
  box-shadow:0 30px 60px rgba(0,0,0,0.5);
}
.office-slide img{width:100%; height:100%; object-fit:cover; display:block;}
.office-slide .cap{position:absolute; left:0; right:0; bottom:0; padding:20px; background:linear-gradient(0deg, rgba(6,15,23,0.92), transparent 90%); color:#fff; font-weight:700; font-size:14.5px; font-family:'Space Grotesk',sans-serif;}
.office-controls{display:flex; align-items:center; justify-content:center; gap:22px;}
.office-nav-btn{width:46px; height:46px; border-radius:50%; background:var(--glass-bg); border:1px solid var(--glass-border); color:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:.2s;}
.office-nav-btn:hover{background:var(--tan); border-color:var(--tan); color:var(--bg-deep);}
.office-nav-btn svg{width:20px; height:20px;}
.office-dots{display:flex; gap:9px;}
.office-dots button{width:8px; height:8px; border-radius:50%; background:var(--glass-border); border:none; cursor:pointer; padding:0; transition:.2s;}
.office-dots button.active{background:var(--tan-bright); width:22px; border-radius:6px;}

/* ============ ABOUT SPLIT ============ */
.about-split{display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center;}
.about-art{position:relative; perspective:1000px;}
.about-art .frame{position:relative; border-radius:24px; overflow:hidden; border:1px solid var(--glass-border); box-shadow:0 30px 70px rgba(0,0,0,0.55); transition:transform .3s ease-out;}
.about-art .frame img{width:100%; height:460px; object-fit:cover; display:block;}
.about-art .glow-ring{position:absolute; width:220px; height:220px; border-radius:50%; background:radial-gradient(circle, var(--gold-glow), transparent 70%); top:-60px; right:-60px; z-index:-1; filter:blur(10px);}
.about-copy p{color:var(--muted); font-size:15.5px; margin-bottom:16px;}
.about-stats{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:32px; padding-top:28px; border-top:1px solid var(--glass-border);}
.about-stats .n{font-family:'Space Grotesk',sans-serif; font-size:30px; font-weight:700; display:block; background:linear-gradient(135deg,#fff, var(--tan-bright)); -webkit-background-clip:text; background-clip:text; color:transparent;}
.about-stats .l{font-size:12px; color:var(--muted);}

/* ============ MVV GLASS ROW ============ */
.mvv-grid{display:grid; grid-template-columns:1fr 1fr 1fr; gap:22px;}
.mvv-card{padding:32px 28px; perspective:900px;}
.mvv-card.accent{border-color:var(--glass-border-strong); box-shadow:0 0 0 1px var(--gold-glow) inset, 0 24px 50px rgba(0,0,0,0.4);}
.mvv-card .ic-wrap{width:52px; height:52px; border-radius:16px; background:linear-gradient(135deg, rgba(231,183,126,0.18), rgba(201,146,90,0.05)); border:1px solid var(--glass-border-strong); display:flex; align-items:center; justify-content:center; margin-bottom:18px; color:var(--tan-bright);}
.mvv-card h3{font-family:'Inter',sans-serif; font-size:13.5px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; margin-bottom:12px; color:#fff;}
.mvv-card p, .mvv-card li{font-size:14px; color:var(--muted);}
.mvv-card li{padding-left:18px; position:relative; margin-bottom:6px;}
.mvv-card li::before{content:"—"; position:absolute; left:0; color:var(--tan-bright);}

/* ============ VALUES / WHY-US STRIP ============ */
.value-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px;}
.value-card{padding:28px 24px; perspective:900px;}
.value-card .ic-wrap{width:48px; height:48px; border-radius:14px; background:linear-gradient(135deg, rgba(231,183,126,0.18), rgba(201,146,90,0.05)); border:1px solid var(--glass-border-strong); display:flex; align-items:center; justify-content:center; margin-bottom:16px; color:var(--tan-bright);}
.value-card h3{font-size:16.5px; margin-bottom:8px; color:#fff;}
.value-card p{font-size:13.5px; color:var(--muted); margin:0;}
.section-paper .value-card .ic-wrap, .section-paper .mvv-card .ic-wrap, .section-paper .svc-card .ic-wrap{color:var(--tan-deep);}
.section-paper .value-card h3, .section-paper .mvv-card h3, .section-paper .svc-card h3{color:var(--paper-ink);}
.section-paper .mvv-card p, .section-paper .mvv-card li{color:var(--paper-muted);}
.section-paper .mvv-card li::before{color:var(--tan-deep);}

/* ============ TEAM CARDS (v3 — always-on 3D & motion, identical on touch) ============ */
.team-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
/* Outer wrapper owns the one-time 3D entrance transition; inner card owns
   the continuous float animation — kept on separate elements so the two
   don't fight over the same `transform` property. */
.team-card-wrap{display:block;}
.team-card{
  position:relative; text-align:center; padding:38px 26px 32px; height:100%;
  background:var(--glass-bg); border:1px solid var(--glass-border); backdrop-filter:blur(18px); border-radius:var(--radius);
  animation:rk-card-float 5.5s ease-in-out infinite;
}
.team-card-wrap:nth-child(2) .team-card{animation-delay:.6s;}
.team-card-wrap:nth-child(3) .team-card{animation-delay:1.2s;}
@keyframes rk-card-float{0%,100%{transform:translateY(0);} 50%{transform:translateY(-7px);}}
.team-card .quote-mark{position:absolute; top:18px; right:20px; width:24px; height:24px; color:var(--tan-bright); opacity:.3;}
.team-card .avatar-badge{position:relative; width:108px; height:108px; margin:0 auto 22px; display:flex; align-items:center; justify-content:center;}
.team-card .avatar-badge .glow{position:absolute; inset:-18px; border-radius:50%; background:radial-gradient(circle, var(--gold-glow) 0%, transparent 72%); filter:blur(7px); animation:rk-logo-pulse 3.2s ease-in-out infinite; pointer-events:none;}
.team-card .avatar-badge .ring{position:absolute; inset:-11px; border-radius:50%; background:conic-gradient(from 0deg, transparent 0%, var(--tan-bright) 12%, transparent 26%, transparent 74%, var(--tan) 88%, transparent 100%); -webkit-mask:radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 2px)); mask:radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 2px)); animation:rk-ring-spin 7s linear infinite; pointer-events:none;}
.team-card .avatar-badge .plate{position:absolute; inset:-5px; border-radius:50%; background:#fff; box-shadow:0 12px 26px rgba(0,0,0,0.4); z-index:0;}
.team-card .avatar{position:relative; z-index:1; width:100%; height:100%; border-radius:50%; background:linear-gradient(135deg, var(--tan), var(--tan-deep)); color:var(--bg-deep); display:flex; align-items:center; justify-content:center; font-family:'Space Grotesk',sans-serif; font-size:30px; font-weight:700; overflow:hidden;}
.team-card .avatar img{width:100%; height:100%; object-fit:cover;}
.team-card h3{font-size:18px; color:#fff; margin-bottom:8px;}
.team-card .role-badge{display:inline-block; background:rgba(231,183,126,0.14); border:1px solid var(--glass-border-strong); color:var(--tan-bright); font-size:11px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; padding:6px 16px; border-radius:100px; margin-bottom:18px;}
.team-card .bio{font-size:13.8px; color:var(--muted); padding:0 8px; margin:0;}
.section-paper .team-card h3{color:var(--paper-ink);}
.section-paper .team-card .bio{color:var(--paper-muted);}

/* 3D rotate-in reveal, used only for team cards — a distinct entrance
   animation from the standard fade-and-rise .reveal used elsewhere. */
.reveal-3d{opacity:0; transform:perspective(1000px) rotateY(-35deg) translateZ(-60px); transition:opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1);}
.reveal-3d.in-view{opacity:1; transform:perspective(1000px) rotateY(0deg) translateZ(0);}
@media (prefers-reduced-motion: reduce){
  .team-card{animation:none !important;}
}

/* ============ STATS BAND ============ */
.stats-band{background:linear-gradient(135deg, var(--bg-navy-2), var(--bg-navy)); padding:0;}
.stats-grid{display:grid; grid-template-columns:repeat(4,1fr);}
.stat-cell{text-align:center; padding:46px 20px; border-right:1px solid var(--glass-border);}
.stat-cell:last-child{border-right:none;}
.stat-cell .n{font-family:'Space Grotesk',sans-serif; font-size:34px; font-weight:700; display:block; margin-bottom:6px; background:linear-gradient(135deg,#fff, var(--tan-bright)); -webkit-background-clip:text; background-clip:text; color:transparent;}
.stat-cell .l{color:var(--muted); font-size:12px; letter-spacing:.02em;}

/* ============ CTA BAND ============ */
.cta-band{position:relative; overflow:hidden; text-align:center; padding:90px 0;}
.cta-band h2{font-size:32px; margin-bottom:14px; color:#fff;}
.cta-band p{color:var(--muted); font-size:15.5px; margin-bottom:32px;}

/* ============ PAGE HERO (inner pages) w/ CSS-only rotating 3D shape ============ */
.page-hero{position:relative; background:radial-gradient(ellipse at 75% 20%, var(--bg-navy-3), var(--bg-deep) 65%); padding:120px 0 76px; overflow:hidden;}
.shape-3d{position:absolute; right:8%; top:50%; width:150px; height:150px; transform-style:preserve-3d; animation:rk-rotate3d 14s linear infinite; opacity:.85;}
@keyframes rk-rotate3d{ from{transform:translateY(-50%) rotateX(0) rotateY(0);} to{transform:translateY(-50%) rotateX(360deg) rotateY(360deg);} }
.shape-3d .face{position:absolute; width:150px; height:150px; border:1px solid var(--glass-border-strong); background:linear-gradient(135deg, rgba(231,183,126,0.14), rgba(15,55,80,0.3)); backdrop-filter:blur(4px);}
.shape-3d .f1{transform:translateZ(75px);} .shape-3d .f2{transform:rotateY(180deg) translateZ(75px);}
.shape-3d .f3{transform:rotateY(90deg) translateZ(75px);} .shape-3d .f4{transform:rotateY(-90deg) translateZ(75px);}
.shape-3d .f5{transform:rotateX(90deg) translateZ(75px);} .shape-3d .f6{transform:rotateX(-90deg) translateZ(75px);}
.page-hero .wrap{position:relative; z-index:2;}
.page-hero h1{font-size:40px; color:#fff;}
.breadcrumb{margin-top:16px; font-size:13px; color:var(--muted); display:flex; gap:8px; align-items:center;}
.breadcrumb a{color:var(--muted); text-decoration:none;}
.breadcrumb a:hover{color:var(--tan-bright);}

/* ============ SERVICE SINGLE ============ */
.service-single-grid{display:grid; grid-template-columns:2fr 1fr; gap:56px; align-items:start;}
.service-content h2{font-size:24px; margin:34px 0 14px; color:#fff;}
.service-content p{color:var(--muted); font-size:15.5px; margin-bottom:16px;}
.service-content ul{margin:0 0 20px;}
.service-content ul li{position:relative; padding-left:26px; margin-bottom:10px; color:var(--muted); font-size:15px;}
.service-content ul li::before{content:""; position:absolute; left:0; top:8px; width:9px; height:9px; background:var(--tan-bright); border-radius:2px;}
.service-sidebar{padding:30px;}
.service-sidebar h3{font-size:14px; text-transform:uppercase; letter-spacing:.05em; margin-bottom:16px; padding-bottom:14px; border-bottom:1px solid var(--glass-border); color:#fff;}
.service-sidebar ul li{margin-bottom:4px;}
.service-sidebar ul li a{display:block; padding:11px 14px; text-decoration:none; color:var(--muted); font-size:13.8px; font-weight:600; border-left:2px solid transparent; border-radius:8px; transition:.2s;}
.service-sidebar ul li a:hover, .service-sidebar ul li.current a{border-color:var(--tan-bright); color:#fff; background:var(--glass-bg-strong);}
.service-cta{margin-top:24px; padding:26px; text-align:center; background:linear-gradient(160deg, var(--bg-navy-2), var(--bg-navy)); border-radius:16px; border:1px solid var(--glass-border);}
.service-cta p{color:var(--muted); font-size:13.5px; margin-bottom:14px;}
.service-icon-badge{width:66px; height:66px; border-radius:20px; background:linear-gradient(135deg, rgba(231,183,126,0.18), rgba(201,146,90,0.06)); border:1px solid var(--glass-border-strong); display:flex; align-items:center; justify-content:center; margin-bottom:24px; color:var(--tan-bright);}

/* ============ CONTACT ============ */
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:start;}
.contact-card{padding:18px 22px; display:flex; gap:14px; align-items:flex-start; margin-bottom:14px;}
.contact-card .ic{width:40px; height:40px; border-radius:12px; background:linear-gradient(135deg, rgba(231,183,126,0.18), rgba(201,146,90,0.06)); border:1px solid var(--glass-border-strong); display:flex; align-items:center; justify-content:center; flex-shrink:0; color:var(--tan-bright);}
.contact-card h4{font-size:13.5px; margin-bottom:4px; text-transform:uppercase; letter-spacing:.03em; color:#fff;}
.contact-card p, .contact-card a{font-size:13.8px; color:var(--muted); text-decoration:none; display:block;}
.contact-card a:hover{color:var(--tan-bright);}
.emails-list{display:flex; flex-wrap:wrap; gap:6px 0; flex-direction:column;}
.map-wrap{margin-top:26px; border:1px solid var(--glass-border); border-radius:var(--radius); position:relative; padding-top:56%; overflow:hidden;}
.map-wrap iframe{position:absolute; top:0; left:0; width:100%; height:100%; border:0; filter:grayscale(0.3) invert(0.92) contrast(0.9);}

.contact-form{padding:36px;}
.contact-form h3{font-size:21px; margin-bottom:6px; color:#fff;}
.contact-form .sub{color:var(--muted); font-size:13.5px; margin-bottom:22px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px;}
.form-field{margin-bottom:16px;}
.form-field label{display:block; font-size:12.5px; font-weight:600; margin-bottom:6px; color:var(--ink);}
.form-field input, .form-field select, .form-field textarea{
  width:100%; border:1px solid var(--glass-border); background:rgba(255,255,255,0.04); border-radius:10px;
  padding:12px 14px; font-family:'Inter',sans-serif; font-size:14px; color:var(--ink);
}
.form-field input:focus, .form-field textarea:focus, .form-field select:focus{outline:none; border-color:var(--tan-bright); box-shadow:0 0 0 3px var(--gold-glow);}
.form-field select option{background:var(--bg-navy); color:#fff;}
.form-msg{padding:14px 16px; margin-bottom:18px; font-size:13.8px; border-radius:10px;}
.form-msg.success{background:rgba(60,160,90,0.15); color:#8FE0A8; border:1px solid rgba(60,160,90,0.35);}
.form-msg.error{background:rgba(200,70,70,0.15); color:#F2A3A3; border:1px solid rgba(200,70,70,0.35);}
.hp-field{position:absolute; left:-9999px;}

/* ============ HOMEPAGE "VISIT US" ADDRESS CARD ============ */
#visit-us{padding-top:0; padding-bottom:90px;}
.visit-card{display:flex; align-items:center; gap:22px; padding:28px 32px; text-decoration:none; flex-wrap:wrap;}
.visit-ic{width:54px; height:54px; border-radius:16px; background:linear-gradient(135deg, rgba(231,183,126,0.18), rgba(201,146,90,0.06)); border:1px solid var(--glass-border-strong); display:flex; align-items:center; justify-content:center; flex-shrink:0; color:var(--tan-bright);}
.visit-text{flex:1; min-width:220px;}
.visit-text h3{font-size:17px; color:#fff; margin-bottom:4px;}
.visit-text p{color:var(--muted); font-size:13.8px; margin:0;}
.visit-arrow{display:inline-flex; align-items:center; gap:8px; font-size:12.5px; font-weight:700; color:var(--tan-bright); letter-spacing:.03em; text-transform:uppercase; white-space:nowrap;}
.visit-arrow svg{width:16px; height:16px; transition:transform .2s;}
.visit-card:hover .visit-arrow svg{transform:translateX(4px);}

/* ============ DOWNLOAD / BROCHURE VIEWER ============ */
.brochure-panel{background:var(--glass-bg); border:1px solid var(--glass-border); backdrop-filter:blur(18px); border-radius:var(--radius); overflow:hidden;}
.brochure-viewer{position:relative; padding-top:120%; background:var(--bg-deep);}
.brochure-viewer iframe{position:absolute; inset:0; width:100%; height:100%; border:0;}
@media (min-width:640px){ .brochure-viewer{padding-top:64%;} }
.brochure-download-cta{text-align:center; margin-top:28px;}
.brochure-download-cta .btn-gold{display:inline-flex; align-items:center; gap:10px;}
.brochure-download-cta .icon{width:18px; height:18px;}

/* ============ FOOTER ============ */
footer.site-footer{background:var(--bg-navy); position:relative; border-top:1px solid var(--glass-border);}
footer.site-footer::before{content:""; position:absolute; top:0; left:0; right:0; height:2px; background:linear-gradient(90deg, transparent, var(--tan-bright), transparent); background-size:200% auto; animation:rk-shine 6s linear infinite;}
.foot-inner{padding:56px 0 0;}
.foot-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px; padding-bottom:32px; border-bottom:1px solid var(--glass-border);}
.foot-brand{display:flex; gap:14px; align-items:center; margin-bottom:12px; text-decoration:none;}
.foot-brand strong{font-family:'Space Grotesk',sans-serif; font-size:16px; color:#fff;}
footer p, footer a{color:var(--muted); font-size:13.5px; font-family:'Inter',sans-serif; font-weight:500; line-height:1.6;}
footer h4{color:#fff; font-size:12.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; margin-bottom:16px;}
.foot-links, .foot-contact{text-align:left;}
.foot-links li{margin-bottom:11px;}
.foot-links a{text-decoration:none; display:inline-block;}
.foot-links a:hover{color:var(--tan-bright);}
.foot-contact div{margin-bottom:13px; display:flex; gap:9px; align-items:flex-start; text-align:left;}
.foot-contact a, .foot-contact span{font-size:13.5px; font-family:'Inter',sans-serif; font-weight:500; line-height:1.6; color:var(--muted);}
.foot-contact .icon{width:16px; height:16px; color:var(--tan-bright); flex-shrink:0; margin-top:2px;}
.social-row{display:flex; gap:10px; margin-top:18px;}
.social-row a{width:34px; height:34px; border-radius:50%; background:var(--glass-bg); border:1px solid var(--glass-border); display:flex; align-items:center; justify-content:center; transition:.2s;}
.social-row a:hover{background:var(--tan); border-color:var(--tan); transform:translateY(-3px); box-shadow:0 8px 18px var(--gold-glow);}
.social-row a svg{width:15px; height:15px; stroke:#fff; fill:none; stroke-width:1.8;}
.copyright{text-align:center; padding:20px 0; color:var(--muted); font-size:12.5px; font-family:'Inter',sans-serif; font-weight:500;}
.copyright a{color:var(--tan-bright); text-decoration:none; font-weight:600;}
.copyright a:hover{text-decoration:underline;}

/* ============ WHATSAPP FLOAT ============ */
.wa-float{position:fixed; bottom:24px; right:24px; z-index:999; width:58px; height:58px; border-radius:50%; background:#25D366; display:flex; align-items:center; justify-content:center; box-shadow:0 8px 22px rgba(0,0,0,0.35); text-decoration:none; animation:wa-pulse 2.4s infinite;}
.wa-float svg{width:30px; height:30px; fill:#fff;}
@keyframes wa-pulse{0%{box-shadow:0 0 0 0 rgba(37,211,102,0.55);} 70%{box-shadow:0 0 0 14px rgba(37,211,102,0);} 100%{box-shadow:0 0 0 0 rgba(37,211,102,0);}}

/* ============ 404 / generic ============ */
.error-404{text-align:center; padding:140px 0;}
.error-404 h1{font-size:100px; margin-bottom:10px;}
.error-404 p{color:var(--muted); margin-bottom:26px;}
.generic-content{max-width:820px; margin:0 auto;}
.generic-content h1{font-size:34px; margin-bottom:20px; color:#fff;}
.generic-content p{color:var(--muted); font-size:15.5px;}

/* ============ RESPONSIVE ============ */
@media (max-width:1000px){
  .navlinks{position:fixed; top:0; left:-100%; width:82%; max-width:340px; height:100vh; background:rgba(6,15,23,0.98); backdrop-filter:blur(20px); flex-direction:column; align-items:flex-start; padding:90px 26px 26px; box-shadow:0 0 40px rgba(0,0,0,0.5); transition:.3s; overflow-y:auto;}
  .navlinks.open{left:0;}
  .navlinks > li{width:100%;}
  .navlinks > li > a{width:100%; color:var(--ink);}
  .navlinks > li > a:hover, .navlinks > li.current-menu-item > a, .navlinks > li.current_page_item > a{color:var(--bg-deep);}
  .navlinks ul.sub-menu{position:static; opacity:1; visibility:visible; transform:none; box-shadow:none; border:none; padding-left:14px; display:none; background:transparent;}
  .navlinks li.menu-open > ul.sub-menu{display:block;}
  .navlinks ul.sub-menu a{color:var(--muted);}
  .navlinks ul.sub-menu a:hover{color:var(--tan-bright); background:transparent;}
  .menu-toggle{display:block; position:relative; z-index:70;}
  .navcta{display:none;}
  .hero-copy h1{font-size:36px;}
  .services-bento, .trust-grid, .about-split, .mvv-grid, .value-grid, .team-grid, .stats-grid, .contact-grid, .service-single-grid, .form-row, .foot-grid{grid-template-columns:1fr !important;}
  .svc-card.big{grid-column:span 1;}
  .stat-cell{border-right:none !important; border-bottom:1px solid var(--glass-border);}
  .office-stage{height:420px;}
  .office-slide{width:250px; height:340px; margin:-170px 0 0 -125px;}
  .shape-3d{display:none;}
}

/* ============ REDUCED MOTION ============ */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important;}
  .reveal{opacity:1 !important; transform:none !important;}
}
