:root{
  --hogey-teal:#33a4a6;
  --hogey-teal-dark:#2a8587;
  --hogey-teal-soft:#e4f6f6;
  --hogey-orange:#f8931d;
  --hogey-orange-dark:#d67600;
  --hogey-gray:#808080;
  --hogey-text:#333333;
  --hogey-bg:#f5f5f5;
  --hogey-border:#dddddd;
  --hogey-white:#ffffff;

  /* missing tokens used later */
  --hogey-accent: var(--hogey-teal);
  --hogey-text-muted:#4b5563;
  --text-muted:#4b5563;
  --card-bg: rgba(255,255,255,0.92);
}

/* base reset */
*{box-sizing:border-box}

/* light mode defaults */
body{
  margin:0;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--hogey-text);
  background:var(--hogey-white);
  line-height:1.6;
}

/* ======================================
   DARK MODE (JS toggles: html.dark)
   ====================================== */
.dark{
  --hogey-text:#f5f5f5;
  --hogey-bg:#050608;
  --hogey-white:#0b0f14;
  --hogey-border:rgba(255,255,255,0.13);
  --hogey-gray:#c4c7d7;
  --hogey-text-muted:#cbd5e1;
  --text-muted:#cbd5e1;
  --card-bg: rgba(15,23,42,0.92);
}
.dark body{
  background:radial-gradient(circle at top left,#151826 0,var(--hogey-bg) 42%);
  color:var(--hogey-text);
}

/* links */
a{color:var(--hogey-teal-dark);text-decoration:none}
a:hover{text-decoration:underline}

/* header */
header{
  position:sticky;
  top:0;
  z-index:20;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--hogey-border);
}
.dark header{
  background:rgba(5,6,10,.94);
  border-bottom:1px solid rgba(255,255,255,.12);
}

.nav-inner{
  max-width:1100px;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:.75rem 1.5rem;
}

.logo img{max-height:42px;display:block}

/* nav desktop */
.nav-desktop ul{
  list-style:none;
  display:flex;
  gap:1.5rem;
  padding:0;
  margin:0;
  font-size:.95rem;
}
.nav-desktop a{
  font-weight:500;
  color:var(--hogey-text);
}
.nav-desktop a:hover{
  color:var(--hogey-teal-dark);
}

/* header actions */
.nav-actions{
  display:flex;
  align-items:center;
  gap:.65rem;
}

.mode-toggle{
  width:34px;
  height:34px;
  border-radius:999px;
  border:1px solid rgba(0,0,0,.12);
  background:#f9fafb;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  font-size:.9rem;
}
.mode-icon{pointer-events:none;}
.dark .mode-toggle{
  background:#111827;
  border-color:rgba(255,255,255,.25);
  color:#f9fafb;
}

/* mobile menu toggle */
/* mobile menu toggle */
.mobile-menu-toggle{
  display:none;
  width:36px;
  height:36px;
  border-radius:999px;
  border:1px solid rgba(0,0,0,.14);
  background:rgba(249,250,251,.95);
  cursor:pointer;
  padding:0;

  /* FIX */
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:4px;
}

.mobile-menu-toggle span{
  display:block;
  width:18px;
  height:2px;
  border-radius:999px;
  background:#111827;

  /* FIX: remove margins that can behave weird in flex */
  margin:0;

  transition:transform .18s ease,opacity .18s ease;
}

.dark .mobile-menu-toggle{
  background:rgba(15,23,42,.95);
  border-color:rgba(255,255,255,.24);
}
.dark .mobile-menu-toggle span{
  background:#f9fafb;
}

/* fancy burger animation */
.mobile-menu-toggle.open span:nth-child(1){
  transform:translateY(4px) rotate(45deg);
}
.mobile-menu-toggle.open span:nth-child(2){
  opacity:0;
}
.mobile-menu-toggle.open span:nth-child(3){
  transform:translateY(-4px) rotate(-45deg);
}

