/* ══════════════════════════════════════════════════════════════════
   BETABUILDS — styles.css  (Professional / LexisNexis-style)
   ══════════════════════════════════════════════════════════════════ */

/* ── VARIABLES ─────────────────────────────────────────────────── */
:root {
  --navy:     #0f1f3d;
  --blue:     #1b5fad;
  --blue-dk:  #144d96;
  --white:    #ffffff;
  --off:      #f7f9fc;
  --light:    #eef2f9;
  --border:   #dde4ef;
  --muted:    #5e6e8a;
  --text:     #1a2b4a;
  --radius:   6px;
  --radius-lg:10px;
  --shadow:   0 2px 8px rgba(0,0,0,0.07);
  --shadow-md:0 4px 20px rgba(0,0,0,0.1);
  --tr:       all 0.2s ease;
}

/* ── RESET ─────────────────────────────────────────────────────── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html   { scroll-behavior:smooth; }
body   { font-family:'Inter','Segoe UI',sans-serif; color:var(--text); background:var(--white); line-height:1.6; overflow-x:hidden; }
img    { max-width:100%; display:block; }
a      { text-decoration:none; color:inherit; }
ul     { list-style:none; }

/* ── SCROLL REVEAL ─────────────────────────────────────────────── */
.reveal { opacity:0; transform:translateY(20px); transition:opacity 0.5s ease, transform 0.5s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }

/* ── LAYOUT ────────────────────────────────────────────────────── */
.container   { max-width:1180px; margin:0 auto; padding:0 32px; }
.section     { padding:88px 0; }
.section-alt { background:var(--off); }

.section-head {
  max-width:640px;
  margin:0 auto 56px;
  text-align:center;
}
.section-head h2 {
  font-size:clamp(1.75rem,3.5vw,2.5rem);
  font-weight:800;
  color:var(--navy);
  margin:10px 0 14px;
  line-height:1.2;
}
.section-head p { font-size:1rem; color:var(--muted); line-height:1.7; }

.section-tag {
  display:inline-block;
  font-size:0.72rem;
  font-weight:700;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--blue);
  background:var(--light);
  padding:5px 14px;
  border-radius:4px;
}

/* ══════════════════════════ HEADER ══════════════════════════════ */
#header {
  position:fixed;
  top:0; left:0;
  width:100%;
  z-index:1000;
  background:var(--navy);
  border-bottom:1px solid rgba(255,255,255,0.08);
  transition:box-shadow 0.3s ease;
}
#header.scrolled { box-shadow:0 2px 16px rgba(0,0,0,0.25); }

.header-inner {
  max-width:1180px;
  margin:0 auto;
  padding:0 32px;
  height:64px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}

.logo-link { display:flex; align-items:center; gap:10px; flex-shrink:0; }
.logo-img  { height:34px; border-radius:5px; }
.logo-text { font-size:1.15rem; font-weight:800; color:var(--white); letter-spacing:-0.01em; }

#nav-list  { display:flex; gap:2px; align-items:center; }

.nav-link {
  color:rgba(255,255,255,0.75);
  font-size:0.88rem;
  font-weight:500;
  padding:6px 12px;
  border-radius:4px;
  transition:var(--tr);
}
.nav-link:hover, .nav-link.active {
  color:var(--white);
  background:rgba(255,255,255,0.08);
}

.nav-cta {
  background:var(--blue);
  color:var(--white);
  font-size:0.85rem;
  font-weight:600;
  padding:8px 18px;
  border-radius:var(--radius);
  transition:var(--tr);
  flex-shrink:0;
}
.nav-cta:hover { background:var(--blue-dk); }

.menu-toggle {
  display:none;
  flex-direction:column;
  justify-content:center;
  gap:5px;
  background:none;
  border:none;
  cursor:pointer;
  padding:6px;
  width:36px; height:36px;
}
.bar { display:block; height:2px; background:var(--white); border-radius:2px; transition:var(--tr); }
.menu-toggle.open .bar:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
.menu-toggle.open .bar:nth-child(2) { opacity:0; }
.menu-toggle.open .bar:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }

/* ══════════════════════════ HERO ════════════════════════════════ */
.hero {
  min-height:88vh;
  background:var(--navy);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:120px 32px 80px;
  text-align:center;
}

