/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Mar 17 2026 | 02:19:46 */
 :root {
      --bg: #08111f;
      --bg-soft: #0d1728;
      --card: #101c31;
      --card-2: #13223c;
      --line: rgba(255,255,255,0.08);
      --text: #eaf2ff;
      --muted: #aebbd3;
      --primary: #37c8ff;
      --primary-2: #7af0d2;
      --accent: #ffd166;
      --danger: #ff7b7b;
      --success: #79f2b6;
      --shadow: 0 20px 60px rgba(0,0,0,0.35);
      --radius: 22px;
      --max: 1180px;
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      font-family: Inter, Arial, Helvetica, sans-serif;
      background:
        radial-gradient(circle at top right, rgba(55,200,255,0.12), transparent 28%),
        radial-gradient(circle at top left, rgba(122,240,210,0.08), transparent 22%),
        linear-gradient(180deg, #07101d 0%, #091321 50%, #07101c 100%);
      color: var(--text);
      line-height: 1.65;
    }

    a { color: inherit; text-decoration: none; }
    img { max-width: 100%; display: block; }

    .container {
      width: min(var(--max), calc(100% - 32px));
      margin: 0 auto;
    }

    .topbar {
      position: sticky;
      top: 0;
      z-index: 50;
      backdrop-filter: blur(14px);
      background: rgba(8,17,31,0.75);
      border-bottom: 1px solid var(--line);
    }

    .nav {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
      padding: 14px 0;
    }

    .brand {
      display: flex;
      align-items: center;
      gap: 12px;
      font-weight: 800;
      letter-spacing: 0.4px;
    }

    .brand-badge {
      width: 38px;
      height: 38px;
      border-radius: 12px;
      background: linear-gradient(135deg, var(--primary), var(--primary-2));
      color: #04101b;
      display: grid;
      place-items: center;
      font-weight: 900;
      box-shadow: var(--shadow);
    }

    .nav-links {
      display: flex;
      gap: 18px;
      flex-wrap: wrap;
      color: var(--muted);
      font-size: 14px;
    }

    .nav-cta {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 11px 18px;
      border-radius: 999px;
      background: linear-gradient(135deg, var(--primary), var(--primary-2));
      color: #07111d;
      font-weight: 800;
      border: none;
      box-shadow: var(--shadow);
    }

    section {
      padding: 88px 0;
      position: relative;
    }

    .hero {
      padding-top: 76px;
      padding-bottom: 72px;
    }

    .hero-grid {
      display: grid;
      grid-template-columns: 1.15fr 0.85fr;
      gap: 28px;
      align-items: center;
    }

    .eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      padding: 10px 14px;
      border-radius: 999px;
      background: rgba(255,255,255,0.04);
      border: 1px solid var(--line);
      color: var(--primary-2);
      font-size: 13px;
      margin-bottom: 18px;
    }

    h1, h2, h3, h4 { margin: 0 0 14px; line-height: 1.15; }
    h1 { font-size: clamp(36px, 5vw, 66px); letter-spacing: -1.8px; }
    h2 { font-size: clamp(28px, 3vw, 42px); letter-spacing: -1px; }
    h3 { font-size: clamp(22px, 2vw, 28px); }
    h4 { font-size: 18px; }

    .lead {
      color: var(--muted);
      font-size: clamp(17px, 1.45vw, 20px);
      max-width: 760px;
    }

    .cta-row {
      display: flex;
      gap: 14px;
      flex-wrap: wrap;
      margin-top: 28px;
    }

    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      padding: 14px 22px;
      border-radius: 14px;
      font-weight: 800;
      transition: 0.25s ease;
      border: 1px solid transparent;
    }

    .btn:hover { transform: translateY(-2px); }

    .btn-primary {
      background: linear-gradient(135deg, var(--primary), var(--primary-2));
      color: #06101b;
      box-shadow: var(--shadow);
    }

    .btn-secondary {
      background: rgba(255,255,255,0.03);
      color: var(--text);
      border-color: var(--line);
    }

    .hero-card {
      background: linear-gradient(180deg, rgba(19,34,60,0.95), rgba(10,22,40,0.98));
      border: 1px solid var(--line);
      border-radius: 28px;
      box-shadow: var(--shadow);
      padding: 26px;
      overflow: hidden;
    }

    .hero-card .label {
      font-size: 13px;
      color: var(--primary-2);
      text-transform: uppercase;
      letter-spacing: 1.2px;
      margin-bottom: 10px;
    }

    .hero-metrics {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 14px;
      margin-top: 20px;
    }

    .metric {
      background: rgba(255,255,255,0.03);
      border: 1px solid var(--line);
      border-radius: 18px;
      padding: 18px;
    }

    .metric strong {
      display: block;
      font-size: 24px;
      margin-bottom: 6px;
      color: white;
    }

    .metric span {
      color: var(--muted);
      font-size: 14px;
    }

    .section-head {
      max-width: 100%;
      margin-bottom: 28px;
    }

    .section-head p {
      color: var(--muted);
      margin: 0;
    }

    .grid-2 {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 22px;
    }

    .card {
      background: linear-gradient(180deg, rgba(19,34,60,0.92), rgba(10,22,40,0.96));
      border: 1px solid var(--line);
      border-radius: var(--radius);
      padding: 26px;
      box-shadow: var(--shadow);
    }

    .card p:last-child { margin-bottom: 0; }

    .problem-list, .feature-list, .offer-list, .mini-list {
      display: grid;
      gap: 12px;
      margin-top: 18px;
    }

    .problem-item, .feature-item, .offer-item, .mini-list li {
      display: flex;
      gap: 12px;
      align-items: flex-start;
      color: var(--muted);
    }

    .dot, .tick, .num {
      flex: 0 0 auto;
      width: 28px;
      height: 28px;
      border-radius: 10px;
      display: grid;
      place-items: center;
      font-size: 14px;
      font-weight: 800;
      margin-top: 1px;
    }

    .dot { background: rgba(255,209,102,0.14); color: var(--accent); }
    .tick { background: rgba(121,242,182,0.12); color: var(--success); }
    .num { background: rgba(55,200,255,0.14); color: var(--primary); }

    .protocol-flow {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 18px;
      margin-top: 26px;
    }

    .flow-card {
      background: linear-gradient(180deg, rgba(17,30,52,0.94), rgba(10,22,40,0.96));
      border: 1px solid var(--line);
      border-radius: 20px;
      padding: 22px;
      position: relative;
      box-shadow: var(--shadow);
    }

    .flow-card h4 { margin-bottom: 10px; }
    .flow-card p { color: var(--muted); font-size: 15px; margin: 0; }

    .tools-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 22px;
    }

    .tool-card {
      background: linear-gradient(180deg, rgba(19,34,60,0.92), rgba(10,22,40,0.96));
      border: 1px solid var(--line);
      border-radius: 24px;
      padding: 26px;
      box-shadow: var(--shadow);
    }

    .tool-step {
      display: inline-flex;
      padding: 8px 12px;
      border-radius: 999px;
      background: rgba(55,200,255,0.08);
      border: 1px solid rgba(55,200,255,0.2);
      color: var(--primary);
      font-size: 13px;
      font-weight: 800;
      margin-bottom: 12px;
    }

    .tool-card p { color: var(--muted); }

    .single-cta {
      margin-top: 18px;
    }

    .proof-grid {
      display: grid;
      grid-template-columns: 1fr;
      gap: 32px;
    }

    .video-card {
      background: linear-gradient(180deg, rgba(19,34,60,0.92), rgba(10,22,40,0.96));
      border: 1px solid var(--line);
      border-radius: 24px;
      overflow: hidden;
      box-shadow: var(--shadow);
    }

    .video-thumb {
      aspect-ratio: 16 / 9;
      display: grid;
      place-items: center;
      background: linear-gradient(135deg, rgba(55,200,255,0.16), rgba(122,240,210,0.08));
      border-bottom: 1px solid var(--line);
      color: white;
      font-weight: 800;
      font-size: 20px;
    }

    .video-content {
      padding: 24px;
    }

    .video-content p { color: var(--muted); }

    .offers {
      display: grid;
      grid-template-columns: 1.15fr 0.85fr;
      gap: 24px;
      align-items: start;
    }

    .offer-stack {
      display: grid;
      gap: 18px;
    }

    .offer-card {
      background: linear-gradient(180deg, rgba(19,34,60,0.96), rgba(10,22,40,0.98));
      border: 1px solid var(--line);
      border-radius: 26px;
      padding: 26px;
      box-shadow: var(--shadow);
      position: relative;
      overflow: hidden;
    }

    .offer-card.featured {
      border-color: rgba(122,240,210,0.4);
      box-shadow: 0 24px 80px rgba(0,0,0,0.42), 0 0 0 1px rgba(122,240,210,0.12) inset;
    }

    .tag {
      display: inline-flex;
      padding: 8px 12px;
      border-radius: 999px;
      background: rgba(122,240,210,0.12);
      color: var(--primary-2);
      font-size: 12px;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: 0.8px;
      margin-bottom: 14px;
    }

    .price-row {
      display: flex;
      align-items: flex-end;
      gap: 12px;
      flex-wrap: wrap;
      margin: 16px 0 10px;
    }

    .price-now {
      font-size: clamp(32px, 4vw, 48px);
      line-height: 1;
      font-weight: 900;
      color: white;
    }

    .price-old {
      color: var(--muted);
      text-decoration: line-through;
      font-size: 18px;
      margin-bottom: 5px;
    }

    .save {
      display: inline-flex;
      padding: 7px 10px;
      border-radius: 999px;
      background: rgba(255,123,123,0.12);
      color: #ffaaaa;
      font-size: 12px;
      font-weight: 800;
      margin-bottom: 8px;
    }

    .offer-list {
      margin-top: 18px;
      margin-bottom: 20px;
    }

    .offer-card p { color: var(--muted); }

    .sticky-summary {
      position: sticky;
      top: 88px;
      background: linear-gradient(180deg, rgba(19,34,60,0.96), rgba(10,22,40,0.98));
      border: 1px solid var(--line);
      border-radius: 26px;
      padding: 26px;
      box-shadow: var(--shadow);
    }

    .sticky-summary p { color: var(--muted); }

    .mini-list {
      list-style: none;
      padding: 0;
      margin: 18px 0 22px;
    }

    .mini-list li { color: var(--muted); }

    .footer {
      padding: 32px 0 60px;
      color: var(--muted);
      border-top: 1px solid var(--line);
    }

    .muted { color: var(--muted); }

    .center { text-align: center; }

    .spacer-cta {
      margin-top: 28px;
    }

    @media (max-width: 1080px) {
      .hero-grid,
      .offers {
        grid-template-columns: 1fr;
      }

      .protocol-flow {
        grid-template-columns: repeat(2, 1fr);
      }
    }

    @media (max-width: 820px) {
      .grid-2,
      .tools-grid,
      .proof-grid,
      .protocol-flow,
      .hero-metrics {
        grid-template-columns: 1fr;
      }

      .nav {
        flex-wrap: wrap;
      }

      .nav-links {
        width: 100%;
        order: 3;
        padding-top: 6px;
      }

      section {
        padding: 72px 0;
      }

      .hero {
        padding-top: 54px;
      }
    }