/* buttons */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.65rem 1.3rem;
  border-radius:999px;
  border:none;
  font-weight:600;
  cursor:pointer;
  font-size:.95rem;
  transition:transform .15s ease,box-shadow .15s ease,background .15s ease;
  text-decoration:none;
  white-space:nowrap;
}
.btn-small{
  padding:.45rem 1.1rem;
  font-size:.83rem;
}
.btn-primary{
  background:var(--hogey-orange);
  color:#000;
  box-shadow:0 8px 20px rgba(0,0,0,.12);
}
.btn-primary:hover{
  background:var(--hogey-orange-dark);
  transform:translateY(-1px);
  box-shadow:0 10px 24px rgba(0,0,0,.15);
}
.btn-outline{
  background:transparent;
  color:var(--hogey-teal-dark);
  border:1px solid var(--hogey-teal-dark);
}
.btn-outline:hover{
  background:var(--hogey-teal-soft);
}
.btn-full{width:100%;}

/* logo particle banner */
.logo-particle-banner{
  position:relative;
  overflow:hidden;
  width:100%;
  background:linear-gradient(135deg,#0b1120,#020617);
  color:#f9fafb;
}
html:not(.dark) .logo-particle-banner{
  background:linear-gradient(135deg,#e4f6f6,#fef6ea);
  color:#111827;
}
.logo-particle-banner::before,
.logo-particle-banner::after{
  content:"";
  position:absolute;
  width:260px;
  height:260px;
  border-radius:50%;
  background:radial-gradient(circle at center,rgba(248,147,29,.8),transparent 60%);
  filter:blur(40px);
  opacity:.5;
  animation:hogeyParticleDrift 22s linear infinite alternate;
}
.logo-particle-banner::before{
  top:-40px;
  left:-60px;
}
.logo-particle-banner::after{
  bottom:-80px;
  right:-80px;
  animation-duration:28s;
}
.logo-particle-inner{
  max-width:1100px;
  margin:0 auto;
  padding:1.8rem 1.5rem;
}
.logo-particle-main{
  display:flex;
  align-items:center;
  gap:1.25rem;
  position:relative;
  z-index:1;
}
.logo-particle-image{
  height:64px;
  flex-shrink:0;
}
.logo-particle-copy{
  max-width:640px;
}
.logo-particle-tagline{
  margin:0 0 .2rem;
  font-size:.9rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  opacity:.9;
}
.logo-particle-sub{
  margin:0;
  font-size:.95rem;
  opacity:.95;
}

/* simple particle float animation */
@keyframes hogeyParticleDrift{
  0%{transform:translate3d(0,0,0);}
  50%{transform:translate3d(20px,-10px,0);}
  100%{transform:translate3d(-10px,20px,0);}
}

/* layout */
main{
  max-width:1100px;
  margin:0 auto;
  padding:1.5rem;
}
section{
  padding:3rem 0;
  border-bottom:1px solid var(--hogey-border);
}
.dark section{
  border-bottom:1px solid rgba(255,255,255,.12);
}

/* hero */
#hero{
  position:relative;
  overflow:hidden;
}
.hero{
  display:grid;
  grid-template-columns:minmax(0,3fr) minmax(0,2fr);
  gap:2rem;
  align-items:center;
}

/* hero logo in main content */
.hero-brand-mark img{
  max-height:54px;
  margin-bottom:.6rem;
}

/* blurry black blobs */
.dark #hero::before,
.dark #hero::after{
  content:"";
  position:absolute;
  width:360px;
  height:360px;
  border-radius:50%;
  background:radial-gradient(circle at center,rgba(0,0,0,.82) 0,transparent 60%);
  filter:blur(55px);
  opacity:.75;
  z-index:-1;
}
.dark #hero::before{
  top:-80px;
  left:-60px;
}
.dark #hero::after{
  bottom:-120px;
  right:-80px;
}