.hero-content {
  max-width:760px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:24px;
}

.hero-eyebrow {
  font-size:0.78rem;
  font-weight:600;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.45);
}

.hero-title {
  font-size:clamp(2.6rem,5.5vw,4rem);
  font-weight:900;
  color:var(--white);
  line-height:1.1;
  letter-spacing:-0.03em;
}

.hero-accent { color:#5badff; }

.hero-desc {
  font-size:1.05rem;
  color:rgba(255,255,255,0.6);
  max-width:540px;
  line-height:1.75;
}

.hero-ctas { display:flex; gap:12px; flex-wrap:wrap; justify-content:center; }

.btn-primary {
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:var(--blue);
  color:var(--white);
  font-size:0.9rem;
  font-weight:600;
  padding:13px 26px;
  border-radius:var(--radius);
  transition:var(--tr);
}
.btn-primary:hover { background:var(--blue-dk); }

.btn-outline {
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:transparent;
  border:1px solid rgba(255,255,255,0.25);
  color:rgba(255,255,255,0.85);
  font-size:0.9rem;
  font-weight:600;
  padding:13px 26px;
  border-radius:var(--radius);
  transition:var(--tr);
}
.btn-outline:hover { border-color:rgba(255,255,255,0.5); color:var(--white); }

/* ══════════════════════════ STATS ═══════════════════════════════ */
.stats-strip { background:var(--blue); padding:36px 32px; }

.stats-inner {
  max-width:900px;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-around;
  gap:16px;
  flex-wrap:wrap;
}

.stat-item  { text-align:center; }

.stat-num-wrap {
  display:flex;
  align-items:baseline;
  justify-content:center;
  gap:2px;
  line-height:1;
}

.stat-pfx, .stat-num, .stat-sfx { color:var(--white); font-weight:800; }
.stat-num  { font-size:2.2rem; }
.stat-pfx  { font-size:1.2rem; }
.stat-sfx  { font-size:1rem; opacity:0.85; }

.stat-label {
  display:block;
  font-size:0.74rem;
  color:rgba(255,255,255,0.65);
  font-weight:500;
  margin-top:4px;
  letter-spacing:0.05em;
  text-transform:uppercase;
}

.stat-sep { width:1px; height:44px; background:rgba(255,255,255,0.2); }

/* ══════════════════════════ SERVICES ════════════════════════════ */
.services-section { background:var(--off); }

.services-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(280px,1fr));
  gap:20px;
}

.service-card {
  background:var(--white);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:32px 28px;
  transition:var(--tr);
}
.service-card:hover {
  border-color:var(--blue);
  box-shadow:var(--shadow-md);
}

.svc-icon {
  width:48px; height:48px;
  background:var(--light);
  border-radius:var(--radius);
  display:flex; align-items:center; justify-content:center;
  font-size:1.25rem;
  color:var(--blue);
  margin-bottom:18px;
}

.service-card h3 { font-size:1rem; font-weight:700; color:var(--navy); margin-bottom:8px; }
.service-card p  { font-size:0.88rem; color:var(--muted); line-height:1.65; }

/* ══════════════════════════ FLIP CAROUSEL ════════════════════════ */
.flip-carousel {
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:20px;
}

.flip-track {
  display:grid;
  grid-template-areas:"card";
  width:min(580px, 100%);
  overflow:hidden;
  padding-top:20px;
}

/* All cards stacked in same grid cell */
.flip-card {
  grid-area:card;
  min-width:0;
  opacity:0;
  pointer-events:none;
  transition:opacity 0.36s ease, transform 0.36s ease;
  position:relative;
}

.flip-card.active {
  opacity:1;
  pointer-events:all;
  z-index:1;
}

/* JS adds these for animation direction */
.flip-card.from-right { transform:translateX(64px); }
.flip-card.from-left  { transform:translateX(-64px); }
.flip-card.exit-right { transform:translateX(64px); }
.flip-card.exit-left  { transform:translateX(-64px); }

