/* Clipsly — from clipsly-design/Clipsly.dc.html <helmet> */

*,*::before,*::after{box-sizing:border-box;}
    body{margin:0;background:#FFFFFF;color:#18181B;font-family:'Inter',sans-serif;-webkit-font-smoothing:antialiased;}
    ::selection{background:#E11D48;color:#fff;}
    img{display:block;max-width:100%;height:auto;}
    input,textarea,select{font-family:'Inter',sans-serif;color-scheme:light;}
    @keyframes fadeUp{from{opacity:0;transform:translateY(24px);}to{opacity:1;transform:translateY(0);}}
    .desk-nav{display:flex;align-items:center;gap:2px;}
    .desk-only{display:inline-flex;}
    .mob-btn{display:none;background:none;border:none;cursor:pointer;color:#18181B;font-size:26px;line-height:1;padding:6px;}
    .feat-row{display:flex;gap:72px;align-items:center;}
    .feat-row-rev{display:flex;gap:72px;align-items:center;flex-direction:row-reverse;}
    .feat-img-wrap{flex:0 0 48%;min-width:0;}
    .feat-body{flex:1 1 0;min-width:0;}
    .grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
    .grid-2{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;}
    .grid-price{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;align-items:start;max-width:760px;margin:0 auto;}
    .blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;}
    .team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
    .stats-flex{display:flex;gap:56px;flex-wrap:wrap;}
    .cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;}
    .footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;}
    .results-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
    .clip-carousel-track{scrollbar-width:none;-ms-overflow-style:none;}
    .clip-carousel-track::-webkit-scrollbar{display:none;}
    @media(max-width:960px){
      .results-gallery{grid-template-columns:repeat(2,1fr)!important;}
      .desk-nav{display:none!important;}
      .desk-only{display:none!important;}
      .mob-btn{display:flex!important;}
      .feat-row,.feat-row-rev{flex-direction:column!important;gap:36px!important;}
      .feat-img-wrap{flex:none!important;width:100%!important;}
      .grid-3,.grid-price,.blog-grid,.team-grid{grid-template-columns:1fr!important;}
      .grid-2{grid-template-columns:1fr!important;gap:32px!important;}
      .footer-grid{grid-template-columns:1fr 1fr!important;gap:28px!important;}
      .stats-flex{gap:28px!important;}
    }
    @media(max-width:520px){
      .footer-grid{grid-template-columns:1fr!important;}
      .cal-grid{grid-template-columns:repeat(6,1fr)!important;}
    }

/* WordPress additions */
/* WordPress theme layer (not in Clipsly.dc.html helmet) */
body.pp-body {
  margin: 0 !important;
  padding: 0 !important;
}

.pp-page-shell {
  min-height: 100vh;
}

.pp-page {
  overflow-x: hidden;
  color: #18181B;
}

.pp-page button,
.pp-page a[style*="background:#"] {
  cursor: pointer;
}

/* Hero: grid inside flex section (design uses inline width:100% on .hero-grid) */
.pp-hero-section {
  display: flex !important;
  align-items: center;
  width: 100%;
}

.grid-2.hero-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 48px !important;
  flex: 1 1 100%;
  min-width: 0;
  align-self: stretch;
}

.grid-2.hero-grid > div {
  min-width: 0;
}

#hero-visual {
  min-width: 0;
}