.hero-heading{
  font-size:2.15rem;
  font-weight:700;
  margin-bottom:.75rem;
}
.hero-sub{
  font-size:1.05rem;
  color:var(--hogey-gray);
  margin-bottom:1.5rem;
}
.hero-cta-row{
  display:flex;
  gap:.75rem;
  flex-wrap:wrap;
}
.hero-badges{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
  margin-top:1.5rem;
}
.badge{
  font-size:.8rem;
  padding:.3rem .7rem;
  border-radius:999px;
  background:var(--hogey-teal-soft);
  color:var(--hogey-teal-dark);
  border:1px solid rgba(0,0,0,.03);
}
.dark .badge{
  background:rgba(15,23,42,.85);
  color:#e5f9f9;
  border-color:rgba(255,255,255,.12);
}

.hero-card{
  background:var(--hogey-teal-soft);
  border-radius:1.2rem;
  padding:1.5rem;
  border:1px solid var(--hogey-border);
}
.dark .hero-card{
  background:rgba(15,23,42,.9);
  border-color:rgba(255,255,255,.16);
}
.hero-card-text{
  font-size:.9rem;
  margin-bottom:.9rem;
}
.stack-list{
  list-style:none;
  padding:0;
  margin:0;
  font-size:.9rem;
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
}
.stack-list li{
  padding:.25rem .6rem;
  border-radius:999px;
  background:var(--hogey-white);
  border:1px dashed var(--hogey-border);
}
.dark .stack-list li{
  background:#020617;
  border-color:rgba(255,255,255,.18);
  color:var(--hogey-gray);
}

/* sections */
.section-title{
  font-size:1.5rem;
  margin-bottom:.5rem;
}
.section-subtitle{
  color:var(--hogey-gray);
  margin-bottom:1.5rem;
  font-size:.98rem;
  max-width:640px;
}

/* cards */
.grid-3{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1.5rem;
}
.card{
  border-radius:1rem;
  padding:1.25rem;
  border:1px solid var(--hogey-border);
  background:var(--hogey-white);
  transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;
}
.card:hover{
  transform:translateY(-2px);
  border-color:var(--hogey-teal);
  box-shadow:0 12px 28px rgba(0,0,0,.09);
}
.dark .card{
  background:#050816;
  border-color:rgba(255,255,255,.16);
  box-shadow:0 18px 34px rgba(0,0,0,.9);
}
.dark .card:hover{
  box-shadow:0 24px 46px rgba(0,0,0,.9);
}
.card h3{
  margin-top:0;
  margin-bottom:.35rem;
  font-size:1.05rem;
}
.pill{
  display:inline-block;
  font-size:.78rem;
  padding:.17rem .55rem;
  border-radius:999px;
  background:var(--hogey-teal-soft);
  color:var(--hogey-teal-dark);
  margin-bottom:.6rem;
}
.dark .pill{
  background:rgba(28,37,65,.95);
  color:#e5f9f9;
}
.list-compact{
  padding-left:1.2rem;
  font-size:.9rem;
  margin-top:.5rem;
  margin-bottom:.2rem;
}

/* layout grids */
.two-col{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1.5rem;
}
.section-subheading{
  margin-top:0;
  font-size:1rem;
}
.process-list{
  padding-left:1.2rem;
  font-size:.95rem;
}

/* contact */
.contact-form{
  border-radius:1rem;
  border:1px solid var(--hogey-border);
  padding:1.5rem;
  background:var(--hogey-bg);
}
.field{margin-bottom:1rem}
label{
  display:block;
  font-size:.85rem;
  font-weight:600;
  margin-bottom:.25rem;
}
input[type=text],
input[type=email],
select,
textarea{
  width:100%;
  padding:.5rem .6rem;
  border-radius:.4rem;
  border:1px solid var(--hogey-border);
  font:inherit;
  background:var(--hogey-white);
}
.dark input[type=text],
.dark input[type=email],
.dark select,
.dark textarea{
  background:#020617;
  border-color:rgba(255,255,255,.22);
  color:var(--hogey-text);
}
textarea{
  min-height:130px;
  resize:vertical;
}
.checkbox-row{
  display:flex;
  align-items:flex-start;
  gap:.5rem;
  font-size:.8rem;
}
.contact-alt{font-size:.95rem}

