@charset "UTF-8";input[type=search]::-ms-clear{display:none;width:0;height:0}input[type=search]::-ms-reveal{display:none;width:0;height:0}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-results-button,input[type=search]::-webkit-search-results-decoration{display:none}html{box-sizing:border-box}*,::after,::before{box-sizing:inherit}.site-content{flex-grow:1}.wp-site-blocks{display:flex;min-height:100vh;flex-direction:column;justify-content:flex-start}.wp-site-blocks footer{margin-block-start:auto;margin-top:auto}.swt-block-row{padding-left:0;padding-right:0}.wp-block-group.is-layout-flow.wp-block-group-is-layout-flow{padding-left:0;padding-right:0}

/**
 * Theme Name: Spectra One
 * Author: Brainstorm Force
 * Author URI: https://brainstormforce.com/
 * Description: Spectra One is a beautiful and modern WordPress theme built with the Full Site Editing (FSE) feature. It's a versatile theme that can be used for blogs, portfolios, businesses, and more. Spectra One comes with a sleek and professional design that will make your website stand out from the crowd.
 * Requires at least: 6.1
 * Tested up to: 7.0
 * Requires PHP: 7.4
 * Version: 1.2.2
 * License: GNU General Public License v2 or later
 * License URI: https://www.gnu.org/licenses/gpl-2.0.html
 * Text Domain: spectra-one
 * Tags: full-site-editing, blog, theme-options, translation-ready, rtl-language-support, full-width-template
*/

/* ==========================================================================
   Yamamoto Custom Styles (Design Handoff Rebuild)
   ========================================================================== */

/* Google Fonts Import */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Oswald:wght@400;500;600;700&display=swap');

:root {
  --wp--preset--font-family--oswald: 'Oswald', sans-serif !important;
  --wp--preset--font-family--inter: 'Inter', sans-serif !important;
  --brand-blue: #229ad5;
  --brand-blue-hover: #1b82b5;
  --brand-blue-light: #42ace0;
  --ink-black: #14171a;
  --body-text: #343a41;
}

