/* ── Google Fonts ─────────────────────────── */

@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@200;400;700&family=Oswald:wght@400;500;600&family=Roboto:wght@400;500&display=swap");



@import url('forms.css');









/* ── Design Tokens (exact from globals.css) ── */

:root {

  --background: #ffffff;

  --foreground: #111111;

  --primary: #39ff14;

  --primary-foreground: #111111;

  --muted: #f5f5f5;

  --muted-foreground: #666666;

  --border: #e5e5e5;

  --ring: #39ff14;

}



/* ── Reset ───────────────────────────────── */

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

html{scroll-behavior:smooth;font-family:'Roboto',system-ui,sans-serif}

body{background:var(--background);color:var(--foreground);line-height:1.6;-webkit-font-smoothing:antialiased}

a{text-decoration:none;color:inherit}

img{display:block;max-width:100%}

button,input,textarea{font-family:inherit}

ul{list-style:none}



/* ── Layout ──────────────────────────────── */

.container{max-width:1280px;margin:0 auto;padding:0 1.5rem}

@media(min-width:1024px){.container{padding:0 2rem}}



/* ── Typography helpers ──────────────────── */

.font-heading{font-family:'Poppins',system-ui,sans-serif}

.font-oswald{font-family:'Oswald',system-ui,sans-serif}



.eyebrow{

  font-family:'Oswald',sans-serif;

  font-size:.75rem;text-transform:uppercase;

  letter-spacing:.3em;color:var(--primary);

  display:block;margin-bottom:1rem

}



/* ── Buttons ─────────────────────────────── */

.btn-primary{

  display:inline-flex;align-items:center;gap:.5rem;

  background:var(--primary);color:var(--primary-foreground);

  font-family:'Oswald',sans-serif;font-size:.75rem;

  text-transform:uppercase;letter-spacing:.15em;

  padding:.75rem 1.5rem;border:none;cursor:pointer;

  transition:opacity .2s

}

.btn-primary:hover{opacity:.9}

.btn-outline{

  display:inline-flex;align-items:center;gap:.5rem;

  background:transparent;color:var(--foreground);

  font-family:'Oswald',sans-serif;font-size:.75rem;

  text-transform:uppercase;letter-spacing:.15em;

  padding:.75rem 2rem;border:1px solid var(--border);cursor:pointer;

  transition:border-color .2s,color .2s

}

.btn-outline:hover{border-color:var(--primary);color:var(--primary)}



/* ── Arrow icon ───────────────────────────── */

.ic{display:inline-block;width:1rem;height:1rem;flex-shrink:0;vertical-align:middle;transition:transform .2s}

.ic-lg{width:1.5rem;height:1.5rem}

a:hover .ic,button:hover .ic,.btn-primary:hover .ic,.btn-outline:hover .ic{transform:translate(2px,-2px)}



/* ── Header ──────────────────────────────── */

#hdr{

  position:fixed;top:0;left:0;right:0;z-index:50;

  background:rgba(255,255,255,.8);

  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);

  border-bottom:1px solid var(--border)

}

.hdr-inner{display:flex;align-items:center;justify-content:space-between;height:5rem}

.logo{font-family:'Poppins',sans-serif;font-weight:700;font-size:1.5rem;letter-spacing:-.02em;color:var(--foreground)}

.logo span{color:var(--primary)}

.nav-d{display:none;align-items:center;gap:3rem}

@media(min-width:768px){.nav-d{display:flex}}

.nl{font-family:'Oswald',sans-serif;font-size:.75rem;text-transform:uppercase;letter-spacing:.15em;color:var(--muted-foreground);transition:color .2s}

.nl:hover,.nl.active{color:var(--primary)}

.cta-d{display:none}

@media(min-width:768px){.cta-d{display:block}}

.mb-btn{display:flex;background:none;border:none;cursor:pointer;color:var(--foreground)}

@media(min-width:768px){.mb-btn{display:none}}

.mb-nav{display:none;flex-direction:column;gap:1.5rem;padding:2rem 0;border-top:1px solid var(--border)}

.mb-nav.open{display:flex}

.mb-nav .nl{font-size:1.125rem}

.mb-nav .btn-primary{justify-content:center;margin-top:1rem}



/* ── Hero ────────────────────────────────── */