/* footer */
footer{
  border-top:1px solid var(--hogey-border);
  background:var(--hogey-bg);
  margin-top:2rem;
}
.dark footer{
  background:#020617;
  border-top:1px solid rgba(255,255,255,.16);
}
.footer-inner{
  max-width:1100px;
  margin:0 auto;
  padding:1.5rem;
  display:flex;
  flex-wrap:wrap;
  gap:1rem;
  justify-content:space-between;
  font-size:.8rem;
  color:var(--hogey-gray);
}
.footer-links{
  display:flex;
  gap:1rem;
  flex-wrap:wrap;
}

/* cookie banner */
.cookie-banner{
  position:fixed;
  bottom:0;
  left:0;
  right:0;
  z-index:20;
  background:#111;
  color:#f5f5f5;
  font-size:.85rem;
  padding:.8rem 1rem;
  display:flex;
  justify-content:center;
}
.cookie-inner{
  max-width:1100px;
  display:flex;
  align-items:center;
  gap:.75rem;
  width:100%;
  flex-wrap:wrap;
}
.cookie-inner p{
  margin:0;
  flex:1;
}
.cookie-btn{
  border-radius:999px;
  border:none;
  padding:.4rem 1rem;
  background:var(--hogey-orange);
  color:#000;
  font-weight:600;
  cursor:pointer;
  font-size:.85rem;
}

/* ===========================
   Assistance prompt (JS uses .hidden)
   =========================== */
.assist-prompt{
  position:fixed;
  right:1rem;
  bottom:4.5rem;
  z-index:25;
  opacity:1;
  pointer-events:auto;
  transform:translateY(0);
  transition:opacity .2s ease,transform .2s ease;
}
.assist-prompt.hidden{
  opacity:0;
  pointer-events:none;
  transform:translateY(10px);
}
.assist-card{
  max-width:260px;
  padding:1rem;
  border-radius:1rem;
  background:var(--hogey-white);
  border:1px solid var(--hogey-border);
  box-shadow:0 14px 34px rgba(0,0,0,.25);
}
.dark .assist-card{
  background:#020617;
  border-color:rgba(255,255,255,.2);
}
.assist-text{
  margin:.1rem 0 .7rem;
  font-size:.9rem;
}
.assist-actions{
  display:flex;
  gap:.4rem;
  margin-bottom:.4rem;
}
.assist-close{
  border:none;
  background:none;
  color:var(--hogey-gray);
  font-size:.78rem;
  padding:0;
  cursor:pointer;
}

/* mobile nav overlay */
.mobile-nav-overlay{
  position:fixed;
  inset:0;
  z-index:30;
  background:rgba(3,4,7,.92);
  backdrop-filter:blur(22px);
  display:flex;
  align-items:flex-start;
  justify-content:center;
  opacity:0;
  pointer-events:none;
  transition:opacity .18s ease-out;
}
.mobile-nav-overlay.open{
  opacity:1;
  pointer-events:auto;
}
.mobile-nav-inner{
  width:100%;
  max-width:480px;
  padding:1.5rem 1.3rem 2rem;
  color:#f9fafb;
}
.mobile-nav-close{
  border:none;
  background:transparent;
  color:#e5e7eb;
  font-size:1.7rem;
  cursor:pointer;
}
.mobile-nav-links{
  display:flex;
  flex-direction:column;
  gap:1.1rem;
  margin:1.25rem 0 1.3rem;
  font-size:1.1rem;
}
.mobile-nav-links a{
  color:#e5e7eb;
  text-decoration:none;
}
.mobile-nav-links a:hover{
  color:#38bdf8;
}
.mobile-nav-cta{
  margin-bottom:.9rem;
}
.mobile-nav-meta{
  font-size:.85rem;
  color:#cbd5f5;
}

/* optional: lock scroll when mobile nav open (JS adds html.nav-open) */
html.nav-open, html.nav-open body{overflow:hidden;}

