/*
Theme Name: Hello Biz Child
Theme URI: https://elementor.com/products/hello-biz/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Template: hello-biz
Author: Elementor Team
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Description: Hello Biz is a free, user-friendly Hybrid WordPress Theme that was crafted for seamless integration with the Elementor site builder and tailored specifically for business websites. Perfect for beginners, but far from limited to just them, it features a dedicated beginner-oriented “Home” screen to simplify and streamline the web-building process. Hello Biz also integrates with Elementor’s premium features, giving you access to tools like AI, and accessibility enhancements in one place. Whether launching a startup site or refining a company portfolio, Hello Biz offers a solid, responsive foundation for all web creators. Report security bugs through the Patchstack Vulnerability Disclosure Program. The Patchstack team validates, triages, and handles vulnerabilities. Report here: https://patchstack.com/database/wordpress/theme/hello-biz/vdp.
Tags: flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready,style-variations
Version: 1.2.0.1759822613
Updated: 2025-10-07 07:36:53

*/
/* =========================================
   Base theme — Osaka Drive Legends (standard tags)
   ========================================= */
/* ===============================
   Osaka Drive Legends – Core Design System (Dark)
   Goal: cohesive tokens + components; NO radius change on click
   =============================== */

/* ---------- Tokens ---------- */
:root{
  /* Color */
  --bg: #0c0d0e;
  --surface-0: #0f1113;
  --surface-1: #111418;
  --surface-2: #151a1f;
  --text: #e9edf1;
  --text-weak: #c9d1d9;
  --muted: #9aa3ad;
  --border: rgba(255,255,255,.16);
  --focus: rgba(200,16,46,.28);
  --accent: #c8102e;       /* primary red */
  --accent-600:#a80e26;    /* hover */
  --accent-700:#8f0c21;    /* active */
  --success:#12b886;
  --warn:#f59e0b;
  --error:#ef4444;
  --info:#60a5fa;

  /* Typography */
  --font-sans: "Poppins", system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans",Arial,sans-serif;
  --fs-xxl: clamp(2.25rem, 4vw, 3.25rem);
  --fs-xl: clamp(1.75rem, 3vw, 2.25rem);
  --fs-lg: clamp(1.35rem, 2.2vw, 1.6rem);
  --fs-md: 1rem;
  --fs-sm: .92rem;
  --fs-xs: .84rem;

  /* Layout */
  --radius: 12px;
  --radius-sm: 10px;
  --radius-pill: 9999px;
  --shadow-1: 0 8px 24px rgba(0,0,0,.32);
  --shadow-2: 0 16px 40px rgba(0,0,0,.4);
  --sp-1: .5rem;  --sp-2: .75rem; --sp-3: 1rem; --sp-4: 1.5rem; --sp-5: 2rem;

  /* Transitions */
  --t-fast: .15s ease;
  --t-med: .25s ease;
}

/* ---------- Resets / base ---------- */
html{box-sizing:border-box;font-size:16px;scroll-behavior:smooth;}
*,*::before,*::after{box-sizing:inherit;}
* { -webkit-tap-highlight-color: transparent; }         /* kill mobile tap highlight */

body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font: 400 16px/1.6 var(--font-sans);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}

/* Typography */
h1,h2,h3,h4,h5,h6{margin:0 0 .6em;color:#fff;line-height:1.15;font-weight:700;letter-spacing:-.01em;}
h1{font-size:var(--fs-xxl);}
h2{font-size:var(--fs-xl);}
h3{font-size:var(--fs-lg);}
h4{font-size:1.125rem;}
h5{font-size:1rem;}
h6{font-size:.95rem;color:var(--muted);font-weight:600;}
p{margin:0 0 1rem;}
small{font-size:var(--fs-sm);color:var(--muted);}
strong,b{font-weight:700;}
hr{border:0;border-top:1px solid var(--border);margin:var(--sp-5) 0;opacity:.9;}
blockquote{
  margin:var(--sp-3) 0; padding: var(--sp-2) var(--sp-3);
  border-left:3px solid var(--accent);
  background:var(--surface-1); border-radius:0 var(--radius) var(--radius) 0;
}

/* Links */
a{color:var(--text);text-decoration:none;transition:color var(--t-fast),opacity var(--t-fast);}
a:hover{color:var(--accent);}
a:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--radius);} /* keep radius consistent */

/* ---------- Containers / surfaces ---------- */
.container{max-width:1200px;margin:0 auto;padding:0 var(--sp-3);}
.section{padding: var(--sp-5) 0;}
.card{
  background:var(--surface-1);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:var(--sp-4);
  box-shadow:var(--shadow-1);
}

/* ---------- Buttons (native + utilities) ----------
   IMPORTANT: Radius never changes on :hover/:active/:focus */
button,
input[type="button"],
input[type="submit"],
input[type="reset"],
.btn{
  appearance:none;
  border:1px solid var(--accent);
  background:var(--accent);
  color:#fff;
  padding:.85rem 1.25rem;
  border-radius:var(--radius-pill);             /* pill by default */
  font-weight:600; line-height:1;
  cursor:pointer;
  transition: background var(--t-fast), border-color var(--t-fast), transform .06s ease-in-out, box-shadow var(--t-fast);
}
button:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
.btn:hover{
  background:var(--accent-600);
  border-color:var(--accent-600);
}
button:active,
input[type="submit"]:active,
.btn:active{ transform: translateY(1px); }
button:focus-visible,
input[type="submit"]:focus-visible,
.btn:focus-visible{
  outline:none;
  box-shadow:0 0 0 3px var(--focus);
  border-radius:var(--radius-pill);            /* ensure radius persists on focus */
}

