/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Aug 17 2026 | 20:40:05 */
/* =========================================

   TWS DEVELOPMENT LLC — CUSTOM THEME STYLE

   ========================================= */

:root {

  --tws-black: #080a09;

  --tws-dark: #111411;

  --tws-charcoal: #1a1e1a;

  --tws-green: #8dc63f;

  --tws-green-bright: #9bdd38;

  --tws-white: #ffffff;

  --tws-light: #f4f6f1;

  --tws-gray: #b9bdb7;

}

/* ---------- GLOBAL ---------- */

html {

  scroll-behavior: smooth;

}

body {

  background: var(--tws-white);

  color: #171917;

  font-family: Arial, Helvetica, sans-serif;

}

h1,

h2,

h3,

h4 {

  font-weight: 900;

  letter-spacing: -0.025em;

}

p {

  line-height: 1.65;

}

a {

  transition: all 0.2s ease;

}

/* ---------- HEADER ---------- */

header.wp-block-template-part {

  position: sticky;

  top: 0;

  z-index: 999;

}

header .wp-block-group.alignfull {

  background:

    linear-gradient(

      90deg,

      #080a09 0%,

      #111511 55%,

      #172014 100%

    ) !important;

  box-shadow: 0 6px 25px rgba(0,0,0,0.24);

}

header h3 {

  font-size: 25px;

  margin: 0;

  letter-spacing: -1px;

}

header nav a {

  color: #fff !important;

  font-size: 15px;

  font-weight: 700;

  text-transform: uppercase;

  letter-spacing: 0.6px;

}

header nav a:hover {

  color: var(--tws-green) !important;

}

.tws-accent-line {

  height: 4px;

  background:

    linear-gradient(

      90deg,

      transparent,

      var(--tws-green),

      var(--tws-green-bright),

      var(--tws-green),

      transparent

    );

}

/* ---------- BUTTONS ---------- */

.wp-block-button__link {

  border-radius: 5px !important;

  padding: 15px 26px !important;

  font-weight: 900 !important;

  text-transform: uppercase;

  letter-spacing: 0.3px;

  transition: all 0.25s ease;

}

.wp-block-button__link:hover {

  transform: translateY(-3px);

  box-shadow: 0 12px 24px rgba(0,0,0,0.2);

}

.has-green-background-color.wp-block-button__link {

  background:

    linear-gradient(

      135deg,

      #9adb3c,

      #7db82e

    ) !important;

}

.is-style-outline .wp-block-button__link {

  border: 2px solid #fff !important;

}

.is-style-outline .wp-block-button__link:hover {

  background: var(--tws-green) !important;

  border-color: var(--tws-green) !important;

  color: var(--tws-black) !important;

}

/* ---------- HERO ---------- */

.tws-hero {

  position: relative;

  overflow: hidden;

  background:

    radial-gradient(

      circle at 85% 15%,

      rgba(141,198,63,0.32),

      transparent 34%

    ),

    radial-gradient(

      circle at 70% 80%,

      rgba(82,125,36,0.15),

      transparent 35%

    ),

    linear-gradient(

      135deg,

      #080a09 0%,

      #121612 48%,

      #0c0f0c 100%

    ) !important;

}

.tws-hero::before {

  content: "";

  position: absolute;

  inset: 0;

  background-image:

    linear-gradient(

      rgba(255,255,255,0.025) 1px,

      transparent 1px

    ),

    linear-gradient(

      90deg,

      rgba(255,255,255,0.025) 1px,

      transparent 1px

    );

  background-size: 45px 45px;

  pointer-events: none;

}

.tws-hero > * {

  position: relative;

  z-index: 2;

}

.tws-hero h1 {

  text-shadow: 0 5px 20px rgba(0,0,0,0.45);

}

.tws-hero h1 span {

  color: var(--tws-green) !important;

}

.tws-hero p {

  max-width: 760px;

}

/* ---------- HERO INFO BOX ---------- */

.tws-hero .has-charcoal-background-color {

  background:

    linear-gradient(

      145deg,

      rgba(29,34,29,0.97),

      rgba(16,19,16,0.97)

    ) !important;

  border: 1px solid rgba(141,198,63,0.18);

  box-shadow: 0 22px 50px rgba(0,0,0,0.35);

}