/* modal */
.modal{
  position:fixed;
  inset:0;
  z-index:40;
  display:none;
}
.modal.open{
  display:block;
}
.modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(15,23,42,.75);
  backdrop-filter:blur(3px);
}
.modal-dialog{
  position:relative;
  max-width:420px;
  margin:15vh auto 0;
  padding:1.4rem 1.3rem 1.5rem;
  border-radius:1rem;
  background:var(--hogey-white);
  border:1px solid var(--hogey-border);
}
.dark .modal-dialog{
  background:#020617;
  border-color:rgba(255,255,255,.22);
}
.modal-dialog h3{
  margin-top:0;
  margin-bottom:.4rem;
}
.modal-dialog p{
  font-size:.9rem;
  margin-top:0;
  margin-bottom:1rem;
}

/* legal pages */
.legal-main{
  max-width:800px;
  margin:0 auto;
  padding:2.5rem 1.5rem 3rem;
}
.legal-main section{
  padding:0;
  border-bottom:none;
}

/* admin page */
.admin-main{
  max-width:1100px;
  margin:0 auto;
  padding:2.5rem 1.5rem 3rem;
}
.admin-header{
  padding:1rem 1.5rem;
  border-bottom:1px solid var(--hogey-border);
}
.dark .admin-header{
  border-bottom:1px solid rgba(255,255,255,.16);
}
.admin-metrics{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
  margin:1.8rem 0 2rem;
}
.admin-card{
  border-radius:.9rem;
  border:1px solid var(--hogey-border);
  padding:.9rem 1rem;
  background:var(--hogey-white);
  font-size:.85rem;
}
.dark .admin-card{
  background:#020617;
  border-color:rgba(255,255,255,.2);
}
.admin-card-label{
  color:var(--hogey-gray);
  font-size:.78rem;
}
.admin-card-value{
  font-size:1.2rem;
  font-weight:600;
}
.admin-section{
  margin-bottom:2.2rem;
}
.admin-section h2{
  font-size:1.1rem;
  margin:0 0 .6rem;
}
.admin-table{
  width:100%;
  border-collapse:collapse;
  font-size:.8rem;
}
.admin-table th,
.admin-table td{
  border:1px solid var(--hogey-border);
  padding:.4rem .45rem;
  text-align:left;
}
.dark .admin-table th,
.dark .admin-table td{
  border-color:rgba(255,255,255,.18);
}
.admin-table th{
  background:#f3f4f6;
}
.dark .admin-table th{
  background:#020617;
}