/* Fix heading style for Kraken landing page */

.hero h1{
    color:#ffffff !important;
    opacity:1 !important;
    font-weight:800;
    line-height:1.1;
}

.hero p{
    color:#c7d2e0 !important;
}

.hero{
    padding-top:120px;
}

/* Fix theme overriding heading */

h1,h2,h3{
    opacity:1 !important;
}
/* FIX WORDPRESS THEME OVERRIDING HEADING */

.hero h1,
h1,
h2,
h3,
h4{
    opacity:1 !important;
    color:#ffffff !important;
}
/* Fix text width */

.hero p{
max-width: 100% !important;
}

.section-head p{
max-width: 100% !important;
}

.card p{
max-width: 100% !important;
}
/* OFFER LAYOUT FIX */

.offer-stack{
display:grid;
grid-template-columns: 1fr 1fr;
gap:24px;
}

/* first 2 options row */
.offer-card:nth-child(1),
.offer-card:nth-child(2){
grid-column:span 1;
}

/* bottom row (3 options) */
.offer-grid-bottom{
display:grid;
grid-template-columns: repeat(3,1fr);
gap:24px;
margin-top:24px;
}
.container.offers{
display:block !important;
max-width:1200px;
margin:auto;
}
.offer-stack{
display:grid;
grid-template-columns:1fr 1fr;
gap:24px;
margin-top:40px;
}