#hero{min-height:100vh;display:flex;align-items:center;justify-content:center;padding-top:5rem;position:relative;overflow:hidden}

.hero-orb{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:800px;height:800px;background:rgba(57,255,20,.05);border-radius:50%;filter:blur(60px);pointer-events:none}

.hero-inner{position:relative;z-index:1;padding:6rem 0;max-width:900px}

h1.hero-h{

  font-family:'Poppins',sans-serif;font-weight:200;

  font-size:clamp(2.5rem,8vw,6rem);line-height:.95;

  letter-spacing:-.02em;margin-bottom:2rem

}

h1.hero-h strong{font-weight:700;color:var(--primary)}

h1.hero-h .bld{font-weight:700}

.hero-sub{font-size:1.125rem;color:var(--muted-foreground);max-width:42rem;margin-bottom:3rem;line-height:1.7}

.hero-ctas{display:flex;flex-direction:column;gap:1rem}

@media(min-width:640px){.hero-ctas{flex-direction:row}}

.hero-ctas a{padding:1rem 2rem;justify-content:center}

.scroll-ind{position:absolute;bottom:3rem;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:.75rem}

.scroll-lbl{font-family:'Oswald',sans-serif;font-size:.7rem;text-transform:uppercase;letter-spacing:.2em;color:var(--muted-foreground)}

.scroll-ln{width:1px;height:3rem;background:linear-gradient(to bottom,var(--primary),transparent)}



/* ── Sections ────────────────────────────── */

section{padding:0.5rem 0}

h2.stitle{font-family:'Poppins',sans-serif;font-weight:200;font-size:clamp(2rem,5vw,4rem);line-height:1.05;letter-spacing:-.02em;margin-bottom:2rem}

h2.stitle strong{font-weight:700}



/* ── Work grid ───────────────────────────── */

.work-hdr{display:flex;flex-direction:column;gap:2rem;margin-bottom:4rem}

@media(min-width:768px){.work-hdr{flex-direction:row;align-items:flex-end;justify-content:space-between}}

.va-link{font-family:'Oswald',sans-serif;font-size:.75rem;text-transform:uppercase;letter-spacing:.15em;color:var(--muted-foreground);display:inline-flex;align-items:center;gap:.5rem;transition:color .2s;white-space:nowrap}

.va-link:hover{color:var(--primary)}

.pgrid{display:grid;gap:2rem}

@media(min-width:768px){.pgrid{grid-template-columns:1fr 1fr}}

.pcard{display:block}

.pimg-wrap{position:relative;aspect-ratio:4/3;overflow:hidden;margin-bottom:1.5rem;background:var(--muted)}

.pimg-wrap img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;display:block}

.pcard:hover .pimg-wrap img{transform:scale(1.05)}

.poverlay{position:absolute;inset:0;background:rgba(17,17,17,0);display:flex;align-items:center;justify-content:center;transition:background .3s}

.pcard:hover .poverlay{background:rgba(17,17,17,.6)}

