/*
Theme Name: Superior Main
Theme URI: https://mysuperiorstore.com
Author: Superior Brand Solutions
Author URI: https://superiorbrandsolutions.com
Description: Minimal homepage theme for mysuperiorstore.com. Front page is a fully self-contained landing design (no shared chrome) so it renders exactly as designed instead of being wrapped in Thesis's header/nav/sidebar. Other page types fall back to a plain, unstyled layout via index.php — this theme is scoped for the homepage, not a full site rebuild.
Version: 1.0.0
Requires at least: 5.9
Requires PHP: 7.4
License: Unlicensed - private use only
Text Domain: superior-main
*/

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800&display=swap');

.sbs-landing { /* ---- design tokens (scoped) ---- */
  --c-primary:#13294C; --c-on-primary:#FFFFFF; --c-secondary:#334155;
  --c-accent:#FF5100; --c-accent-dark:#D94400; --c-bg:#FFFFFF;
  --c-surface:#F4F6FA; --c-fg:#13294C; --c-muted-fg:#516079;
  --c-muted:#E6EAF1; --c-border:#DEE4EE;
  --radius:14px; --maxw:1140px;
  --shadow-sm:0 1px 2px rgba(19,41,76,.06),0 1px 3px rgba(19,41,76,.08);
  --shadow-md:0 10px 30px rgba(19,41,76,.10);
  --shadow-lg:0 24px 60px rgba(19,41,76,.16);
  --ease:cubic-bezier(.22,.61,.36,1);

  font-family:'Montserrat', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  color:var(--c-fg); line-height:1.6; background:var(--c-bg);
  -webkit-font-smoothing:antialiased; text-align:left;
}

.sbs-landing *,
.sbs-landing *::before,
.sbs-landing *::after { box-sizing:border-box; }

.sbs-landing h1,.sbs-landing h2,.sbs-landing h3 {
  font-family:'Montserrat', system-ui, sans-serif; line-height:1.12; margin:0; color:var(--c-primary);
  letter-spacing:-.01em;
}
.sbs-landing p { margin:0; }
.sbs-landing a { color:inherit; text-decoration:none; }
.sbs-landing svg { display:block; }

.sbs-wrap { width:100%; max-width:var(--maxw); margin:0 auto; padding-left:24px; padding-right:24px; }
.sbs-eyebrow {
  font-family:'Montserrat',sans-serif; font-weight:600; font-size:.78rem;
  letter-spacing:.14em; text-transform:uppercase; color:var(--c-accent);
}