.tws-hero .has-charcoal-background-color h3 {

  color: var(--tws-green) !important;

}

.tws-hero li {

  margin-bottom: 10px;

}

/* ---------- SERVICES ---------- */

#services {

  background:

    linear-gradient(

      180deg,

      #f8faf5 0%,

      #eef2e9 100%

    ) !important;

}

#services > h2 {

  position: relative;

}

#services > h2::after {

  content: "";

  display: block;

  width: 85px;

  height: 5px;

  margin: 16px auto 0;

  background: var(--tws-green);

  border-radius: 10px;

}

.tws-card {

  height: 100%;

  position: relative;

  overflow: hidden;

  background:

    linear-gradient(

      160deg,

      #ffffff 0%,

      #f5f7f2 100%

    ) !important;

  border: 1px solid rgba(0,0,0,0.05);

  box-shadow: 0 10px 30px rgba(0,0,0,0.08);

  transition:

    transform 0.25s ease,

    box-shadow 0.25s ease;

}

.tws-card::before {

  content: "";

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 5px;

  background: var(--tws-green);

}

.tws-card:hover {

  transform: translateY(-8px);

  box-shadow: 0 22px 45px rgba(0,0,0,0.15);

}

.tws-card h3 {

  font-size: 26px;

  margin-top: 5px;

}

.tws-card p {

  color: #525752;

}

/* ---------- WHY TWS ---------- */

#why-tws {

  position: relative;

  background:

    radial-gradient(

      circle at 20% 20%,

      rgba(141,198,63,0.13),

      transparent 28%

    ),

    linear-gradient(

      145deg,

      #080a09,

      #141814

    ) !important;

}

#why-tws h2 {

  max-width: 900px;

  margin-left: auto;

  margin-right: auto;

}

#why-tws h3 {

  font-size: 25px;

}

#why-tws .wp-block-column {

  padding: 22px;

  border-left: 3px solid var(--tws-green);

  background: rgba(255,255,255,0.025);

}

/* ---------- CONTACT CTA ---------- */

#contact {

  position: relative;

  background:

    linear-gradient(

      135deg,

      #9bdd38,

      #7cb82e

    ) !important;

  overflow: hidden;

}

#contact::after {

  content: "TWS";

  position: absolute;

  right: -10px;

  bottom: -80px;

  font-size: 260px;

  font-weight: 900;

  line-height: 1;

  color: rgba(0,0,0,0.07);

  pointer-events: none;

}

#contact > * {

  position: relative;

  z-index: 2;

}

/* ---------- FOOTER ---------- */

footer {

  background:

    linear-gradient(

      135deg,

      #080a09,

      #121612

    );

}

footer h3 {

  font-size: 28px;

}

footer h4 {

  text-transform: uppercase;

  letter-spacing: 1px;

}

footer a {

  color: var(--tws-green) !important;

}

footer a:hover {

  color: #fff !important;

}

/* ---------- MOBILE ---------- */

@media (max-width: 900px) {

  .tws-hero {

    padding-top: 70px !important;

    padding-bottom: 70px !important;

  }

  .tws-hero h1 {

    font-size: clamp(44px, 12vw, 72px) !important;

  }

  .tws-hero .wp-block-columns {

    gap: 40px;

  }

  #services .wp-block-columns,

  #why-tws .wp-block-columns {

    flex-wrap: wrap !important;

  }

  #services .wp-block-column,

  #why-tws .wp-block-column {

    flex-basis: 46% !important;

  }

}

/* ---------- PHONE ---------- */

@media (max-width: 600px) {

  header nav {

    display: none;

  }

  header h3 {

    font-size: 19px;

  }

  .tws-hero {

    padding-top: 55px !important;

    padding-bottom: 55px !important;

  }

  .tws-hero h1 {

    font-size: 48px !important;

  }

  .tws-hero p {

    font-size: 18px !important;

  }

  .wp-block-buttons {

    width: 100%;

  }

  .wp-block-button {

    width: 100%;

  }

  .wp-block-button__link {

    width: 100%;

    box-sizing: border-box;

    text-align: center;

  }

  #services .wp-block-column,

  #why-tws .wp-block-column {

    flex-basis: 100% !important;

  }

  #contact h2 {

    font-size: 36px !important;

  }

}