/* Secondary / Ghost variants */
.btn--secondary{
  background:transparent !important;
  color:#fff !important;
  border:1px solid var(--accent) !important;
  border-radius:var(--radius-pill);            /* fixed */
}
.btn--secondary:hover{background:rgba(200,16,46,.12) !important;}
.btn--ghost{
  background:transparent;border-color:transparent;color:var(--text);
}
.btn--ghost:hover{background:rgba(255,255,255,.06);}

/* Square option (if needed) – still consistent across states */
.btn--square{ border-radius:var(--radius) !important; }
.btn--square:focus-visible{ border-radius:var(--radius) !important; }

/* Remove legacy inner focus padding in Firefox */
button::-moz-focus-inner{border:0;padding:0;}

/* ---------- Forms ---------- */
label{display:block;margin:0 0 .4rem;color:var(--muted);font-size:.95rem;}
input, select, textarea{
  width:100%; background:var(--surface-2); color:var(--text);
  border:1px solid var(--border); border-radius:var(--radius-sm);
  padding:.75rem .9rem; transition:border-color var(--t-fast), box-shadow var(--t-fast), background var(--t-fast);
}
input::placeholder, textarea::placeholder{color:var(--muted);}
input:focus, select:focus, textarea:focus{
  outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--focus);
  border-radius:var(--radius-sm);              /* LOCK radius on focus */
}
fieldset{border:1px solid var(--border);border-radius:var(--radius);padding:var(--sp-3);}
legend{padding:0 var(--sp-2);color:var(--text-weak);}

/* Checkboxes & radios (minimal) */
input[type="checkbox"], input[type="radio"]{width:auto;accent-color:var(--accent);}

/* WebKit autofill on dark */
input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill{
  -webkit-text-fill-color: var(--text);
  -webkit-box-shadow: 0 0 0 1000px var(--surface-2) inset;
  transition: background-color 5000s ease-in-out 0s;
}

/* ---------- Tables ---------- */
table{width:100%;border-collapse:collapse;background:transparent;color:var(--text);}
th, td{padding:.9rem;border-bottom:1px solid var(--border);}
thead th{color:#fff;font-weight:700;}
tbody tr:hover{background:rgba(255,255,255,.04);}

/* ---------- Badges / Pills ---------- */
.badge{
  display:inline-block;padding:.35rem .6rem;border-radius:9999px;font-size:var(--fs-xs);
  border:1px solid var(--border);background:var(--surface-2);color:var(--text-weak);
}
.badge--accent{border-color:var(--accent);color:#fff;background:rgba(200,16,46,.12);}

/* ---------- Alerts ---------- */
.alert{
  padding: .9rem 1rem; border-radius:var(--radius); border:1px solid var(--border);
  background:var(--surface-1); color:var(--text);
}
.alert--success{border-color:var(--success); background:rgba(18,184,134,.1); color:#b6f3e0;}
.alert--warn{border-color:var(--warn); background:rgba(245,158,11,.1); color:#ffd89a;}
.alert--error{border-color:var(--error); background:rgba(239,68,68,.1); color:#ffb4b4;}
.alert--info{border-color:var(--info); background:rgba(96,165,250,.12); color:#cfe3ff;}

/* ---------- Pagination ---------- */
.pagination{display:flex;gap:.4rem;align-items:center;flex-wrap:wrap;}
.pagination a,
.pagination button{
  border:1px solid var(--border); background:transparent; color:#fff;
  padding:.55rem .85rem; border-radius:var(--radius-sm); transition:background var(--t-fast),border-color var(--t-fast);
}
.pagination a:hover{background:rgba(255,255,255,.06);}
.pagination .is-active{background:var(--accent);border-color:var(--accent);}

/* ---------- Modals (basic shell) ---------- */
.modal-backdrop{
  position:fixed;inset:0;background:rgba(0,0,0,.55);display:none;z-index:1000;
}
.modal{position:fixed;inset:0;display:none;place-items:center;z-index:1001;}
.modal.is-open,.modal-backdrop.is-open{display:grid;}
.modal__panel{
  width:min(720px, 92vw); background:var(--surface-1); border:1px solid var(--border);
  border-radius:var(--radius); box-shadow:var(--shadow-2); padding:var(--sp-4);
}

/* ---------- Images ---------- */
img{max-width:100%;height:auto;border-radius:var(--radius-sm);box-shadow:0 6px 16px rgba(0,0,0,.35);}

/* ---------- Utilities ---------- */
.text-muted{color:var(--muted);}
.text-accent{color:var(--accent);}
.surface{background:var(--surface-1);border:1px solid var(--border);border-radius:var(--radius);}
.no-radius{border-radius:0 !important;}                 /* for rare square needs */
.mt-0{margin-top:0}.mb-0{margin-bottom:0}.mt-1{margin-top:var(--sp-1)}.mb-1{margin-bottom:var(--sp-1)}
.mt-2{margin-top:var(--sp-2)}.mb-2{margin-bottom:var(--sp-2)}.mt-3{margin-top:var(--sp-3)}.mb-3{margin-bottom:var(--sp-3)}

/* ---------- Responsive tweaks ---------- */
@media (max-width: 767px){
  :root{font-size:15px;}
  .card{padding:var(--sp-3);}
  .modal__panel{padding:var(--sp-3);}
}