/* Ensure Full Bleed Alignfull Blocks Stretch Perfectly Without Horizontal Scrollbars */
.wp-site-blocks .alignfull,
.is-layout-constrained .alignfull,
.wp-block-group.alignfull,
.wp-block-template-part.alignfull,
main.alignfull,
section.alignfull,
header.alignfull,
footer.alignfull {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* Ensure Inner Content Wrappers Stay Centered and Sized Correctly */
.hero-content-wrapper,
.wp-block-group > div[style*="max-width:1280px"],
.wp-block-group > div[style*="max-width: 1280px"],
.wp-block-group > div[style*="max-width:800px"],
.wp-block-group > div[style*="max-width: 800px"],
.wp-block-group > div[style*="max-width:920px"],
.wp-block-group > div[style*="max-width: 920px"] {
  width: 100% !important;
  max-width: 1280px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* Yamamoto Exact Grid & Icon Box Utility Classes */
.yamamoto-stat-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.14);
}
.yamamoto-stat-cell {
  background: rgba(20,23,26,.45);
  padding: 26px 22px;
}
.yamamoto-stat-cell-dark {
  background: #14171a;
  padding: 22px 20px;
}
.yamamoto-icon-box-44 {
  width: 44px;
  height: 44px;
  background: #fff;
  border: 1px solid #dadee3;
  border-top: 3px solid #229ad5;
  border-radius: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.yamamoto-icon-box-52 {
  width: 52px;
  height: 52px;
  background: #eaf6fc;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 22px;
  border-radius: 2px;
}

/* Global Font Overrides */
.font-oswald,
.wp-block-navigation,
.wp-block-navigation-item,
.wp-block-navigation-link,
.wp-block-button__link,
.wp-block-heading,
.wp-block-site-title {
  font-family: 'Oswald', sans-serif !important;
  text-transform: uppercase;
}

.font-inter,
p,
li,
span,
.wp-block-paragraph {
  font-family: 'Inter', sans-serif !important;
}

/* Global Spacing Grid & Corner Radius */
.wp-block-button__link,
.wp-block-image img,
.wp-block-group,
.wp-block-columns,
.yamamoto-card {
  border-radius: 2px !important;
}

/* Utility bar */
.utility-bar {
  background-color: #14171a !important;
  color: #bcc3cb !important;
  font-size: 13px !important;
  padding: 10px 32px !important;
}
.utility-bar a {
  color: #bcc3cb !important;
  text-decoration: none !important;
  transition: color 0.2s ease;
}
.utility-bar a:hover {
  color: #42ace0 !important;
}
.utility-bar svg, .utility-bar i {
  color: #42ace0 !important;
}

/* Sticky Navigation Wrap */
.sticky-nav-wrap,
.wp-block-template-part.header {
  position: sticky !important;
  top: 0;
  z-index: 1000;
  background: rgba(255, 255, 255, 0.95) !important;
  backdrop-filter: blur(10px);
  border-bottom: 1px solid #dadee3 !important;
}
.wp-block-navigation .wp-block-navigation-item__label {
  font-family: 'Oswald', sans-serif !important;
  font-size: 14px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: #14171a !important;
}

/* Blueprint Grid Background */
.blueprint-grid {
  position: relative !important;
  background-color: #14171a !important;
}
.blueprint-grid::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background-image: 
    linear-gradient(rgba(66, 172, 224, 0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(66, 172, 224, 0.08) 1px, transparent 1px) !important;
  background-size: 44px 44px !important;
  pointer-events: none !important;
  z-index: 1 !important;
}
.blueprint-grid > * {
  position: relative !important;
  z-index: 2 !important;
}

/* Diagonal Overlay for Hero & CTA */
.hero-gradient-overlay {
  position: relative !important;
}
.hero-gradient-overlay::after {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background: linear-gradient(135deg, rgba(20,23,26,0.94) 0%, rgba(18,63,84,0.82) 50%, rgba(27,130,181,0.58) 100%) !important;
  pointer-events: none !important;
  z-index: 1 !important;
}
.hero-gradient-overlay > * {
  position: relative !important;
  z-index: 2 !important;
}

/* Gradient Text Clip */
.text-gradient {
  background: linear-gradient(90deg, #229ad5 0%, #6cc2e8 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block !important;
}

/* Ticker Marquee Animation */
.ticker-container {
  background-color: #229ad5 !important;
  border-bottom: 3px solid #1b82b5 !important;
  color: white !important;
  font-family: 'Oswald', sans-serif !important;
  text-transform: uppercase !important;
  font-size: 14px !important;
  letter-spacing: 0.05em !important;
  padding: 10px 0 !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
}

.ticker-wrap {
  display: inline-block !important;
  animation: marquee 35s linear infinite !important;
  padding-left: 50% !important;
}

@keyframes marquee {
  0% { transform: translate3d(0, 0, 0); }
  100% { transform: translate3d(-100%, 0, 0); }
}

/* WhatsApp FAB & Pulse Animation */
.whatsapp-fab {
  position: fixed !important;
  bottom: 32px !important;
  right: 32px !important;
  width: 60px !important;
  height: 60px !important;
  background-color: #25d366 !important;
  color: white !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 4px 10px rgba(0,0,0,0.3) !important;
  z-index: 9999 !important;
  transition: transform 0.2s ease-in-out !important;
  text-decoration: none !important;
}
.whatsapp-fab:hover {
  transform: scale(1.08) !important;
  color: white !important;
}
.whatsapp-fab::before {
  content: "" !important;
  position: absolute !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: 50% !important;
  background-color: #25d366 !important;
  opacity: 0.5 !important;
  z-index: -1 !important;
  animation: whatsapp-pulse 2s infinite !important;
}
@keyframes whatsapp-pulse {
  0% {
    transform: scale(1);
    opacity: 0.5;
  }
  100% {
    transform: scale(1.6);
    opacity: 0;
  }
}

/* Global button styles */
.wp-element-button, .wp-block-button__link {
  border-radius: 2px !important;
  font-family: 'Oswald', sans-serif !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  letter-spacing: 0.08em !important;
  padding: 12px 28px !important;
  font-size: 14px !important;
  transition: all 0.2s ease-in-out !important;
  text-decoration: none !important;
  display: inline-block !important;
}

.btn-primary .wp-block-button__link,
.btn-primary {
  background-color: #229ad5 !important;
  color: #fff !important;
  border: none !important;
}
.btn-primary:hover,
.btn-primary .wp-block-button__link:hover {
  background-color: #1b82b5 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(34,154,213,0.3) !important;
  color: #fff !important;
}

.btn-ghost .wp-block-button__link,
.btn-ghost {
  background-color: transparent !important;
  border: 1px solid rgba(255,255,255,0.35) !important;
  color: #fff !important;
}
.btn-ghost:hover,
.btn-ghost .wp-block-button__link:hover {
  background-color: rgba(255,255,255,0.1) !important;
  border-color: #fff !important;
  color: #fff !important;
}

.btn-dark .wp-block-button__link,
.btn-dark {
  background-color: #14171a !important;
  color: #fff !important;
  border: none !important;
}
.btn-dark:hover,
.btn-dark .wp-block-button__link:hover {
  background-color: #000 !important;
  transform: translateY(-2px) !important;
  color: #fff !important;
}

/* Card custom layout and accents */
.yamamoto-card {
  border-radius: 2px !important;
  border-top: 3px solid #229ad5 !important;
  box-shadow: 0 1px 3px rgba(20,23,26,0.08) !important;
  transition: all 0.2s ease-in-out !important;
  background-color: #ffffff !important;
  box-sizing: border-box !important;
}
.yamamoto-card:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 12px 28px rgba(20,23,26,0.12) !important;
}

/* Scroll reveal helper (set to visible by default for reliable static rendering) */
.scroll-reveal {
  opacity: 1 !important;
  transform: none !important;
}