/* Back button — top-left corner of card */
.flip-back-btn {
  position:absolute;
  top:14px; left:14px;
  width:26px; height:26px;
  background:rgba(255,255,255,0.07);
  border:1px solid rgba(255,255,255,0.12);
  border-radius:50%;
  color:rgba(255,255,255,0.5);
  font-size:0.62rem;
  cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:var(--tr);
  z-index:2;
}
.flip-back-btn:hover { background:rgba(255,255,255,0.2); color:var(--white); }
.flip-back-btn.hidden { opacity:0; pointer-events:none; }

/* Next button — reset browser button defaults */
button.uv-card-arrow {
  appearance:none; -webkit-appearance:none;
  background:none; border:none;
  cursor:pointer; padding:0;
}
button.uv-card-arrow:disabled { opacity:0.18; cursor:default; }

/* CTA link at bottom of each card */
.uv-cta-link {
  display:flex; align-items:center; justify-content:center; gap:8px;
  margin-top:20px;
  padding:15px 20px;
  background:rgba(255,255,255,0.1);
  border:1px solid rgba(255,255,255,0.18);
  border-radius:10px;
  color:rgba(255,255,255,0.92);
  font-size:0.96rem; font-weight:700;
  letter-spacing:0.02em;
  transition:var(--tr);
}
.uv-cta-link:hover { background:rgba(255,255,255,0.18); color:var(--white); }
.uv-featured .uv-cta-link { background:rgba(255,255,255,0.15); }
.uv-featured .uv-cta-link:hover { background:rgba(255,255,255,0.3); }

/* Pagination dots */
.flip-dots { display:flex; gap:7px; align-items:center; }

.flip-dot {
  width:7px; height:7px;
  border-radius:50%;
  background:var(--border);
  border:none; cursor:pointer; padding:0;
  transition:all 0.25s ease;
}
.flip-dot:hover  { background:#9ab2cc; }
.flip-dot.active { width:22px; border-radius:4px; background:var(--blue); }

/* ── UV CARD (Uiverse-inspired) ──────────────────────────────── */
.uv-card {
  --card-bg:     #0f1f3d;
  --card-sub:    rgba(255,255,255,0.42);
  --card-main:   #ffffff;
  --card-accent: rgba(224,223,220,0.75);

  position:relative;
  min-width:0;
  width:100%;
  padding:36px 40px;
  border-radius:24px;
  display:flex;
  flex-direction:column;
  gap:8px;
  background-color:var(--card-bg);
  transition:all 0.2s ease;
  cursor:default;
  box-shadow:0 4px 24px -4px rgba(0,0,0,0.5);
  scroll-snap-align:start;
  flex-shrink:0;
}

.uv-card::before {
  content:'';
  width:99%; height:99%;
  background:rgba(91,173,255,0.1);
  position:absolute;
  z-index:-1;
  top:1px; left:1px;
  border-radius:22px;
}


.uv-featured { --card-bg:#1b5fad; --card-accent:rgba(255,255,255,0.85); }
.uv-featured::before { background:rgba(255,255,255,0.1); }

.uv-featured-badge {
  position:absolute;
  top:-13px; left:50%;
  transform:translateX(-50%);
  background:#5badff;
  color:#0f1f3d;
  font-size:0.68rem; font-weight:800;
  letter-spacing:0.1em; text-transform:uppercase;
  padding:4px 14px; border-radius:4px;
  white-space:nowrap;
}

.uv-card-img {
  font-size:2.6rem;
  color:var(--card-accent);
  margin-bottom:8px;
  height:52px;
  display:flex; align-items:center;
}

.uv-card-sub {
  color:var(--card-sub);
  font-weight:600; font-size:0.82rem;
  text-transform:uppercase; letter-spacing:0.1em;
}

.uv-card-row {
  display:flex; flex-direction:row;
  justify-content:space-between; align-items:center;
  margin:2px 0 4px;
}

.uv-card-title {
  color:var(--card-main);
  font-weight:900; font-size:2.1rem; line-height:1.1;
}
.uv-card-title span { font-size:0.95rem; font-weight:500; color:var(--card-sub); }

.uv-card-sub-price { font-size:0.85rem; color:var(--card-sub); margin-top:-2px; margin-bottom:6px; }

@keyframes arrow-nudge {
  0%, 100% { transform:rotate(-45deg) translate(0, 0); }
  50%       { transform:rotate(-45deg) translate(5px, -5px); }
}

.uv-card-arrow {
  width:46px; height:46px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  color:var(--card-accent);
  animation:arrow-nudge 1.6s ease-in-out infinite;
}
.uv-card-arrow .uv-arrow-svg { width:100%; height:100%; }
.uv-card-arrow:disabled { animation:none; opacity:0.18; cursor:default; }

.uv-card-features {
  display:flex; flex-direction:column; gap:10px;
  margin-top:14px; list-style:none;
}
.uv-card-features li {
  display:flex; align-items:center; gap:10px;
  font-size:0.92rem; color:rgba(255,255,255,0.75);
}
.uv-card-features li::before {
  content:'✓'; color:var(--card-accent);
  font-weight:700; font-size:0.8rem; flex-shrink:0;
}

.uv-card-body { font-size:0.86rem; color:rgba(255,255,255,0.62); line-height:1.65; margin-top:6px; }

.uv-perf-badge {
  display:inline-flex; align-items:center; gap:6px;
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.15);
  color:rgba(255,255,255,0.6);
  font-size:0.74rem; font-weight:600;
  padding:5px 12px; border-radius:4px; margin-top:6px;
}

/* ══════════════════════════ PRICING ═════════════════════════════ */
.pricing-section { background:var(--white); }

.pricing-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(300px,1fr));
  gap:24px;
  align-items:start;
}