/* Buttons */
.sbs-btn {
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  font-family:'Montserrat',sans-serif; font-weight:700; font-size:1.06rem; letter-spacing:.01em;
  padding:15px 30px; border-radius:var(--radius); cursor:pointer; border:2px solid transparent;
  transition:transform .2s var(--ease), box-shadow .2s var(--ease), background .2s var(--ease);
  min-height:50px; line-height:1;
}
.sbs-btn--primary { background:var(--c-accent); color:#fff; box-shadow:var(--shadow-md); }
.sbs-btn--primary:hover { background:var(--c-accent-dark); transform:translateY(-2px); box-shadow:var(--shadow-lg); }
.sbs-btn--light { background:#fff; color:var(--c-accent); }
.sbs-btn--light:hover { transform:translateY(-2px); box-shadow:var(--shadow-lg); }
.sbs-landing a:focus-visible,
.sbs-landing button:focus-visible,
.sbs-landing input:focus-visible,
.sbs-landing textarea:focus-visible { outline:3px solid var(--c-accent); outline-offset:3px; border-radius:8px; }

/* Section scaffolding */
.sbs-section { padding:84px 0; }
.sbs-section--surface { background:var(--c-surface); }
.sbs-section--dark { background:var(--c-primary); color:#E2E8F0; }
.sbs-section--dark h2 { color:#fff; }
.sbs-head { max-width:760px; }
.sbs-head.is-center { margin:0 auto; text-align:center; }
.sbs-head h2 { font-size:clamp(1.8rem,3.6vw,2.6rem); font-weight:700; margin-top:12px; }
.sbs-head .lede { color:var(--c-muted-fg); font-size:1.15rem; margin-top:16px; }
.sbs-section--dark .sbs-head .lede { color:#94A3B8; }

/* HERO */
.sbs-hero {
  background:#fff;
  border-bottom:1px solid var(--c-border);
}
.sbs-hero .sbs-wrap { padding-top:76px; padding-bottom:76px; max-width:1140px; }
.sbs-hero-grid { display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
.sbs-hero-copy { text-align:left; }
.sbs-hero-logo { height:56px; width:auto; margin:0 0 22px; display:block; }
.sbs-hero h1 { font-size:clamp(2.2rem,4.2vw,3.4rem); font-weight:700; letter-spacing:-.025em; }
.sbs-hero .subhead { font-size:1.15rem; color:var(--c-muted-fg); max-width:46ch; margin:22px 0 32px; }
.sbs-hero .sbs-btn { font-size:1.05rem; padding:16px 34px; }

/* Hero visual: single plain image, no framing */
.sbs-hero-visual { display:flex; align-items:center; justify-content:center; }
.sbs-hero-shot { width:100%; max-width:520px; height:auto; display:block; }
@media (max-width:900px){
  .sbs-hero-grid { grid-template-columns:1fr; gap:44px; }
  .sbs-hero-copy { text-align:center; }
  .sbs-hero-logo { margin:0 auto 22px; }
  .sbs-hero .subhead { margin-left:auto; margin-right:auto; }
  .sbs-hero-shot { max-width:400px; }
}
@media (max-width:600px){
  .sbs-hero .sbs-wrap { padding-top:56px; padding-bottom:56px; }
}

/* LOGO BAR / STORE SHOWCASE MARQUEE */
.sbs-logobar { padding:34px 0; background:#fff; border-bottom:1px solid var(--c-border); overflow:hidden; }
.sbs-logobar .lead { text-align:center; font-family:'Montserrat',sans-serif; font-weight:500;
  color:var(--c-muted-fg); font-size:.92rem; letter-spacing:.04em; margin-bottom:24px; }
.sbs-marquee {
  overflow:hidden; width:100%;
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  mask-image:linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.sbs-marquee-track {
  display:flex; align-items:center; gap:28px; width:max-content;
  animation:sbs-marquee-scroll 32s linear infinite;
}
.sbs-marquee:hover .sbs-marquee-track { animation-play-state:paused; }
.sbs-marquee-item {
  height:120px; width:auto; flex:none;
  filter:saturate(.75) brightness(.98);
  transition:filter .25s var(--ease), transform .25s var(--ease);
}
.sbs-marquee-item:hover { filter:none; transform:translateY(-3px); }
@keyframes sbs-marquee-scroll {
  from { transform:translateX(0); }
  to { transform:translateX(-50%); }
}
@media (max-width:600px){
  .sbs-marquee-item { height:48px; }
}
@media (prefers-reduced-motion:reduce){
  .sbs-marquee { overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .sbs-marquee-track { animation:none; }
  .sbs-marquee-track .sbs-marquee-item:nth-child(n+10) { display:none; }
}

/* PROBLEM */
.sbs-problem .sbs-wrap { display:grid; grid-template-columns:1fr 1.05fr; gap:48px; align-items:center; }
.sbs-painlist { list-style:none; margin:0; padding:0; display:grid; gap:14px; }
.sbs-painlist li {
  display:flex; gap:14px; align-items:flex-start; background:#fff; border:1px solid var(--c-border);
  border-radius:14px; padding:18px 20px; box-shadow:var(--shadow-sm);
}
.sbs-painlist .x {
  flex:none; width:30px; height:30px; border-radius:9px; display:grid; place-items:center;
  background:#FEF2F2; color:#DC2626;
}
.sbs-painlist .x svg { width:17px; height:17px; }
.sbs-painlist strong { font-family:'Montserrat',sans-serif; color:var(--c-primary); font-weight:600; display:block; }
.sbs-painlist span.t { color:var(--c-muted-fg); font-size:.95rem; }

/* SOLUTION (feature grid) */
.sbs-services { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:48px; }
.sbs-card {
  background:#fff; border:1px solid var(--c-border); border-radius:16px; padding:26px 24px;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s;
}
.sbs-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-lg); border-color:#CBD5E1; }
.sbs-card.is-feature { background:var(--c-primary); border-color:var(--c-primary); }
.sbs-card.is-feature h3, .sbs-card.is-feature p { color:#fff; }
.sbs-card.is-feature .sbs-ico { background:rgba(255,255,255,.12); color:#FF7A3C; }
.sbs-card.is-feature .tag {
  display:inline-block; font-family:'Montserrat',sans-serif; font-size:.68rem; font-weight:600;
  letter-spacing:.1em; text-transform:uppercase; color:#0F172A; background:#FF7A3C;
  padding:3px 9px; border-radius:6px; margin-bottom:14px;
}
.sbs-ico { width:50px; height:50px; border-radius:13px; display:grid; place-items:center;
  background:var(--c-surface); color:var(--c-accent); margin-bottom:16px; }
.sbs-ico svg { width:26px; height:26px; }
.sbs-card h3 { font-size:1.16rem; }
.sbs-card p { color:var(--c-muted-fg); font-size:.95rem; margin-top:8px; }

/* BACKED-BY / DIFFERENTIATOR */
.sbs-logi .sbs-wrap { display:grid; grid-template-columns:1.05fr 1fr; gap:52px; align-items:center; }
.sbs-feat { list-style:none; margin:24px 0 0; padding:0; display:grid; gap:16px; }
.sbs-feat li { display:flex; gap:14px; align-items:flex-start; }
.sbs-feat .ck { flex:none; width:28px; height:28px; border-radius:8px; display:grid; place-items:center;
  background:rgba(255,122,60,.18); color:#FF7A3C; }
.sbs-feat .ck svg { width:16px; height:16px; }
.sbs-feat strong { font-family:'Montserrat',sans-serif; color:#fff; font-weight:600; display:block; }
.sbs-feat span.t { color:#94A3B8; font-size:.95rem; }
.sbs-logi .panel {
  background:linear-gradient(160deg,#1E293B,#0F172A); border:1px solid #1E293B; border-radius:22px;
  padding:36px; box-shadow:var(--shadow-lg);
}
.sbs-logi .panel .big { font-family:'Montserrat',sans-serif; font-weight:700; font-size:3.4rem; color:#fff; line-height:1; }
.sbs-logi .panel .big span { color:#FF7A3C; }
.sbs-logi .panel .cap { color:#94A3B8; font-weight:500; margin-top:8px; }
.sbs-logi .panel hr { border:0; border-top:1px solid #1E293B; margin:26px 0; }
.sbs-logi .panel .row { display:flex; justify-content:space-between; align-items:center; padding:9px 0; color:#CBD5E1; }
.sbs-logi .panel .row b { color:#fff; font-family:'Montserrat',sans-serif; font-weight:600; }

/* CLOSING + FORM */
.sbs-close .sbs-wrap { max-width:760px; }
.sbs-form {
  background:#fff; border:1px solid var(--c-border); border-radius:22px; padding:36px;
  box-shadow:var(--shadow-md); margin-top:36px;
}
.sbs-grid2 { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.sbs-field { display:flex; flex-direction:column; gap:7px; margin-bottom:18px; }
.sbs-field label { font-family:'Montserrat',sans-serif; font-weight:600; font-size:.9rem; color:var(--c-primary); }
.sbs-field label .req { color:#DC2626; }
.sbs-field label .opt { color:var(--c-muted-fg); font-weight:500; }
.sbs-field input, .sbs-field textarea {
  font-family:inherit; font-size:1rem; color:var(--c-fg); background:var(--c-surface);
  border:1.5px solid var(--c-border); border-radius:11px; padding:13px 15px; width:100%;
  transition:border-color .2s, background .2s; min-height:48px;
}
.sbs-field input:focus, .sbs-field textarea:focus { border-color:var(--c-accent); background:#fff; outline:none; }
.sbs-field textarea { min-height:120px; resize:vertical; }
.sbs-form .sbs-btn { width:100%; margin-top:6px; }

/* ---- Forminator override (form #3567): restyle Forminator's own markup
   to match this page's field/button system instead of its default look.
   Class names are Forminator's standard ones (forminator-ui); verify
   visually against the live form and adjust selectors if a class differs. */
.sbs-form .forminator-row { margin-bottom:0; }
.sbs-form .forminator-field,
.sbs-form .forminator-col { margin-bottom:18px; }
.sbs-form label.forminator-label {
  font-family:'Montserrat',sans-serif; font-weight:600; font-size:.9rem;
  color:var(--c-primary); margin-bottom:7px; display:block;
}
.sbs-form .forminator-required { color:#DC2626; }
.sbs-form input.forminator-input,
.sbs-form textarea.forminator-textarea-input,
.sbs-form select.forminator-select,
.sbs-form .forminator-input-file {
  font-family:inherit !important; font-size:1rem !important; color:var(--c-fg) !important;
  background:var(--c-surface) !important; border:1.5px solid var(--c-border) !important;
  border-radius:11px !important; padding:13px 15px !important; width:100% !important;
  min-height:48px; box-shadow:none !important;
  transition:border-color .2s, background .2s;
}
.sbs-form textarea.forminator-textarea-input { min-height:120px; resize:vertical; }
.sbs-form input.forminator-input:focus,
.sbs-form textarea.forminator-textarea-input:focus,
.sbs-form select.forminator-select:focus {
  border-color:var(--c-accent) !important; background:#fff !important; outline:none !important;
  box-shadow:none !important;
}
.sbs-form button.forminator-button-submit,
.sbs-form .forminator-button-submit {
  display:inline-flex; align-items:center; justify-content:center; width:100%;
  font-family:'Montserrat',sans-serif !important; font-weight:700 !important; font-size:1.06rem !important;
  letter-spacing:.01em; padding:15px 30px !important; border-radius:var(--radius) !important;
  border:none !important; background:var(--c-accent) !important; color:#fff !important;
  box-shadow:var(--shadow-md); min-height:50px; margin-top:6px;
  transition:transform .2s var(--ease), box-shadow .2s var(--ease), background .2s var(--ease);
}
.sbs-form button.forminator-button-submit:hover,
.sbs-form .forminator-button-submit:hover {
  background:var(--c-accent-dark) !important; transform:translateY(-2px); box-shadow:var(--shadow-lg);
}
.sbs-form .forminator-response-message,
.sbs-form .forminator-error-message { font-family:'Montserrat',sans-serif; font-size:.9rem; }
.sbs-reassure { text-align:center; color:var(--c-muted-fg); font-size:.95rem; margin-top:18px; display:flex; gap:8px; justify-content:center; align-items:center; }
.sbs-reassure svg { width:18px; height:18px; color:#16A34A; }

/* FOOTER */
.sbs-footer { background:#fff; border-top:3px solid var(--c-accent); padding:30px 0; }
.sbs-footer-inner { display:flex; align-items:center; justify-content:space-between; gap:18px 28px; flex-wrap:wrap; }
.sbs-footer-logo { height:40px; width:auto; }
.sbs-footer-text { display:flex; flex-direction:column; gap:4px; }
.sbs-footer p { color:var(--c-muted-fg); font-size:.9rem; }
.sbs-footer p b { font-family:'Montserrat',sans-serif; color:var(--c-primary); font-weight:600; }
.sbs-footer a.mail { color:var(--c-accent); font-weight:600; }
.sbs-admin-link {
  display:inline-flex; align-items:center; gap:6px; flex:none;
  font-family:'Montserrat',sans-serif; font-weight:600; font-size:.82rem;
  color:var(--c-muted-fg); transition:color .2s;
}
.sbs-admin-link:hover { color:var(--c-accent); }
.sbs-admin-link svg { width:14px; height:14px; }

/* Responsive */
@media (max-width:980px){
  .sbs-services { grid-template-columns:repeat(2,1fr); }
  .sbs-problem .sbs-wrap, .sbs-logi .sbs-wrap { grid-template-columns:1fr; gap:40px; }
}
@media (max-width:600px){
  .sbs-section { padding:60px 0; }
  .sbs-services { grid-template-columns:1fr; }
  .sbs-grid2 { grid-template-columns:1fr; }
  .sbs-hero .sbs-wrap { padding-top:64px; padding-bottom:60px; }
  .sbs-hero .sbs-btn { width:100%; }
  .sbs-logi .panel { padding:28px; }
}
@media (prefers-reduced-motion:reduce){
  .sbs-landing * { animation:none !important; transition:none !important; }
}

/* Minimal fallback layout for index.php (non-front-page requests) */
.sm-fallback { max-width:760px; margin:80px auto; padding:0 24px; font-family:'Montserrat',system-ui,sans-serif; color:#13294C; }
.sm-fallback h1 { font-size:2rem; margin-bottom:16px; }

/* ---- Motion: scroll reveal + smooth anchor scroll ---- */
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}
.sm-reveal {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity .7s var(--ease, cubic-bezier(.22,.61,.36,1)) var(--d, 0ms),
              transform .7s var(--ease, cubic-bezier(.22,.61,.36,1)) var(--d, 0ms);
  will-change: transform, opacity;
}
.sm-reveal.is-visible {
  opacity: 1;
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  .sm-reveal { opacity: 1; transform: none; transition: none; }
}