/* Food & Beverage Industry Solution - Coming Soon Styles */
:root {
  --fb-hero-height: 92vh;
}

.fb-hero {
  position: relative;
  min-height: var(--fb-hero-height);
  display: flex;
  align-items: center;
  overflow: hidden;
  background: radial-gradient(circle at 30% 50%, rgba(233,55,78,0.15), transparent 60%),
              radial-gradient(circle at 70% 60%, rgba(69,123,159,0.18), transparent 65%),
              linear-gradient(135deg, var(--bg-secondary), var(--background-light));
}

.fb-hero:before, .fb-hero:after {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(60deg, rgba(233,55,78,0.04) 0 10px, transparent 10px 20px);
  mix-blend-mode: overlay;
  opacity: .4;
  animation: gridShift 22s linear infinite;
}
.fb-hero:after { animation-direction: reverse; opacity:.25; }

@keyframes gridShift { to { transform: translate3d(-120px,-60px,0); } }

.fb-hero-content { position: relative; z-index:2; }
.fb-badge { display:inline-flex; align-items:center; gap:.5rem; padding:.5rem 1rem; font-size:.8rem; letter-spacing:.5px; text-transform:uppercase; border-radius:40px; background: var(--primary-gradient); color:var(--text-light); box-shadow:0 4px 16px var(--shadow-primary); }

.fb-title { font-size:clamp(2.2rem,5vw,3.5rem); font-weight:800; line-height:1.1; margin:1.25rem 0; background: var(--gradient-primary-alt); -webkit-background-clip:text; color:transparent; }
.fb-subtitle { font-size:clamp(1.05rem,1.6vw,1.35rem); color: var(--text-secondary); max-width:680px; }

.fb-metrics { display:flex; flex-wrap:wrap; gap:1.5rem; margin:2.5rem 0 3rem; }
.fb-metric { min-width:160px; flex:1 1 160px; background: var(--card-bg); border:1px solid var(--border); border-radius:18px; padding:1.25rem 1.1rem; position:relative; overflow:hidden; box-shadow:0 8px 30px -6px var(--shadow-light); }
.fb-metric:before { content:""; position:absolute; inset:0; background:linear-gradient(120deg, rgba(233,55,78,0.08), rgba(69,123,159,0.08)); opacity:0; transition:opacity .4s var(--ease-out-quart); }
.fb-metric:hover:before { opacity:1; }
.fb-metric-value { font-size:1.9rem; font-weight:700; background:var(--primary-gradient); -webkit-background-clip:text; color:transparent; letter-spacing:.5px; }
.fb-metric-label { font-size:.8rem; text-transform:uppercase; font-weight:600; letter-spacing:.75px; color:var(--text-secondary); }

.fb-notify-wrapper { max-width:680px; }
.fb-notify-card { background:rgba(255,255,255,0.75); backdrop-filter:blur(12px); border:1px solid var(--border); border-radius:24px; padding:2.25rem 2rem 2.5rem; position:relative; box-shadow:0 12px 40px -10px var(--shadow-medium); }
[data-theme="dark"] .fb-notify-card { background:rgba(45,45,45,0.75); }

.fb-coming-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1.5rem; margin-top:3.5rem; }
.fb-coming-item { background:var(--card-bg); border:1px solid var(--border); border-radius:18px; padding:1.2rem 1rem 1.3rem; position:relative; overflow:hidden; }
.fb-coming-item h5 { font-size:1rem; font-weight:700; margin:0 0 .4rem; }
.fb-coming-item p { font-size:.8rem; margin:0; color:var(--text-secondary); line-height:1.35; }
.fb-coming-item:before { content:""; position:absolute; inset:0; background:linear-gradient(140deg, rgba(233,55,78,0.08), rgba(69,123,159,0.08)); opacity:0; transition:opacity .4s; }
.fb-coming-item:hover:before { opacity:1; }

.fb-divider { height:1px; width:100%; background:linear-gradient(90deg, transparent, var(--border), transparent); margin:2.25rem 0 1.75rem; }

.fb-badge-soon { background:var(--warning-color); color:#111; font-weight:600; font-size:.65rem; padding:.25rem .6rem; border-radius:14px; letter-spacing:.5px; }

.fb-wave-bg { position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.fb-wave { position:absolute; width:140%; left:-20%; height:120%; top:-10%; background:radial-gradient(circle at 30% 40%, rgba(233,55,78,0.35), transparent 60%), radial-gradient(circle at 70% 60%, rgba(69,123,159,0.35), transparent 60%); filter:blur(60px); opacity:.45; animation:waves 18s ease-in-out infinite alternate; }
@keyframes waves { 0% { transform:translate3d(0,0,0) scale(1); } 50% { transform:translate3d(4%, -3%,0) scale(1.05); } 100% { transform:translate3d(-4%, 3%,0) scale(1.08); } }

/* Notification form */
.fb-notify-card form .form-control { border-radius:14px; padding:.85rem 1rem; border:1px solid var(--border); background:var(--card-bg); }
.fb-notify-card form .form-control:focus { border-color:var(--primary-color); box-shadow:0 0 0 3px var(--shadow-primary); }
.fb-notify-card button[type=submit] { border-radius:16px; font-weight:600; padding:.85rem 1.4rem; }

/* Animations (utility classes) */
.fade-up { opacity:0; transform:translateY(30px); }
.scale-in { opacity:0; transform:scale(.85); }

/* No-JS / fallback: if body.no-js is present (set via <noscript> or early script), show elements */
body.no-js .fade-up,
body.no-js .scale-in { opacity:1 !important; transform:none !important; }

@media (max-width: 768px) {
  .fb-hero { min-height: 100vh; padding:4.5rem 0 3rem; }
  .fb-metrics { margin:2rem 0 2.5rem; }
  .fb-metric { min-width:140px; }
  .fb-notify-card { padding:1.75rem 1.5rem 2rem; }
}