.price-card {
  background:var(--white);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:36px 32px;
  transition:var(--tr);
  position:relative;
}
.price-card:hover  { box-shadow:var(--shadow-md); border-color:#b0c4e0; }

.price-card.featured {
  background:var(--navy);
  border-color:var(--navy);
  transform:scale(1.03);
}
.price-card.featured:hover { transform:scale(1.03); box-shadow:var(--shadow-md); }

.featured-label {
  position:absolute;
  top:-13px; left:50%;
  transform:translateX(-50%);
  background:var(--blue);
  color:var(--white);
  font-size:0.7rem;
  font-weight:700;
  letter-spacing:0.1em;
  text-transform:uppercase;
  padding:4px 16px;
  border-radius:4px;
  white-space:nowrap;
}

.price-top { margin-bottom:24px; }

.price-plan {
  display:block;
  font-size:0.76rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:0.1em;
  color:var(--blue);
  margin-bottom:12px;
}
.price-card.featured .price-plan { color:rgba(255,255,255,0.55); }

.price-amount { display:flex; align-items:baseline; gap:3px; line-height:1; margin-bottom:6px; }
.price-currency { font-size:1.3rem; font-weight:700; color:var(--navy); }
.price-num      { font-size:2.6rem; font-weight:900; color:var(--navy); letter-spacing:-0.03em; }
.custom-price   { font-size:2.2rem; font-weight:900; color:var(--navy); }
.price-period   { font-size:0.88rem; color:var(--muted); }

.price-card.featured .price-currency,
.price-card.featured .price-num,
.price-card.featured .custom-price { color:var(--white); }
.price-card.featured .price-period { color:rgba(255,255,255,0.45); }

.price-sub-amount { font-size:0.82rem; color:var(--muted); margin-bottom:12px; }
.price-card.featured .price-sub-amount { color:rgba(255,255,255,0.45); }

.price-desc { font-size:0.86rem; color:var(--muted); line-height:1.55; }
.price-card.featured .price-desc { color:rgba(255,255,255,0.5); }

.price-features { display:flex; flex-direction:column; gap:10px; margin:24px 0 28px; }

.price-features li {
  display:flex; align-items:center; gap:10px;
  font-size:0.88rem; color:var(--text);
}
.price-card.featured .price-features li { color:rgba(255,255,255,0.82); }

.price-features i { color:var(--blue); font-size:0.7rem; flex-shrink:0; width:14px; }
.price-card.featured .price-features i { color:#5badff; }

.price-btn {
  display:block;
  text-align:center;
  background:var(--light);
  color:var(--blue);
  font-weight:700;
  font-size:0.88rem;
  padding:13px;
  border-radius:var(--radius);
  border:1px solid var(--border);
  transition:var(--tr);
}
.price-btn:hover { background:var(--blue); color:var(--white); border-color:var(--blue); }

.featured-btn {
  background:var(--blue);
  color:var(--white);
  border-color:var(--blue);
}
.featured-btn:hover { background:var(--blue-dk); }

/* ══════════════════════════ ABOUT ═══════════════════════════════ */
.about-section { background:var(--off); }

.about-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:64px;
  align-items:center;
}

.about-text .section-tag { margin-bottom:16px; }

.about-text h2 {
  font-size:clamp(1.75rem,3vw,2.4rem);
  font-weight:800;
  color:var(--navy);
  line-height:1.2;
  margin-bottom:20px;
}

.about-text p { font-size:0.96rem; color:var(--muted); line-height:1.78; margin-bottom:14px; }
.about-text strong { color:var(--blue); font-weight:600; }

.about-values { display:flex; flex-wrap:wrap; gap:8px; margin-top:24px; }

.value-chip {
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:var(--white);
  border:1px solid var(--border);
  color:var(--text);
  font-size:0.82rem;
  font-weight:600;
  padding:7px 14px;
  border-radius:4px;
  transition:var(--tr);
}
.value-chip i { color:var(--blue); }
.value-chip:hover { border-color:var(--blue); color:var(--blue); }

.about-visual { display:flex; flex-direction:column; gap:14px; }

.about-quote-card {
  background:var(--navy);
  color:var(--white);
  border-radius:var(--radius-lg);
  padding:36px 32px;
}

.quote-icon { font-size:2rem; color:#5badff; opacity:0.4; margin-bottom:14px; display:block; }

.about-quote-card p {
  font-size:1rem;
  font-style:italic;
  line-height:1.72;
  color:rgba(255,255,255,0.78);
  margin-bottom:18px;
}
.quote-author { font-size:0.82rem; font-weight:700; color:#5badff; }
.quote-context { font-size:0.75rem; font-weight:400; color:var(--muted); font-style:italic; margin-top:2px; display:block; }

.about-badges { display:flex; flex-direction:column; gap:8px; }

.about-badge {
  display:flex;
  align-items:center;
  gap:12px;
  background:var(--white);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:12px 16px;
  font-size:0.88rem;
  font-weight:600;
  color:var(--text);
  transition:var(--tr);
}
.about-badge i { color:var(--blue); width:16px; text-align:center; }
.about-badge:hover { border-color:var(--blue); }

/* ══════════════════════════ PROJECTS (TICKER) ═══════════════════ */
.projects-section { background:var(--white); padding:88px 0 72px; }

.ticker-track {
  overflow:hidden;
  padding:28px 0;
  mask-image:linear-gradient(to right, transparent 0%, black 8%, black 92%, transparent 100%);
  -webkit-mask-image:linear-gradient(to right, transparent 0%, black 8%, black 92%, transparent 100%);
}

.ticker-belt {
  display:flex;
  align-items:center;
  gap:32px;
  width:max-content;
  animation:ticker 22s linear infinite;
}
.ticker-belt:hover { animation-play-state:paused; }

.ticker-item {
  display:flex;
  align-items:center;
  justify-content:center;
  height:88px;
  min-width:168px;
  padding:14px 24px;
  background:var(--off);
  border:1px solid var(--border);
  border-radius:var(--radius);
  flex-shrink:0;
  transition:var(--tr);
}
.ticker-item:hover { border-color:var(--blue); box-shadow:var(--shadow); }

.ticker-item img {
  height:52px;
  width:auto;
  max-width:140px;
  object-fit:contain;
  filter:grayscale(100%) opacity(0.5);
  transition:var(--tr);
}
.ticker-item:hover img { filter:grayscale(0%) opacity(1); }

@keyframes ticker {
  from { transform:translateX(0); }
  to   { transform:translateX(-50%); }
}

/* ══════════════════════════ TEAM ════════════════════════════════ */
.team-section { background:var(--off); }

.founder-card {
  background:var(--white);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:40px 40px;
  display:flex;
  gap:36px;
  align-items:flex-start;
  margin-bottom:60px;
}

.founder-avatar {
  width:160px; height:160px;
  flex-shrink:0;
  border-radius:50%;
  overflow:hidden;
  background:var(--light);
  border:3px solid var(--border);
}
.founder-avatar img { width:100%; height:100%; object-fit:cover; object-position:center 28%; }

.avatar-placeholder {
  width:100%; height:100%;
  display:flex; align-items:center; justify-content:center;
  font-size:2.4rem; color:var(--blue);
}

.founder-details h3 { font-size:1.5rem; font-weight:800; color:var(--navy); margin-bottom:6px; }

.founder-title {
  display:inline-block;
  background:var(--light);
  color:var(--blue);
  font-size:0.76rem;
  font-weight:700;
  padding:4px 12px;
  border-radius:4px;
  margin-bottom:16px;
  border:1px solid var(--border);
}

.founder-details p { font-size:0.94rem; color:var(--muted); line-height:1.74; max-width:600px; margin-bottom:20px; }

.tech-stack { display:flex; flex-wrap:wrap; gap:7px; }
.tech-stack span {
  background:var(--off);
  color:var(--text);
  font-size:0.76rem;
  font-weight:600;
  padding:4px 12px;
  border-radius:4px;
  border:1px solid var(--border);
}

.join-section { text-align:center; }
.join-section h3 { font-size:1.75rem; font-weight:800; color:var(--navy); margin-bottom:10px; }
.join-section > p { font-size:0.96rem; color:var(--muted); max-width:560px; margin:0 auto 36px; line-height:1.74; }

.openings-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(280px,1fr));
  gap:20px;
  max-width:780px;
  margin:0 auto;
}

.opening-card {
  background:var(--white);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:28px 24px;
  text-align:left;
  display:flex;
  flex-direction:column;
  gap:11px;
  transition:var(--tr);
}
.opening-card:hover { border-color:var(--blue); box-shadow:var(--shadow); }

.opening-icon-bg {
  width:46px; height:46px;
  background:var(--light);
  border-radius:var(--radius);
  display:flex; align-items:center; justify-content:center;
  font-size:1.2rem; color:var(--blue);
}

.opening-card h4 { font-size:1rem; font-weight:700; color:var(--navy); }
.opening-card p  { font-size:0.87rem; color:var(--muted); line-height:1.6; flex:1; }

.perf-badge {
  display:inline-flex; align-items:center; gap:5px;
  background:var(--light);
  color:var(--blue);
  font-size:0.74rem;
  font-weight:600;
  padding:4px 11px;
  border-radius:4px;
  border:1px solid var(--border);
}

.apply-btn {
  display:inline-flex; align-items:center; gap:7px;
  background:#25d366; color:var(--white);
  font-size:0.86rem; font-weight:600;
  padding:10px 18px; border-radius:var(--radius);
  transition:var(--tr);
}
.apply-btn:hover { background:#1ebe59; }

/* ══════════════════════════ CONTACT ═════════════════════════════ */
.contact-section { background:var(--white); }

.contact-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(260px,1fr));
  gap:20px;
}