@media (max-width: 960px) {
  .pp-hero-section {
    min-height: auto !important;
    align-items: flex-start !important;
    padding: 24px 0 56px;
  }

  .pp-hero-section #orb1,
  .pp-hero-section #orb2 {
    opacity: 0.45;
    transform: none;
  }

  .pp-hero-section #orb1 {
    right: -280px;
    top: -120px;
    width: 420px;
    height: 420px;
  }

  .pp-hero-section #orb2 {
    left: -200px;
    bottom: -120px;
    width: 320px;
    height: 320px;
  }

  .grid-2.hero-grid {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
    padding: 0 20px !important;
  }

  #hero-h1 {
    font-size: clamp(32px, 9.5vw, 44px) !important;
    line-height: 1.05 !important;
    margin-bottom: 20px !important;
  }

  #hero-sub {
    max-width: none !important;
    margin-bottom: 28px !important;
  }

  #hero-cta {
    flex-direction: column;
    align-items: stretch;
    margin-bottom: 32px !important;
  }

  #hero-cta a {
    width: 100%;
    text-align: center;
    box-sizing: border-box;
  }

  .pp-hero-stats {
    gap: 20px 28px !important;
  }

  .pp-hero-stats > div[style*="width:1px"] {
    display: none;
  }

  #hero-visual {
    margin-top: 4px;
    padding-bottom: 32px;
  }

  .pp-hero-badge-float {
    right: auto !important;
    left: 50%;
    transform: translateX(-50%);
    bottom: -14px !important;
    white-space: nowrap;
  }
}

@media (max-width: 520px) {
  .grid-2.hero-grid {
    padding: 0 16px !important;
    gap: 24px !important;
  }

  #hero-badge {
    margin-bottom: 20px !important;
  }

  #hero-h1 {
    font-size: clamp(28px, 8.8vw, 36px) !important;
  }

  .pp-hero-stats {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px !important;
  }

  .pp-hero-stats > div:not([style*="width:1px"]) {
    text-align: center;
  }
}

/* Header nav (design uses dynamic nl/mnl button styles) */
.pp-logo {
  display: flex;
  align-items: center;
  text-decoration: none;
  flex-shrink: 0;
}

.pp-logo-img {
  display: block;
  height: 36px;
  width: auto;
  max-width: min(140px, 32vw);
  object-fit: contain;
}

.pp-logo-img--footer {
  height: 32px;
  max-width: 140px;
}

.pp-nav-links--desktop .pp-nav-link {
  background: none;
  border: none;
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 400;
  color: #6B7280;
  letter-spacing: 0.01em;
  padding: 6px 12px;
  text-decoration: none;
  white-space: nowrap;
  border-radius: 2px;
}

.pp-nav-links--desktop .pp-nav-link:hover,
.pp-nav-links--desktop .pp-nav-link--active {
  color: #18181B;
  font-weight: 600;
}

.pp-nav-mobile {
  display: none;
  flex-direction: column;
  background: #FFFFFF;
  border-top: 1px solid #E5E7EB;
  padding: 8px 32px 24px;
}

.pp-nav-mobile--open {
  display: flex;
}

.pp-nav-mobile .pp-nav-link {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #18181B;
  padding: 14px 0;
  border-bottom: 1px solid #E5E7EB;
  text-decoration: none;
}

.pp-nav-mobile .pp-nav-link--active {
  color: #E11D48;
  font-weight: 600;
}

.pp-nav-cta--mobile {
  display: block;
  margin-top: 20px;
  width: 100%;
  background: #E11D48;
  color: #fff !important;
  padding: 14px;
  font-family: 'Archivo', sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border-radius: 2px;
  text-align: center;
  text-decoration: none;
}

body.pp-nav-open {
  overflow: hidden;
}

@media (min-width: 961px) {
  .pp-nav-toggle {
    display: none !important;
  }

  .pp-nav-mobile {
    display: none !important;
  }
}

footer a:hover {
  color: #F4F4F5 !important;
  opacity: 1;
}

footer h4 {
  color: #3F3F46 !important;
}

.faq-header {
  cursor: pointer;
}

.pp-cf7-wrap .wpcf7-form {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.pp-cf7-wrap input[type="text"],
.pp-cf7-wrap input[type="email"],
.pp-cf7-wrap textarea {
  width: 100%;
  background: #FFFFFF;
  border: 1px solid #E5E7EB;
  color: #18181B;
  padding: 14px 16px;
  font-size: 15px;
  border-radius: 2px;
  outline: none;
}

.pp-cf7-wrap input[type="submit"] {
  background: #E11D48;
  color: #fff;
  padding: 16px;
  font-family: 'Archivo', sans-serif;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border: none;
  cursor: pointer;
  border-radius: 2px;
}