:root {
    --ws-bg: #0a0c10;
    --ws-panel: #1a1f2e;
    --ws-panel-hover: #262d3f;
    --ws-gold: #c9a84c;
    --ws-gold-light: #e8c97a;
    --ws-text: #f4f1ea;
    --ws-muted: #8a94a8;
    --ws-line: rgba(255, 255, 255, .08);
}
html {
    scroll-behavior: smooth;
    scroll-padding-top: 76px;
}
body {
    font-family: 'DM Sans', sans-serif;
    background: var(--ws-bg);
    color: var(--ws-text);
    line-height: 1.7;
}
.ws-navbar {
    background: rgba(10, 12, 16, .92);
    border-bottom: 1px solid var(--ws-line);
    backdrop-filter: blur(12px);
    padding: .95rem 0;
}
.ws-logo {
    font-weight: 600;
    color:  #c9a84c !important;
    text-decoration: none;
    letter-spacing: -.03em;
    font-size: 1.25rem;
}
.navbar .nav-link {
    color: rgba(244, 241, 234, .75);
    font-size: .82rem;
    text-transform: uppercase;
    letter-spacing: .08em;
}
.navbar .nav-link:hover {
    color: var(--ws-gold);
}
.btn {
    border-radius: 0;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: .76rem;
    font-weight: 600;
    padding: .85rem 1.4rem;
}
.btn-gold {
    background: var(--ws-gold);
    border-color: var(--ws-gold);
    color: var(--ws-bg);
}
.btn-gold:hover, .btn-gold:focus {
    background: var(--ws-gold-light);
    border-color: var(--ws-gold-light);
    color: var(--ws-bg);
    transform: translateY(-1px);
}
.hero-section {
    min-height: 100vh;
    padding: 140px 0 90px;
    position: relative;
    overflow: hidden;
    background: radial-gradient(circle at 80% 30%, rgba(201, 168, 76, .11), transparent 31%);
}
.hero-grid, .cta-grid {
    position: absolute;
    inset: 0;
    background-image: linear-gradient(rgba(201, 168, 76, .035) 1px, transparent 1px), linear-gradient(90deg, rgba(201, 168, 76, .035) 1px, transparent 1px);
    background-size: 60px 60px;
    mask-image: linear-gradient(to bottom, black, transparent);
}
.eyebrow {
    display: flex;
    align-items: center;
    gap: .75rem;
    color: var(--ws-gold);
    font-size: .68rem;
    text-transform: uppercase;
    letter-spacing: .2em;
    margin-bottom: 1.3rem;
}
.eyebrow span {
    display: block;
    width: 24px;
    height: 1px;
    background: var(--ws-gold);
}
h1, h2, .ai-quote {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-weight: 400;
    line-height: 1.05;
}
h1 {
    font-size: clamp(3.4rem, 7vw, 7rem);
}
h2 {
    font-size: clamp(2.7rem, 5vw, 4.4rem);
}
h1 em, h2 em {
    color: var(--ws-gold);
    font-weight: 400;
}
.hero-copy, .section-intro, .lead-copy {
    color: var(--ws-muted);
    font-size: 1.05rem;
    max-width: 700px;
}
.stat-card {
    background: rgba(26, 31, 46, .82);
    border: 1px solid var(--ws-line);
    padding: 2rem 1.25rem;
    min-height: 170px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.stat-card strong {
    font-family: 'Cormorant Garamond', serif;
    font-size: 3.2rem;
    font-weight: 400;
    line-height: 1;
    color: #fff;
}
.stat-card strong small {
    font-size: 25px;
    color: var(--ws-gold);
    margin-left: .15rem;
}
.stat-card span {
    color: var(--ws-muted);
    font-size: .76rem;
    margin-top: .8rem;
}
.section-padding {
    padding: 110px 0;
}
.section-alt {
    background: var(--ws-panel);
}
.feature-grid, .pricing-grid {
    border: 1px solid var(--ws-line);
}
.feature-card, .pricing-card {
    position: relative;
    padding: 2.4rem 2rem;
    background: var(--ws-bg);
    border-right: 1px solid var(--ws-line);
    border-bottom: 1px solid var(--ws-line);
    transition: .25s;
}
.feature-card:hover, .pricing-card:hover {
    background: var(--ws-panel-hover);
}
.feature-card i {
    font-size: 1.8rem;
    color: var(--ws-gold);
}
.feature-number {
    position: absolute;
    right: 1.4rem;
    top: 1.2rem;
    color: rgba(201, 168, 76, .45);
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.3rem;
}
.feature-card h3, .steps h3, .pricing-card h3 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.55rem;
    font-weight: 500;
    margin-top: 1.3rem;
}
.feature-card p, .steps p, .pricing-card p, .ai-section p {
    color: var(--ws-muted);
    font-size: .88rem;
}
.step {
    display: flex;
    gap: 1.5rem;
    padding: 1.5rem 0;
    border-top: 1px solid var(--ws-line);
}
.step>span {
    color: var(--ws-gold);
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.4rem;
}
.step h3 {
    margin-top: 0;
    margin-bottom: .25rem;
}
.bonus-box {
    border-left: 2px solid var(--ws-gold);
    background: rgba(201, 168, 76, .07);
    padding: 1.3rem 1.5rem;
    margin-top: 1.5rem;
}
.bonus-box strong {
    color: var(--ws-gold);
}
.bonus-box p {
    color: var(--ws-muted);
    font-size: .85rem;
    margin: .35rem 0 0;
}
.form-preview {
    background: #f5f3ef;
    color: #161922;
    box-shadow: 0 30px 70px rgba(0, 0, 0, .35);
}
.preview-bar {
    height: 48px;
    background: #171b27;
    padding: 0 1rem;
    display: flex;
    align-items: center;
    gap: .45rem;
}
.preview-bar span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--ws-gold);
}
.preview-bar small {
    margin-left: .6rem;
    color: rgba(255, 255, 255, .55);
    font-size: .68rem;
}
.form-preview .form-label {
    font-size: .7rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: #636a78;
}
.form-preview .form-control {
    border-radius: 0;
    border-color: #d9d9d9;
    background: #fff;
    padding: .75rem;
}
.privacy-note {
    text-align: center;
    color: #737987;
    font-size: .7rem;
    margin: 1.2rem 0 0;
}
.ai-section {
    background: linear-gradient(135deg, #111521, #20283b);
}
.ai-quote {
    font-size: clamp(3rem, 5.5vw, 5.8rem);
    color: #fff;
}
.ai-list li {
    padding: .45rem 0;
    color: #d3d7df;
    font-size: .9rem;
}
.ai-list li::first-letter {
    color: var(--ws-gold);
}
.plan-label {
    color: var(--ws-gold);
    font-size: .65rem;
    text-transform: uppercase;
    letter-spacing: .15em;
}
.pricing-card {
    padding: 2.7rem 2rem;
}
.pricing-card p {
    min-height: 82px;
}
.pricing-card.popular {
    background: var(--ws-panel);
    border-top: 2px solid var(--ws-gold);
}
.price {
    font-family: 'Cormorant Garamond', serif;
    font-size: 3.8rem;
    line-height: 1;
    margin-top: 1.8rem;
}
.price sup {
    font-size: 1.5rem;
    color: var(--ws-gold);
}
.price.custom {
    font-size: 2.6rem;
    margin-top: 2.3rem;
}
.pricing-card small {
    color: var(--ws-muted);
}
.ws-accordion .accordion-item {
    background: transparent;
    border: 1px solid var(--ws-line);
    margin-bottom: 1rem;
}
.ws-accordion .accordion-button {
    background: var(--ws-panel);
    color: #fff;
    border-radius: 0!important;
    box-shadow: none;
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.25rem;
}
.ws-accordion .accordion-button:not(.collapsed) {
    color: var(--ws-gold);
    background: var(--ws-panel-hover);
}
.ws-accordion .accordion-button::after {
    filter: invert(1);
}
.ws-accordion .accordion-body {
    background: var(--ws-bg);
    color: var(--ws-muted);
    font-size: .88rem;
}
.final-cta {
    position: relative;
    overflow: hidden;
}
.final-cta p, .final-cta small {
    color: var(--ws-muted);
}
.ws-footer {
    background: var(--ws-panel);
    border-top: 1px solid var(--ws-line);
    padding: 2.5rem 0;
    color: var(--ws-muted);
    font-size: .74rem;
}
.ws-footer a {
    color: var(--ws-muted);
    text-decoration: none;
    margin-left: 1rem;
}
.ws-footer a:hover {
    color: var(--ws-gold);
}
@media(max-width:991.98px) {
    .ws-navbar .navbar-collapse {
    padding: 1rem 0;
}
.hero-section {
    min-height: auto;
}
.section-padding {
    padding: 80px 0;
}
.stat-card {
    min-height: 145px;
}
.pricing-card p {
    min-height: auto;
}
.navbar .btn {
    margin-top: .75rem;
}
}
@media(max-width:575.98px) {
    h1 {
    font-size: 3.2rem;
}
.hero-section {
    padding-top: 120px;
}
.btn-lg {
    width: 100%}
.stat-card {
    padding: 1.4rem .9rem;
    min-height: 130px;
}
.stat-card strong {
    font-size: 2.5rem;
}
.feature-card, .pricing-card {
    padding: 2rem 1.4rem;
}
.section-padding {
    padding: 65px 0;
}
.ws-footer {
    text-align: center;
}
.ws-footer a {
    margin: 0 .45rem;
}
}

/* Watch Demo modal */
.ws-demo-modal .modal-content  {
    
  background:  #0d223a;
    
  color:  #eef3f8;
    
  border:  1px solid rgba(220,  181,  101,  .38);
    
  border-radius:  18px;
    
  box-shadow:  0 30px 90px rgba(0,  0,  0,  .55);
    
}
.ws-demo-modal .btn-close  {
    
  position:  absolute;
    
  top:  18px;
    
  right:  18px;
    
  z-index:  2;
    
}
.ws-demo-modal .modal-title  {
     font-size:  clamp(2rem,  5vw,  3rem);
 }

.ws-demo-modal .form-label  {
     color:  #f6f8fb;
     font-weight:  600;
 }

.ws-demo-modal .form-control  {
    
  min-height:  52px;
    
  background:  rgba(255,  255,  255,  .07);
    
  border-color:  rgba(255,  255,  255,  .2);
    
  color:  #fff;
    
}
.ws-demo-modal .form-control: focus  {
    
  background:  rgba(255,  255,  255,  .1);
    
  border-color:  #dcb565;
    
  box-shadow:  0 0 0 .25rem rgba(220,  181,  101,  .16);
    
  color:  #fff;
    
}
.ws-demo-modal .form-control: -webkit-autofill  {
    
  -webkit-text-fill-color:  #fff;
    
  transition:  background-color 9999s ease-in-out 0s;
    
}
.ws-demo-modal .alert-danger  {
    
  color:  #ffd9dd;
    
  background:  rgba(220,  53,  69,  .15);
    
  border-color:  rgba(220,  53,  69,  .35);
    
}
.thank-you-icon  {
    
  width:  76px;
    
  height:  76px;
    
  display:  inline-grid;
    
  place-items:  center;
    
  border-radius:  50%;
    
  margin-bottom:  24px;
    
  background:  #dcb565;
    
  color:  #0d223a;
    
  font-size:  2.2rem;
    
}
