/* =========================================================
   GeoProcess Consulting — Futuristic Design System
   Shared visual language for every page.
   ========================================================= */
:root{
  --gp-bg:#050b12;
  --gp-bg-2:#081522;
  --gp-panel:rgba(12,28,43,.78);
  --gp-panel-2:#0d2032;
  --gp-ink:#eaf3f8;
  --gp-muted:#8fa5b5;
  --gp-line:rgba(171,211,232,.14);
  --gp-line-strong:rgba(171,211,232,.25);
  --gp-accent:#19b77a;
  --gp-accent-2:#43e49a;
  --gp-cyan:#5fe3ff;
  --gp-green:#54d889;
  --gp-radius:22px;
  --gp-ease:cubic-bezier(.16,1,.3,1);
  --gp-shadow:0 28px 80px rgba(0,0,0,.35);
}

html{background:var(--gp-bg);scroll-padding-top:92px}
body{background-color:var(--gp-bg)!important;background-image:linear-gradient(rgba(95,227,255,.028) 1px,transparent 1px),linear-gradient(90deg,rgba(95,227,255,.028) 1px,transparent 1px),radial-gradient(circle at 50% -20%,rgba(95,227,255,.07),transparent 40%)!important;background-size:72px 72px,72px 72px,100% 100%!important;color:var(--gp-ink)!important;font-family:"Space Grotesk",Inter,system-ui,sans-serif!important;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-2;background-image:linear-gradient(rgba(95,227,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(95,227,255,.035) 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.75),transparent 80%)}
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:50;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.65'/%3E%3C/svg%3E")}

.container{width:min(1240px,calc(100% - 44px))!important}