/* responsive */
@media (max-width:800px){
  .hero{
    grid-template-columns:minmax(0,1fr);
  }
  .grid-3{
    grid-template-columns:minmax(0,1fr);
  }
  .two-col{
    grid-template-columns:minmax(0,1fr);
  }
  .nav-desktop{
    display:none;
  }
  .nav-cta-desktop{
    display:none;
  }
  .mobile-menu-toggle{
    display:inline-flex;
  }
  .nav-inner{
    justify-content:space-between;
  }
  .front-banner-inner{
    padding:.55rem 1rem;
    flex-direction:column;
    align-items:flex-start;
  }
  .assist-prompt{
    right:.75rem;
    bottom:4.25rem;
  }
  .admin-metrics{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media (max-width:540px){
  .admin-metrics{
    grid-template-columns:minmax(0,1fr);
  }
}

/* service icon */
.service-icon{
  font-size:1.6rem; /* fallback if no SVG */
  display:block;
  margin-bottom:0.4rem;
  color:var(--hogey-teal-dark);
}
.dark .service-icon{
  color:#a5b4fc;
}
.service-icon .icon-svg{
  width:32px;
  height:32px;
  display:block;
}

/* Full-width hero that bleeds edge-to-edge inside a centered layout */
.hero-section {
  position: relative;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  overflow: hidden;
  min-height: 480px;
  border-bottom: 0px;
}

/* canvas fills the whole hero */
#heroParticles {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  z-index: 0;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* content stays centered */
.hero.hero-content {
  position: relative;
  z-index: 1;
  max-width: 1100px;
  margin: 0 auto;
  padding: 1rem 1.5rem;
}

/* stack list hover animation */
.stack-list li {
  position: relative;
  color: var(--hogey-text);
  transform: translateX(0);
  transition: all .35s cubic-bezier(.22,.61,.36,1);
}
.hero-card:hover .stack-list li {
  transform: translateX(6px);
  color: var(--hogey-accent, #33A4A6);
}
.stack-list li::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 0%;
  height: 2px;
  background: var(--hogey-accent, #33A4A6);
  transition: width .35s cubic-bezier(.22,.61,.36,1);
  opacity: .8;
}
.hero-card:hover .stack-list li::after { width: 22px; }
.stack-list li:nth-child(1) { transition-delay: 0.00s; }
.stack-list li:nth-child(2) { transition-delay: 0.05s; }
.stack-list li:nth-child(3) { transition-delay: 0.10s; }
.stack-list li:nth-child(4) { transition-delay: 0.15s; }
.stack-list li:nth-child(5) { transition-delay: 0.20s; }
.stack-list li:nth-child(6) { transition-delay: 0.25s; }

/* About + How we work (timeline layout) */
.about-shell{
  display:grid;
  gap:2rem;
  align-items:flex-start;
  margin-bottom:2.5rem;
}
@media (min-width:900px){
  .about-shell{
    grid-template-columns:minmax(0,2.1fr) minmax(0,1.2fr);
  }
}
.about-main p{ margin-bottom:0.9rem; }

.about-highlight{
  border-radius:1.2rem;
  padding:1.3rem 1.2rem;
  background:linear-gradient(135deg,#f5fbfd,#ffffff);
  color:#0f172a;
  border:1px solid rgba(148,163,184,0.35);
  box-shadow:0 10px 30px rgba(15,23,42,0.06);
}
.dark .about-highlight{
  background:rgba(15,23,42,0.98);
  color:var(--hogey-text);
  border-color:rgba(148,163,184,0.30);
  box-shadow:0 18px 40px rgba(0,0,0,0.45);
}
.about-highlight h3{
  margin:0 0 .6rem;
  font-size:1rem;
  font-weight:600;
}
.about-highlight ul{
  list-style:none;
  padding:0;
  margin:0;
}
.about-highlight li{
  font-size:.9rem;
  line-height:1.5;
  padding-left:1.1rem;
  position:relative;
  margin-bottom:.4rem;
}
.about-highlight li::before{
  content:"•";
  position:absolute;
  left:0;
  top:0;
  color:#0f766e;
}

/* Zigzag timeline (uses theme variables) */
.process-timeline{
  margin-top:1.4rem;
  padding:1.8rem 1.3rem 2.2rem;
  border-radius:1.5rem;
  background:var(--hogey-bg);
  border:1px solid var(--hogey-border);
  box-shadow:0 14px 40px rgba(0,0,0,0.06);
  position:relative;
  overflow:hidden;
}
.process-timeline::before{
  content:"";
  position:absolute;
  inset:-40%;
  background:
    radial-gradient(circle at 0% 0%,rgba(51,164,166,0.16),transparent 55%),
    radial-gradient(circle at 100% 100%,rgba(51,164,166,0.10),transparent 55%);
  opacity:0.7;
  pointer-events:none;
}
.process-headline{ position:relative; z-index:1; }

.timeline-rail{
  position:relative;
  z-index:1;
  margin:2rem auto 0;
  max-width:980px;
  padding:0 1rem;
}
.timeline-rail::before{
  content:"";
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  top:0.5rem;
  bottom:1.8rem;
  width:2px;
  background:linear-gradient(180deg,rgba(148,163,184,0.7),rgba(51,164,166,0.9));
  opacity:0.9;
}
.timeline-rail::after{
  content:"";
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  bottom:0.4rem;
  border-width:10px 7px 0 7px;
  border-style:solid;
  border-color:rgba(51,164,166,0.95) transparent transparent transparent;
}

.timeline-step{
  position:relative;
  display:flex;
  align-items:flex-start;
  justify-content:flex-end;
  margin-bottom:1.8rem;
  opacity:0;
  transform:translateY(18px);
  animation:timelineIn .7s cubic-bezier(.22,.61,.36,1) forwards;
}
.timeline-step:nth-child(2){animation-delay:.08s}
.timeline-step:nth-child(3){animation-delay:.16s}
.timeline-step:nth-child(4){animation-delay:.24s}
.timeline-step:nth-child(5){animation-delay:.32s}
.timeline-step:nth-child(even){ justify-content:flex-start; }

.timeline-dot{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  top:1.1rem;
  width:0.9rem;
  height:0.9rem;
  border-radius:999px;
  background:var(--hogey-white);
  box-shadow:0 0 0 3px rgba(0,0,0,0.06);
}
.timeline-dot::before{
  content:"";
  position:absolute;
  inset:3px;
  border-radius:inherit;
  background:radial-gradient(circle,rgba(51,164,166,1) 0%,rgba(51,164,166,0.18) 100%);
}
.timeline-dot-final::before{
  background:radial-gradient(circle,rgba(45,212,191,1) 0%,rgba(45,212,191,0.18) 100%);
}

.timeline-card{
  position:relative;
  width:min(460px, calc(50% - 2.8rem));
  background:var(--hogey-white);
  border-radius:1rem;
  padding:0.9rem 1rem 1rem;
  border:1px solid var(--hogey-border);
  box-shadow:0 12px 30px rgba(0,0,0,0.10);
  backdrop-filter:blur(10px);
  transition:transform .25s cubic-bezier(.22,.61,.36,1),
             box-shadow .25s cubic-bezier(.22,.61,.36,1),
             border-color .25s cubic-bezier(.22,.61,.36,1);
}
.timeline-step:nth-child(odd) .timeline-card{ margin-left:1.8rem; }
.timeline-step:nth-child(even) .timeline-card{ margin-right:1.8rem; }
.timeline-card:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 40px rgba(0,0,0,0.18);
  border-color:var(--hogey-teal);
}

.timeline-step-head{
  display:flex;
  align-items:center;
  gap:.5rem;
  margin-bottom:.4rem;
}
.timeline-step-number{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:1.8rem;
  height:1.8rem;
  border-radius:999px;
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  background:rgba(51,164,166,0.06);
  border:1px solid rgba(51,164,166,0.5);
  color:var(--hogey-teal-dark);
}
.timeline-step-title{
  font-weight:600;
  font-size:.95rem;
  color:var(--hogey-text);
}
.timeline-text{
  margin:0;
  font-size:.86rem;
  line-height:1.5;
  color:var(--hogey-text);
}

@keyframes timelineIn{
  0%{ opacity:0; transform:translateY(18px); }
  100%{ opacity:1; transform:translateY(0); }
}

@media (max-width:768px){
  .timeline-rail{ padding-left:2.1rem; }
  .timeline-rail::before,
  .timeline-rail::after{
    left:1.1rem;
    transform:none;
  }
  .timeline-step{ justify-content:flex-start !important; }
  .timeline-card{
    width:100%;
    margin:0 0 0 2rem !important;
  }
  .timeline-dot{
    left:1.1rem;
    transform:none;
  }
}

/* bullets colors in dark mode */
.contact-bullets{
  margin:0.75rem 0 0.75rem 1.2rem;
  padding:0;
  list-style:disc;
  color:#111827;
}
.dark .contact-bullets{ color:var(--hogey-text); }
.contact-bullets li{
  font-size:0.92rem;
  line-height:1.6;
  margin-bottom:0.25rem;
}

.about-bullets{
  margin:0.5rem 0 0.75rem 1.2rem;
  padding:0;
  list-style:disc;
  color:#111827;
}
.dark .about-bullets{ color:var(--hogey-text); }
.about-bullets li{
  font-size:0.92rem;
  line-height:1.6;
  margin-bottom:0.25rem;
}

/* pulse burger (optional alt button class) */
.pulse{
  position:relative;
  width:42px; height:42px;
  border-radius:999px;
  border:1px solid var(--hogey-border);
  background:#fff;
  display:flex; flex-direction:column;
  justify-content:center; align-items:center;
  gap:5px; cursor:pointer;
  overflow:hidden;
}
.pulse::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:999px;
  background:rgba(0,0,0,0.04);
  transform:scale(0);
  transition:.4s ease;
}
.pulse.open::after{ transform:scale(1.4); opacity:0; }
.pulse span{
  width:20px; height:2px;
  background:var(--hogey-text);
  transition:.25s ease;
}
.pulse.open span:nth-child(1){transform:translateY(6px) rotate(45deg);}
.pulse.open span:nth-child(2){opacity:0;}
.pulse.open span:nth-child(3){transform:translateY(-6px) rotate(-45deg);}

/* Modern contact form styling (kept) */
.contact-form{
  border-radius:1.25rem;
  border:1px solid var(--hogey-border);
  padding:1.6rem 1.5rem 1.8rem;
  background:var(--hogey-white);
  box-shadow:0 18px 45px rgba(0,0,0,0.06);
}
.field{ margin-bottom:1.05rem; }
label{
  display:block;
  font-size:.83rem;
  font-weight:600;
  letter-spacing:.02em;
  text-transform:none;
  color:var(--hogey-gray);
  margin-bottom:.25rem;
}
input[type=text],
input[type=email],
select,
textarea{
  width:100%;
  padding:.65rem .7rem;
  border-radius:.55rem;
  border:1px solid var(--hogey-border);
  background:var(--hogey-bg);
  font:inherit;
  color:var(--hogey-text);
  transition:border-color .16s ease,box-shadow .16s ease,background-color .16s ease,transform .08s ease;
}
textarea{ min-height:140px; resize:vertical; }
input[type=text]:hover,
input[type=email]:hover,
select:hover,
textarea:hover{ border-color:rgba(148,163,184,0.9); }
input[type=text]:focus-visible,
input[type=email]:focus-visible,
select:focus-visible,
textarea:focus-visible{
  outline:none;
  border-color:var(--hogey-teal);
  box-shadow:0 0 0 1px rgba(51,164,166,0.4), 0 0 0 6px rgba(51,164,166,0.10);
  background:var(--hogey-white);
}
select{
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  padding-right:2.1rem;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--hogey-gray) 51%),
    linear-gradient(135deg, var(--hogey-gray) 49%, transparent 50%);
  background-position:
    calc(100% - 14px) 52%,
    calc(100% - 9px) 52%;
  background-size:7px 7px, 7px 7px;
  background-repeat:no-repeat;
}
.checkbox-row{
  display:flex;
  align-items:flex-start;
  gap:.45rem;
  font-size:.8rem;
  color:var(--hogey-gray);
  margin-top:.25rem;
}
.checkbox-row input[type=checkbox]{
  margin-top:.18rem;
  width:15px;
  height:15px;
  accent-color:var(--hogey-teal);
}
.checkbox-row a{ font-weight:600; }
.contact-form .btn-primary{
  margin-top:.4rem;
  padding:.6rem 1.55rem;
  border-radius:999px;
}
@media (max-width:640px){
  .contact-form{
    padding:1.4rem 1.1rem 1.6rem;
    border-radius:1.1rem;
  }
  .contact-form .btn-primary{
    width:100%;
    justify-content:center;
  }
}

/* force no underline (your preference) */
a{ text-decoration: none !important; }
.visit-group-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.visit-group-head-row td{
  background:rgba(148,163,184,0.12);
  font-weight:600;
}

body.dark-mode .visit-group-head-row td{
  background:rgba(255,255,255,0.06);
}

.visit-group-divider td{
  padding:0;
  height:8px;
  border:none;
  background:transparent;
}