.offer-grid-bottom{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:24px;
margin-top:24px;
}

.offers{
max-width:1200px;
margin:auto;
}
.offer-card{
display:flex;
flex-direction:column;
justify-content:space-between;
height:100%;
}
.offer-card .btn{
display:flex;
align-items:center;
justify-content:center;
text-align:center;
gap:6px;
width:100%;
}
.offer-card .btn{
padding:16px 24px;
font-weight:600;
line-height:1;
}
.video-thumb iframe{
width:100%;
height:100%;
border:0;
border-radius:0;
}
.protocol-image-wrap{
position:relative;
cursor:zoom-in;
margin-top:32px;
}

.protocol-image{
display:block;
width:100%;
max-width:1100px;
margin:auto;
border-radius:16px;
box-shadow:0 20px 50px rgba(0,0,0,.35);
}
/* FIX WORDPRESS / PHOTONIC GALLERY HEIGHT */

.photonic-slideshow-container{
height:auto !important;
min-height:0 !important;
}

.photonic-slideshow{
max-width:1200px;
margin:auto;
display:flex;
align-items:center;
justify-content:center;
}

.photonic-slideshow img{
width:100%;
height:auto !important;
object-fit:contain;
}

/* thumbnail strip */

.photonic-strip{
max-width:1200px;
margin:20px auto 0;
display:flex;
justify-content:center;
gap:10px;
}