/* ---------- Global navigation ---------- */
.site-nav{position:sticky!important;top:0!important;z-index:1000!important;background:rgba(4,10,17,.78)!important;border-bottom:1px solid var(--gp-line)!important;backdrop-filter:blur(22px) saturate(145%)!important;box-shadow:0 10px 35px rgba(0,0,0,.2)!important}
.nav-inner{min-height:82px!important}
.brand{gap:0!important;position:relative}
.brand-mark{width:58px!important;height:58px!important;flex:0 0 58px;display:block;overflow:visible;filter:drop-shadow(0 0 12px rgba(95,227,255,.10))}.brand-mark .pulse{transform-box:fill-box;transform-origin:center;animation:radarPulse 3s ease-in-out infinite}.footer-mark{width:46px!important;height:46px!important;flex:0 0 46px;display:block;overflow:visible}
.nav-list{gap:.42rem!important}
.nav-list a{color:#a9bfcd!important;font-size:.78rem!important;font-weight:700!important;letter-spacing:.045em!important;text-transform:uppercase!important;padding:12px 11px!important;border-radius:10px;transition:color .25s var(--gp-ease),background .25s var(--gp-ease),transform .25s var(--gp-ease)!important}
.nav-list a:not(.nav-cta)::after{height:1px!important;bottom:5px!important;background:var(--gp-cyan)!important;box-shadow:0 0 12px rgba(95,227,255,.65)!important}
.nav-list a:hover,.nav-list a.active{color:#fff!important;background:rgba(95,227,255,.055)!important}
.nav-list a:hover{transform:translateY(-1px)}
.nav-cta{background:linear-gradient(135deg,var(--gp-accent),#22a9d6)!important;color:#071019!important;border:1px solid rgba(255,255,255,.12)!important;border-radius:12px!important;padding:12px 15px!important;box-shadow:0 10px 28px rgba(25,183,122,.22)!important}
.nav-cta:hover{background:linear-gradient(135deg,#43e49a,#55d5ff)!important;transform:translateY(-2px)!important}
.nav-toggle{border-color:var(--gp-line-strong)!important;background:rgba(255,255,255,.04)!important}

/* ---------- Universal email dropdown ---------- */
.nav-email{position:relative;list-style:none}
.nav-email>button,.site-email-trigger{border:1px solid var(--gp-line-strong);background:rgba(255,255,255,.035);color:#c9d9e3;border-radius:10px;padding:10px 11px;font:700 .76rem/1 Space Grotesk, sans-serif;letter-spacing:.045em;text-transform:uppercase;cursor:pointer;transition:.25s var(--gp-ease)}
.nav-email>button:hover,.nav-email.open>button{color:#fff;background:rgba(95,227,255,.08);border-color:rgba(95,227,255,.35);box-shadow:0 0 24px rgba(95,227,255,.08)}
.email-menu{position:absolute;right:0;top:calc(100% + 12px);min-width:250px;padding:8px;background:rgba(7,18,28,.96);border:1px solid var(--gp-line-strong);border-radius:16px;box-shadow:var(--gp-shadow);backdrop-filter:blur(18px);opacity:0;visibility:hidden;transform:translateY(-8px) scale(.98);transform-origin:top right;transition:.2s var(--gp-ease);z-index:2000}
.nav-email.open .email-menu,.email-dropdown-wrapper.open .email-menu,.contact-mail-wrap.open .contact-mail-menu{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
.email-menu::before{content:"";display:block;height:2px;margin:0 7px 7px;background:linear-gradient(90deg,var(--gp-accent),var(--gp-cyan));border-radius:2px}
.email-menu a,.contact-mail-menu a{display:flex!important;align-items:center;gap:10px;padding:12px 13px!important;border-radius:10px;color:#c8d8e1!important;font-size:.76rem!important;font-weight:700!important;text-decoration:none!important;background:transparent!important}
.email-menu a:hover,.email-menu a:focus,.contact-mail-menu a:hover,.contact-mail-menu a:focus{color:#fff!important;background:rgba(95,227,255,.08)!important;outline:none}
.email-menu small{display:block;padding:6px 13px 8px;color:#728b9b;font-size:.65rem;letter-spacing:.08em;text-transform:uppercase}

/* ---------- Typography ---------- */
h1,h2,h3,h4,.section-title{font-family:"Space Grotesk",Inter,sans-serif!important;letter-spacing:-.045em!important}
h1{font-weight:800!important}
h1 span,h2 span{color:var(--gp-accent)!important}
.eyebrow,.vintage-kicker,.fancy-kicker,.service-number,.archive-no,.cap-no{font-family:"Space Grotesk",sans-serif!important;letter-spacing:.18em!important}
.lead,.section-subtitle,p{font-family:Inter,system-ui,sans-serif}

/* ---------- Futuristic page atmosphere ---------- */
.hero,.page-hero,.about-hero,.services-hero,.projects-hero,.contact-hero,.vintage-hero,.fancy-hero,.study-hero{position:relative!important;isolation:isolate;overflow:hidden!important;background:#050d16!important;color:#fff!important}
.hero::before,.page-hero::before,.about-hero::before,.services-hero::before,.projects-hero::before,.contact-hero::before,.vintage-hero::before,.fancy-hero::before,.study-hero::before{content:"";position:absolute;inset:-25%;z-index:-1;background:radial-gradient(circle at 18% 25%,rgba(95,227,255,.11),transparent 25%),radial-gradient(circle at 80% 35%,rgba(25,183,122,.10),transparent 25%),linear-gradient(120deg,transparent 40%,rgba(255,255,255,.025) 50%,transparent 60%);animation:gpAtmosphere 16s ease-in-out infinite alternate}
.hero::after,.page-hero::after{background:linear-gradient(90deg,rgba(5,13,22,.98),rgba(5,13,22,.76) 50%,rgba(5,13,22,.42))!important}
@keyframes gpAtmosphere{from{transform:translate3d(-2%,-1%,0) rotate(0deg)}to{transform:translate3d(2%,1%,0) rotate(2deg)}}

.hero-content,.page-hero .container,.about-hero .container,.services-hero .container,.projects-hero .container,.contact-hero .container,.vintage-hero .container,.fancy-hero .container,.study-hero .container{position:relative;z-index:2}

/* Scan line / data beam */
.hero-content::after,.page-hero .container::after,.about-hero .container::after,.services-hero .container::after,.projects-hero .container::after,.contact-hero .container::after{content:"";position:absolute;left:-10%;right:-10%;height:1px;top:36%;background:linear-gradient(90deg,transparent,rgba(95,227,255,.45),transparent);box-shadow:0 0 22px rgba(95,227,255,.28);animation:gpScan 8s linear infinite;pointer-events:none}
@keyframes gpScan{0%{transform:translateY(-220px);opacity:0}15%{opacity:1}85%{opacity:1}100%{transform:translateY(430px);opacity:0}}

/* ---------- Sections / cards ---------- */
.section,.projects-content,.video-archive,.contact-main,.capabilities,.booking-page{background:transparent!important}
.section{position:relative}
.section::before{content:"";position:absolute;top:0;left:50%;width:min(1240px,calc(100% - 44px));height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,var(--gp-line-strong),transparent)}
.card,.service-card-new,.project-card-fancy,.vintage-card,.contact-panel,.enquiry-panel,.booking-info,.booking-card,.cap,.outcome,.workflow,.difference,.case-strip{background:linear-gradient(145deg,rgba(14,32,48,.92),rgba(7,19,30,.94))!important;border:1px solid var(--gp-line)!important;box-shadow:0 18px 60px rgba(0,0,0,.2)!important;color:var(--gp-ink)!important;transition:transform .45s var(--gp-ease),border-color .35s var(--gp-ease),box-shadow .45s var(--gp-ease)!important}
.card:hover,.service-card-new:hover,.project-card-fancy:hover,.vintage-card:hover,.cap:hover,.outcome:hover{transform:translateY(-8px)!important;border-color:rgba(95,227,255,.34)!important;box-shadow:0 28px 75px rgba(0,0,0,.34),0 0 35px rgba(95,227,255,.055)!important}
.card p,.service-card-new p,.project-card-fancy p,.vintage-card p,.cap p,.outcome p,.section-subtitle{color:var(--gp-muted)!important}
.card h3,.service-card-new h3,.project-card-fancy h3,.vintage-card h3,.cap h3,.outcome h3{color:#f1f7fa!important}
.card img,.card video,.service-card-new img,.project-card-fancy img,.vintage-card video{filter:saturate(.9) contrast(1.04)}
.badge,.tag{background:rgba(95,227,255,.07)!important;color:#8deaff!important;border:1px solid rgba(95,227,255,.14)}

/* image edge treatment */
.card img,.service-card-new img,.project-card-fancy img,.vintage-card video{position:relative}
.card,.service-card-new,.project-card-fancy,.vintage-card{overflow:hidden}
.card::after,.service-card-new::after,.project-card-fancy::after,.vintage-card::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,transparent 25%,rgba(255,255,255,.06) 50%,transparent 75%);transform:translateX(-120%);transition:transform .8s var(--gp-ease)}
.card:hover::after,.service-card-new:hover::after,.project-card-fancy:hover::after,.vintage-card:hover::after{transform:translateX(120%)}

/* ---------- Buttons ---------- */
.btn,.study-btn{font-family:"Space Grotesk",sans-serif!important;font-weight:800!important;letter-spacing:.02em;border-radius:12px!important;transition:transform .3s var(--gp-ease),box-shadow .3s var(--gp-ease),border-color .3s var(--gp-ease),background .3s var(--gp-ease)!important}
.btn-primary,.study-btn-primary{background:linear-gradient(135deg,var(--gp-accent),#ff8e5c)!important;color:#071019!important;box-shadow:0 14px 36px rgba(25,183,122,.22)!important}
.btn-primary:hover,.study-btn-primary:hover{transform:translateY(-3px) scale(1.01)!important;box-shadow:0 20px 45px rgba(25,183,122,.3)!important}
.btn-ghost,.study-btn-ghost{background:rgba(255,255,255,.035)!important;color:#dbe8ef!important;border-color:var(--gp-line-strong)!important}
.btn-ghost:hover,.study-btn-ghost:hover{background:rgba(95,227,255,.08)!important;border-color:rgba(95,227,255,.3)!important;transform:translateY(-3px)!important}

/* ---------- Footer ---------- */
.site-footer,.study-footer,.vintage-footer{background:#03080e!important;border-top:1px solid var(--gp-line)!important;color:#c4d3dc!important;position:relative;overflow:hidden}
.site-footer::before,.study-footer::before,.vintage-footer::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,var(--gp-cyan),var(--gp-accent),transparent);opacity:.75}
.footer-title,.study-footer-title{color:#fff!important;font-family:"Space Grotesk",sans-serif!important;letter-spacing:.04em}
.footer-list a{color:#91a8b6!important;transition:color .2s ease}
.footer-list a:hover{color:var(--gp-cyan)!important}
.footer-bottom,.study-footer-bottom{border-top-color:var(--gp-line)!important;color:#637887!important}

/* ---------- Scroll reveal ---------- */
[data-gp-reveal]{opacity:0;transform:translateY(24px);transition:opacity .8s var(--gp-ease),transform .8s var(--gp-ease)}
[data-gp-reveal].gp-visible{opacity:1;transform:none}
[data-gp-reveal]:nth-child(2){transition-delay:.06s}
[data-gp-reveal]:nth-child(3){transition-delay:.12s}
[data-gp-reveal]:nth-child(4){transition-delay:.18s}
[data-gp-reveal]:nth-child(5){transition-delay:.24s}

/* ---------- Back-to-top ---------- */
.back-top,.study-back-top{background:rgba(6,18,28,.85)!important;border:1px solid rgba(95,227,255,.25)!important;color:#fff!important;box-shadow:0 12px 30px rgba(0,0,0,.3)!important;backdrop-filter:blur(14px)}

/* ---------- Study Hub: same brand/header, futuristic content skin ---------- */
.study-page .study-hero{min-height:660px!important}
.study-page .study-brand,.study-page .study-nav-toggle,.study-page .study-nav-list{display:none}
.study-page .study-layout{background:transparent!important}
.study-page .source-book,.study-page .source-page,.study-page .library-controls,.study-page .study-sidebar,.study-page .study-main,.study-page .study-progress,.study-page .chapter-card{background:linear-gradient(145deg,rgba(9,24,37,.92),rgba(4,13,22,.96))!important;border-color:var(--gp-line)!important;color:var(--gp-ink)!important}
.study-page .source-page-body,.study-page .source-text,.study-page .source-page-body p,.study-page .source-page-body li{color:#9fb2bf!important}
.study-page .source-page summary{color:#e8f3f7!important}
.study-page .source-page summary:hover{background:rgba(95,227,255,.055)!important}
.study-page .source-page-body code{background:#02070c!important;color:#8deaff!important}
.study-page .study-btn{min-height:50px}

/* ---------- Forms ---------- */
input,select,textarea{background:rgba(255,255,255,.035)!important;color:#eaf3f8!important;border:1px solid var(--gp-line-strong)!important;border-radius:12px!important}
input::placeholder,textarea::placeholder{color:#657d8d!important}
input:focus,select:focus,textarea:focus{outline:none!important;border-color:rgba(95,227,255,.45)!important;box-shadow:0 0 0 4px rgba(95,227,255,.06),0 0 24px rgba(95,227,255,.06)!important}
select option{background:#0a1724;color:#fff}

/* ---------- Mobile ---------- */
@media(max-width:1100px){
  .nav-list{gap:.15rem!important}
  .nav-list a{padding:10px 8px!important;font-size:.7rem!important}
  .brand-mark{width:52px!important;height:52px!important;flex-basis:52px}
}
@media(max-width:900px){
  .nav-toggle{display:block!important}
  .site-nav nav{position:absolute;left:0;right:0;top:100%;padding:10px 22px 18px;background:rgba(4,10,17,.97);border-bottom:1px solid var(--gp-line);backdrop-filter:blur(20px);transform:translateY(-12px);opacity:0;pointer-events:none;transition:.25s var(--gp-ease)}
  .site-nav nav.open{opacity:1;pointer-events:auto;transform:none}
  .nav-list{display:grid!important;grid-template-columns:1fr 1fr;gap:5px!important}
  .nav-list.open{opacity:1;pointer-events:auto;transform:none}
  .nav-list a{display:block!important}
  .nav-email{grid-column:span 1}
  .email-menu{position:static;margin-top:7px;display:none;transform:none!important}
  .nav-email.open .email-menu{display:block;opacity:1;visibility:visible}
}
@media(max-width:560px){
  .container{width:min(100% - 28px,1240px)!important}
  .brand-mark{width:48px!important;height:48px!important;flex-basis:48px}
  .nav-inner{min-height:72px!important}
  .nav-list{grid-template-columns:1fr!important}
  .nav-email{grid-column:auto}
  .hero,.page-hero,.about-hero,.services-hero,.projects-hero,.contact-hero,.vintage-hero,.fancy-hero,.study-hero{min-height:auto!important}
  .section{padding-top:70px!important;padding-bottom:70px!important}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}
  [data-gp-reveal]{opacity:1!important;transform:none!important}
}

/* ---------- Final shared polish ---------- */
.nav-right{display:flex;align-items:center;gap:12px}
.nav-right nav{display:block}
.nav-email{order:20}
.nav-cta{order:10}

.hero h1,.about-hero h1,.services-hero h1,.projects-hero h1,.contact-hero h1,.vintage-hero h1,.fancy-hero h1,.study-hero h1,.page-hero h1{font-size:clamp(2.9rem,6vw,6.2rem)!important;line-height:.98!important;text-wrap:balance;text-shadow:0 10px 55px rgba(0,0,0,.28)}
.hero h1 span,.about-hero h1 span,.services-hero h1 span,.projects-hero h1 span,.contact-hero h1 span,.study-hero h1 span{background:linear-gradient(90deg,#19b77a,#8de67a 55%,#55d5ff);-webkit-background-clip:text;background-clip:text;color:transparent!important}

.eyebrow{display:inline-flex;align-items:center;gap:9px}
.eyebrow::before{content:"";width:24px;height:1px;background:currentColor;box-shadow:0 0 12px currentColor}

.section-head,.section-intro,.services-intro,.archive-heading,.project-intro{position:relative}
.section-head::after,.section-intro::after,.services-intro::after,.archive-heading::after,.project-intro::after{content:"01 / 0X";position:absolute;right:0;top:0;color:rgba(95,227,255,.24);font:700 .65rem/1 "Space Grotesk",sans-serif;letter-spacing:.16em}

.footer-grid{position:relative;z-index:2}
.footer-intro{max-width:500px!important;color:#78909f!important}
.footer-signal{margin-top:22px;color:#536d7c;font:700 .62rem/1.4 "Space Grotesk",sans-serif;letter-spacing:.13em}
.footer-signal span{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--gp-accent);box-shadow:0 0 16px rgba(25,183,122,.75);margin-right:7px;animation:gpPulse 2.2s ease-in-out infinite}
@keyframes gpPulse{50%{transform:scale(1.55);opacity:.55}}

/* Same email dropdown look when used inside contact sections. */
.contact-mail-wrap{position:relative!important;display:inline-flex!important}
.contact-mail-menu{position:absolute!important;left:0!important;right:auto!important;top:calc(100% + 10px)!important;min-width:250px!important;padding:8px!important;background:rgba(7,18,28,.97)!important;border:1px solid var(--gp-line-strong)!important;border-radius:16px!important;box-shadow:var(--gp-shadow)!important;backdrop-filter:blur(18px)!important;display:block!important;opacity:0;visibility:hidden;transform:translateY(-8px) scale(.98);transform-origin:top left;transition:.2s var(--gp-ease)!important;z-index:3000!important}
.contact-mail-menu::before{content:"";display:block;height:2px;margin:0 7px 7px;background:linear-gradient(90deg,var(--gp-accent),var(--gp-cyan));border-radius:2px}
.contact-mail-wrap.open .contact-mail-menu{display:block!important;opacity:1!important;visibility:visible!important;transform:translateY(0) scale(1)!important}

/* Study Hub local topic rail keeps the study content navigation without creating a second global header. */
.study-local-nav{position:sticky;top:82px;z-index:900;padding:9px 0;background:rgba(5,13,22,.76);border-bottom:1px solid var(--gp-line);backdrop-filter:blur(18px)}
.study-local-nav .container{display:flex;gap:7px;overflow:auto;scrollbar-width:none}
.study-local-nav .container::-webkit-scrollbar{display:none}
.study-local-nav a{flex:0 0 auto;padding:8px 11px;border:1px solid var(--gp-line);border-radius:999px;color:#8fa8b7;font:700 .68rem/1 "Space Grotesk",sans-serif;letter-spacing:.07em;text-transform:uppercase;transition:.25s var(--gp-ease)}
.study-local-nav a:hover{color:#fff;border-color:rgba(95,227,255,.34);background:rgba(95,227,255,.07);transform:translateY(-1px)}

/* Animated data-grid decoration for visual sections without extra images. */
.data-orbit,.project-visual,.contact-signal,.video-orb,.hero-visual{filter:drop-shadow(0 0 25px rgba(95,227,255,.07))}
.data-orbit::after,.project-visual::after,.contact-signal::after,.video-orb::after,.hero-visual::after{content:"";position:absolute;inset:12%;border:1px solid rgba(95,227,255,.12);border-radius:50%;animation:gpOrbit 14s linear infinite}
@keyframes gpOrbit{to{transform:rotate(360deg)}}

@media(max-width:900px){
  .nav-right{gap:8px}
  .nav-right nav{top:100%}
  .study-local-nav{top:72px}
  .section-head::after,.section-intro::after,.services-intro::after,.archive-heading::after,.project-intro::after{display:none}
}
@media(max-width:560px){
  .brand-mark{width:46px!important;height:46px!important;flex-basis:46px}
  .nav-right{gap:6px}
  .study-local-nav{top:72px}
  .study-local-nav a{font-size:.61rem;padding:8px 10px}
}

@keyframes radarPulse{0%,100%{r:5;opacity:1}50%{r:8;opacity:.5}}