.contact-card {
  background:var(--off);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:32px 26px;
  text-align:center;
  transition:var(--tr);
}
.contact-card:hover { border-color:var(--blue); background:var(--white); box-shadow:var(--shadow); }

.contact-icon-wrap {
  width:58px; height:58px;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:1.5rem;
  margin:0 auto 18px;
}
.contact-icon-wrap.wa    { background:#d1fae5; color:#25d366; }
.contact-icon-wrap.ig    { background:#fce7f3; color:#e1306c; }
.contact-icon-wrap.hours { background:var(--light); color:var(--blue); }

.contact-card h3 { font-size:1rem; font-weight:700; color:var(--navy); margin-bottom:8px; }
.contact-card p  { font-size:0.87rem; color:var(--muted); line-height:1.6; margin-bottom:18px; }

.contact-btn {
  display:inline-block;
  font-size:0.86rem; font-weight:600;
  padding:10px 22px; border-radius:var(--radius);
  transition:var(--tr);
}
.wa-btn { background:#25d366; color:var(--white); }
.wa-btn:hover { background:#1ebe59; }
.ig-btn { background:linear-gradient(135deg,#e1306c,#833ab4); color:var(--white); }
.ig-btn:hover { opacity:0.88; }

.hours-table { display:flex; flex-direction:column; gap:6px; text-align:left; }
.hours-row {
  display:flex; justify-content:space-between;
  font-size:0.85rem; font-weight:500;
  color:var(--text);
  padding:8px 12px;
  background:var(--white);
  border-radius:var(--radius);
}
.hours-row.off { color:var(--muted); background:transparent; }

/* ══════════════════════════ FOOTER ══════════════════════════════ */
.footer { background:var(--navy); }

.footer-inner {
  max-width:1180px; margin:0 auto;
  padding:64px 32px 48px;
  display:grid;
  grid-template-columns:2fr 1fr 1fr 1fr;
  gap:40px;
}

.footer-brand .footer-logo { display:flex; align-items:center; gap:10px; margin-bottom:14px; }
.footer-brand .footer-logo img  { height:30px; border-radius:5px; }
.footer-brand .footer-logo span { font-size:1.1rem; font-weight:800; color:var(--white); }

.footer-brand p { font-size:0.85rem; line-height:1.7; color:rgba(255,255,255,0.4); margin-bottom:22px; }

.footer-social { display:flex; gap:10px; }
.footer-social a {
  width:36px; height:36px;
  background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.1);
  border-radius:var(--radius);
  display:flex; align-items:center; justify-content:center;
  font-size:0.95rem; color:rgba(255,255,255,0.6);
  transition:var(--tr);
}
.footer-social a:hover { background:var(--blue); border-color:var(--blue); color:var(--white); }

.footer-col h4 {
  font-size:0.72rem; font-weight:700; letter-spacing:0.12em;
  text-transform:uppercase; color:rgba(255,255,255,0.3);
  margin-bottom:18px;
}
.footer-col ul { display:flex; flex-direction:column; gap:9px; }
.footer-col ul li a { font-size:0.86rem; color:rgba(255,255,255,0.5); transition:var(--tr); }
.footer-col ul li a:hover { color:var(--white); }

.footer-bottom {
  border-top:1px solid rgba(255,255,255,0.07);
  padding:18px 32px;
  text-align:center;
  font-size:0.78rem;
  color:rgba(255,255,255,0.25);
  max-width:1180px;
  margin:0 auto;
}

/* ══════════════════════════ FLOATING WA ═════════════════════════ */
.float-wa {
  position:fixed;
  bottom:24px; right:24px;
  width:52px; height:52px;
  background:#25d366;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:1.5rem; color:var(--white);
  box-shadow:0 4px 16px rgba(37,211,102,0.45);
  z-index:999;
  transition:var(--tr);
}
.float-wa:hover { background:#1ebe59; transform:scale(1.08); }

/* ══════════════════════════ MOBILE NAV ══════════════════════════ */
@media (max-width:1024px) {
  .footer-inner { grid-template-columns:1fr 1fr; }
  .about-grid   { gap:48px; }
}

@media (max-width:768px) {
  .section { padding:64px 0; }

  .nav-cta    { display:none; }
  .menu-toggle { display:flex; }

  #main-nav {
    position:absolute;
    top:64px; left:0;
    width:100%;
    background:var(--navy);
    border-top:1px solid rgba(255,255,255,0.08);
    max-height:0;
    overflow:hidden;
    transition:max-height 0.35s ease;
  }
  #main-nav.open { max-height:380px; }

  #nav-list { flex-direction:column; gap:0; padding:10px 16px 18px; }
  .nav-link  { display:block; padding:11px 14px; font-size:0.96rem; }

  .hero-ctas  { flex-direction:column; align-items:center; }
  .btn-primary, .btn-outline { width:100%; justify-content:center; max-width:300px; }

  .stats-inner { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
  .stat-sep    { display:none; }

  .pricing-grid { grid-template-columns:1fr; }
  .price-card.featured { transform:none; }

  .about-grid { grid-template-columns:1fr; gap:36px; }

  .founder-card { flex-direction:column; align-items:center; text-align:center; padding:28px 22px; gap:20px; }
  .founder-details p { text-align:left; }

  .footer-inner { grid-template-columns:1fr; gap:28px; padding:44px 24px 28px; }
}

@media (max-width:480px) {
  .container { padding:0 20px; }
  .hero-title { font-size:clamp(2rem,9vw,2.8rem); }
}