.photonic-strip img{
width:90px;
height:60px;
object-fit:cover;
border-radius:6px;
cursor:pointer;
opacity:0.8;
transition:0.2s;
}

.photonic-strip img:hover{
opacity:1;
transform:scale(1.05);
}
/* FIX PHOTONIC GALLERY HUGE HEIGHT */

.photonic-slideshow-container,
.photonic-slideshow,
.photonic-slideshow-content{
height:auto !important;
min-height:0 !important;
padding-bottom:0 !important;
}

/* keep gallery centered */

.photonic-slideshow{
max-width:1200px;
margin:auto;
}

/* image size */

.photonic-slideshow img{
width:100%;
height:auto !important;
object-fit:contain;
}

.gallery {
max-width:1100px;
margin:40px auto;
}

.gallery img{
width:100%;
height:auto;
border-radius:10px;
transition:0.25s;
cursor:pointer;
}

.gallery img:hover{
transform:scale(1.05);
}
#faq{
padding:80px 0;
}

.faq-list{
max-width:100%;
margin:auto;
display:flex;
flex-direction:column;
gap:30px;
}

.faq-item{
background:linear-gradient(180deg, rgba(20,30,50,0.7), rgba(10,20,40,0.9));
border:1px solid rgba(255,255,255,0.08);
border-radius:16px;
padding:28px;
}

.faq-item h3{
margin-bottom:12px;
color:white;
font-size:20px;
}

.faq-item p{
color:#b8c6d9;
line-height:1.6;
margin-bottom:10px;
}
.brand-badge{
display:flex;
align-items:center;
font-weight:700;
font-size:18px;
color:white;
padding:6px 12px;
border-radius:20px;
background:rgba(80,200,255,0.15);
}