.olbl{opacity:0;display:flex;align-items:center;gap:.5rem;color:#fff;font-family:'Oswald',sans-serif;font-size:.75rem;text-transform:uppercase;letter-spacing:.15em;transition:opacity .3s}

.pcard:hover .olbl{opacity:1}

.pinfo{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}

.pinfo h3{font-family:'Poppins',sans-serif;font-weight:700;font-size:1.25rem;color:var(--foreground);margin-bottom:.5rem;transition:color .2s}

.pcard:hover .pinfo h3{color:var(--primary)}

.pinfo .cat{font-size:.875rem;color:var(--muted-foreground)}

.pyr{font-family:'Oswald',sans-serif;font-size:.875rem;color:var(--muted-foreground);white-space:nowrap}



/* ── Services cards ───────────────────────── */

.sec-intro{max-width:48rem;margin-bottom:5rem}

.sec-intro p{font-size:1.125rem;color:var(--muted-foreground);line-height:1.7;margin-top:1.5rem}

.sgrid{display:grid;gap:2rem}

@media(min-width:768px){.sgrid{grid-template-columns:1fr 1fr}}

@media(min-width:1024px){.sgrid-3{grid-template-columns:repeat(3,1fr)}}

.scard{padding:2rem 2.5rem;border:1px solid var(--border);transition:border-color .2s}

.scard:hover{border-color:var(--primary)}

.scard-top{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:1.5rem}

.snum{font-family:'Poppins',sans-serif;font-weight:700;font-size:3.5rem;color:rgba(17,17,17,.12);line-height:1;transition:color .2s}

.scard:hover .snum{color:rgba(57,255,20,.3)}

.scard h3{font-family:'Poppins',sans-serif;font-weight:700;font-size:1.5rem;margin-bottom:1rem;transition:color .2s}

.scard:hover h3{color:var(--primary)}

.scard p{color:var(--muted-foreground);line-height:1.7}

.sarrow{color:var(--muted-foreground);transition:color .2s;width:1.5rem;height:1.5rem;display:inline-block}

.scard:hover .sarrow{color:var(--primary)}



/* ── About ───────────────────────────────── */

.agrid{display:grid;gap:4rem}

@media(min-width:1024px){.agrid{grid-template-columns:1fr 1fr;gap:6rem}}

.atext p{font-size:1.125rem;color:var(--muted-foreground);line-height:1.7;margin-bottom:1.5rem}

.statgrid{display:grid;grid-template-columns:1fr 1fr;gap:2rem 3rem;align-content:center}

.statval{font-family:'Poppins',sans-serif;font-weight:700;font-size:3.5rem;color:var(--primary);line-height:1;margin-bottom:.5rem}

.statlbl{font-family:'Oswald',sans-serif;font-size:.75rem;text-transform:uppercase;letter-spacing:.15em;color:var(--muted-foreground)}



/* ── Contact form ────────────────────────── */

.cgrid{display:grid;gap:4rem}

@media(min-width:1024px){.cgrid{grid-template-columns:1fr 1fr;gap:6rem}}

.ci{margin-top:3rem;display:flex;flex-direction:column;gap:1.5rem}

.ci-lbl{font-family:'Oswald',sans-serif;font-size:.7rem;text-transform:uppercase;letter-spacing:.2em;color:var(--muted-foreground);display:block;margin-bottom:.5rem}

.ci a,.ci p{font-size:1.125rem;transition:color .2s}

.ci a:hover{color:var(--primary)}

.frow{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-bottom:1.5rem}

.fg{margin-bottom:1.5rem}

.fg label{font-family:'Oswald',sans-serif;font-size:.7rem;text-transform:uppercase;letter-spacing:.2em;color:var(--muted-foreground);display:block;margin-bottom:.75rem}

.fg input,.fg textarea{width:100%;background:transparent;border:none;border-bottom:1px solid var(--border);padding:.75rem 0;color:var(--foreground);font-size:1rem;outline:none;transition:border-color .2s}

.fg input:focus,.fg textarea:focus{border-bottom-color:var(--primary)}

.fg textarea{resize:none;height:6rem}

.fg input::placeholder,.fg textarea::placeholder{color:var(--muted-foreground)}

.fsubmit{width:100%;display:flex;align-items:center;justify-content:center;gap:.75rem;background:var(--primary);color:var(--primary-foreground);font-family:'Oswald',sans-serif;font-size:.75rem;text-transform:uppercase;letter-spacing:.15em;padding:1rem 2rem;border:none;cursor:pointer;margin-top:2rem;transition:opacity .2s}

.fsubmit:hover{opacity:.9}



/* ── Footer ──────────────────────────────── */

#ftr{background:#1a1a1a;color:#f9f9f9;padding:4rem 0 0}

.fgrid{display:grid;gap:3rem;margin-bottom:4rem}

@media(min-width:768px){.fgrid{grid-template-columns:2fr 1fr 1fr}}

.fbrand .logo{color:#f9f9f9;display:inline-block;margin-bottom:1.5rem}

.fbrand p{color:#888;max-width:24rem;line-height:1.7}

.fcol h4{font-family:'Oswald',sans-serif;font-size:.7rem;text-transform:uppercase;letter-spacing:.2em;color:#888;margin-bottom:1.5rem}

.fcol nav{display:flex;flex-direction:column;gap:1rem}

.fcol a{color:#f9f9f9;font-size:1rem;transition:color .2s;display:inline-flex;align-items:center;gap:.4rem}

.fcol a:hover{color:var(--primary)}

.fbtm{display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:1rem;padding:2rem 0;border-top:1px solid #333}

@media(min-width:768px){.fbtm{flex-direction:row}}

.fbtm p{font-size:.875rem;color:#888}

.flinks{display:flex;gap:2rem}

.flinks a{font-size:.875rem;color:#888;transition:color .2s}

.flinks a:hover{color:var(--primary)}



/* ── Page-specific: Work list page ──────── */

.page-top{padding-top:5rem}

.page-hero{padding:8rem 0 4rem;background:var(--muted)}

.page-hero h1{font-family:'Poppins',sans-serif;font-weight:200;font-size:clamp(2rem,6vw,4.5rem);line-height:1;letter-spacing:-.02em;margin-bottom:1.5rem}

.page-hero h1 strong{font-weight:700}

.page-hero p{font-size:1.125rem;color:var(--muted-foreground);max-width:40rem;line-height:1.7}



/* Filters */

.filters{display:flex;flex-wrap:wrap;gap:.75rem;margin-bottom:3rem}

.filter-btn{font-family:'Oswald',sans-serif;font-size:.7rem;text-transform:uppercase;letter-spacing:.15em;padding:.5rem 1.25rem;border:1px solid var(--border);background:transparent;cursor:pointer;transition:all .2s;color:var(--muted-foreground)}

.filter-btn:hover,.filter-btn.active{background:var(--primary);color:var(--primary-foreground);border-color:var(--primary)}



/* Project detail */

.pdetail-meta{display:flex;flex-wrap:wrap;gap:2rem;margin-bottom:3rem;padding:2rem 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}

.pdetail-meta div span:first-child{font-family:'Oswald',sans-serif;font-size:.7rem;text-transform:uppercase;letter-spacing:.15em;color:var(--muted-foreground);display:block;margin-bottom:.4rem}

.pdetail-meta div span:last-child{font-size:1rem;font-weight:500}

.pdetail-img{aspect-ratio:16/9;width:100%;object-fit:cover;margin-bottom:3rem;display:block}

.pdetail-body{max-width:760px}

.pdetail-body p{font-size:1.125rem;color:var(--muted-foreground);line-height:1.8;margin-bottom:1.5rem}

.pdetail-gallery{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:3rem 0}

@media(min-width:768px){.pdetail-gallery{grid-template-columns:1fr 1fr 1fr}}

.pdetail-gallery img{aspect-ratio:4/3;width:100%;object-fit:cover}



/* Services page */

.svc-intro-grid{display:grid;gap:4rem;margin-bottom:5rem}

@media(min-width:1024px){.svc-intro-grid{grid-template-columns:1fr 1fr;align-items:center}}

.process-grid{display:grid;gap:2rem;margin-top:3rem}

@media(min-width:768px){.process-grid{grid-template-columns:repeat(4,1fr)}}

.process-step{padding:2rem;border:1px solid var(--border);position:relative}

.process-step:hover{border-color:var(--primary)}

.step-num{font-family:'Poppins',sans-serif;font-weight:700;font-size:3rem;color:rgba(17,17,17,.08);line-height:1;margin-bottom:1.5rem}

.process-step h4{font-family:'Poppins',sans-serif;font-weight:700;font-size:1.125rem;margin-bottom:.75rem}

.process-step p{font-size:.9rem;color:var(--muted-foreground);line-height:1.6}



/* About page */

.team-grid{display:grid;gap:2rem}

@media(min-width:768px){.team-grid{grid-template-columns:repeat(3,1fr)}}

.team-card{text-align:center}

.team-avatar{width:7rem;height:7rem;border-radius:50%;background:var(--muted);margin:0 auto 1.25rem;border:2px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:2.5rem;overflow:hidden}

.team-avatar img{width:100%;height:100%;object-fit:cover}

.team-name{font-family:'Poppins',sans-serif;font-weight:700;font-size:1.125rem;margin-bottom:.25rem}

.team-role{font-family:'Oswald',sans-serif;font-size:.75rem;text-transform:uppercase;letter-spacing:.15em;color:var(--primary)}

.team-bio{font-size:.9rem;color:var(--muted-foreground);margin-top:.75rem;line-height:1.6}

.values-grid{display:grid;gap:1.5rem}

@media(min-width:768px){.values-grid{grid-template-columns:1fr 1fr}}

.value-item{padding:2rem;background:var(--muted)}

.value-item h4{font-family:'Poppins',sans-serif;font-weight:700;font-size:1.125rem;margin-bottom:.75rem}

.value-item p{color:var(--muted-foreground);line-height:1.7;font-size:.95rem}



/* ── Robust Group template integration ── */

body{padding-top:0}

.site-header{position:fixed;top:0;left:0;right:0;z-index:50;background:rgba(255,255,255,.88);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border)}

.site-header .container{position:relative}

.brand-mark{font-family:'Poppins',sans-serif;font-weight:700;font-size:1.35rem;letter-spacing:-.03em;white-space:nowrap}

.brand-mark span{color:var(--primary)}

.site-nav{display:flex;align-items:center;justify-content:space-between;min-height:5rem}

.site-nav .nav-links{display:none;align-items:center;gap:2.25rem;margin:0}

.site-nav .nav-links li{margin:0}

.site-nav .nav-links a{font-family:'Oswald',sans-serif;font-size:.75rem;text-transform:uppercase;letter-spacing:.15em;color:var(--muted-foreground);transition:color .2s}

.site-nav .nav-links a:hover{color:var(--primary)}

.site-nav .nav-links ul{list-style:none}

@media(min-width:768px){.site-nav .nav-links{display:flex}.site-nav .mobile-menu-toggle{display:none}}

.mobile-menu-toggle{display:flex;background:none;border:0;cursor:pointer;font-family:'Oswald',sans-serif;font-size:.72rem;letter-spacing:.12em;color:var(--foreground);padding:.5rem 0}

@media(min-width:768px){.mobile-menu-toggle{display:none}}

@media(max-width:767px){.site-nav .nav-links.mobile-open{display:flex;position:absolute;left:0;right:0;top:5rem;background:#fff;border-top:1px solid var(--border);padding:1.5rem;flex-direction:column;align-items:stretch;gap:1rem;box-shadow:0 18px 35px rgba(0,0,0,.08)}.site-nav .nav-links.mobile-open a{font-size:.85rem;display:block;padding:.45rem 0}}

.page-wrap{padding-top:5rem}

.rg-hero{min-height:calc(100vh - 5rem);display:grid;grid-template-columns:1fr;align-items:stretch;position:relative;overflow:hidden}

.rg-hero-copy{display:flex;align-items:center;position:relative;z-index:2;padding:5rem max(1.5rem,calc((100vw - 1240px)/2)) 5rem 1.5rem}

.rg-hero-copy-inner{max-width:720px}

.rg-hero h1{font-family:'Poppins',sans-serif;font-weight:200;font-size:clamp(2.8rem,4vw,6rem);line-height:.95;letter-spacing:-.035em;margin-bottom:2rem}

.rg-hero h1 strong{font-weight:700;color:var(--primary)}

.rg-hero p{font-size:1.1rem;color:var(--muted-foreground);max-width:43rem;line-height:1.75;margin-bottom:2.5rem}

.rg-hero-image{min-height:360px;;overflow:hidden}

.rg-hero-image img{width:100%;height:100%;object-fit:cover}





@media (min-width: 900px) {

  .rg-hero {

    grid-template-columns: 55% 45%;

    align-items: center; /* Centers items vertically */

  }



  .rg-hero-copy {

    padding-left: max(2rem, calc((100vw - 1240px) / 2));

  }



  .rg-hero-image {

    width: 100%;

    height: 100%;

    min-height: 0;

    display: flex;

    align-items: center;

    justify-content: center;

  }



  .rg-hero-image img {

    max-width: 100%;

    width: auto;          /* Prevents stretching past original size */

    max-height: 100%;     /* Keeps it inside the hero height */

    height: auto;

    object-fit: contain;

    display: block;

  }

}





.rg-actions{display:flex;flex-wrap:wrap;gap:1rem}

.rg-content{padding:6rem 0}

.rg-content-inner{max-width:100%}

.rg-content h2,.rg-content h3{font-family:'Poppins',sans-serif}

.rg-content h2{font-weight:200;font-size:clamp(2rem,5vw,3.6rem);line-height:1.05;margin:0 0 1.5rem}

.rg-content h3{font-size:1.35rem;margin:2.5rem 0 1rem}

.rg-content p{font-size:1.08rem;line-height:1.8;color:var(--muted-foreground);margin:0 0 1.25rem}

.rg-content ul,.rg-content ol{margin:1.25rem 0 1.75rem 1.25rem;color:var(--muted-foreground)}

.rg-content li{margin:.55rem 0;line-height:1.65}

.rg-content a{color:var(--foreground);text-decoration:underline;text-decoration-color:var(--primary);text-underline-offset:3px}

.rg-content img{max-width:100%;height:auto}

.rg-content blockquote{margin:2rem 0;padding:1.25rem 1.5rem;border-left:3px solid var(--primary);background:var(--muted);color:var(--muted-foreground)}

.rg-strip{background:var(--muted);padding:5rem 0}

.rg-special-hero{padding:8rem 0 4rem;background:var(--muted)}

.rg-special-hero h1{font-family:'Poppins',sans-serif;font-weight:200;font-size:clamp(2.5rem,6vw,4.8rem);line-height:1;letter-spacing:-.03em;margin-bottom:1.25rem}

.rg-special-hero h1 strong{font-weight:700}

.rg-special-hero p{font-size:1.1rem;color:var(--muted-foreground);max-width:46rem;line-height:1.75}

.rg-special-main{padding:5rem 0 7rem}

.rg-footer{background:#1a1a1a;color:#f9f9f9;padding:4.5rem 0 0}

.rg-footer-grid{display:grid;gap:3rem;margin-bottom:4rem}

@media(min-width:768px){.rg-footer-grid{grid-template-columns:2fr 1fr 1.4fr}}

.rg-footer .brand-mark{color:#f9f9f9;display:inline-block;margin-bottom:1.25rem}

.rg-footer p{color:#888;max-width:27rem;line-height:1.7}

.rg-footer h3{font-family:'Oswald',sans-serif;font-size:.7rem;text-transform:uppercase;letter-spacing:.2em;color:#888;margin-bottom:1.25rem}

.rg-footer ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.75rem}

.rg-footer a{color:#f9f9f9;transition:color .2s}

.rg-footer a:hover{color:var(--primary)}

.rg-footer .footer-services ul{display:grid;grid-template-columns:1fr;gap:.7rem}

.rg-footer-bottom{display:flex;flex-direction:column;gap:1rem;padding:1.75rem 0;border-top:1px solid #333;color:#777;font-size:.82rem}

@media(min-width:768px){.rg-footer-bottom{flex-direction:row;align-items:center;justify-content:space-between}}

.rg-footer-bottom a{color:#aaa}

.rg-footer-bottom a:hover{color:var(--primary)}

.rg-city{padding:1.25rem 1.5rem;background:var(--muted);border-left:3px solid var(--primary);margin-top:3rem}

.rg-city h3{margin:0 0 .4rem;font-family:'Oswald',sans-serif;font-size:.75rem;text-transform:uppercase;letter-spacing:.2em}

.rg-city ul{margin:0;padding:0;list-style:none}

.orange-accent-bar{width:64px;height:3px;background:var(--primary);margin:1rem 0 2rem}.orange-accent-bar.mini{width:56px;height:3px;margin:1rem 0 2rem}





/* ── AHT template compatibility / navigation ── */

.site-nav .nav-links > li { position:relative; }

.site-nav .nav-links > li > ul {

  display:none;

  position:absolute;

  top:100%;

  left:50%;

  transform:translateX(-50%);

  min-width:230px;

  padding:.8rem 0;

  margin:0;

  background:#fff;

  border:1px solid var(--border);

  box-shadow:0 16px 35px rgba(0,0,0,.08);

  z-index:60;

}

.site-nav .nav-links > li:hover > ul { display:block; }

.site-nav .nav-links > li > ul li { margin:0; }

.site-nav .nav-links > li > ul a {

  display:block;

  padding:.65rem 1rem;

  white-space:nowrap;

}

@media(max-width:767px){

  .site-nav .nav-links > li > ul {

    display:block;

    position:static;

    transform:none;

    min-width:0;

    padding:.25rem 0 0 1rem;

    border:0;

    box-shadow:none;

  }

  .site-nav .nav-links > li > ul a { padding:.35rem 0; }

}

.rg-page-image { background:var(--muted); }