/*
Theme Name: DealOrix Premium 10/10
Theme URI: https://dealorix.example
Author: DealOrix / Generated
Description: Premium conversion-first WordPress theme optimized for high conversions and modern UX.
Version: 1.4.0
Text Domain: dealorix
*/

:root{
  --bg:#050816; --card:rgba(255,255,255,0.03); --muted:#9fb7d6; --txt:#eaf6ff;
  --accent1:#6b5bff; --accent2:#00d0ff; --glass: rgba(255,255,255,0.04);
}

*{box-sizing:border-box;}
html,body{height:100%;}
body{margin:0;font-family:Inter, system-ui, -apple-system, 'Segoe UI', Roboto, Arial; background:var(--bg); color:var(--txt); -webkit-font-smoothing:antialiased;}
a{color:var(--accent1); text-decoration:none;}
.container{max-width:1200px;margin:0 auto;padding:28px;}
.header{display:flex;align-items:center;justify-content:space-between;padding:18px 0;}
.brand{display:flex;align-items:center;gap:12px;}
.logo{width:56px;height:56px;border-radius:12px;background:linear-gradient(135deg,var(--accent2),var(--accent1));display:flex;align-items:center;justify-content:center;font-weight:800;color:#041026;font-size:20px;}
.nav a{margin-left:18px;color:var(--muted);font-weight:600;}
/* HERO: align items to bottom so diagram sits aligned with cards */
.hero{display:grid;grid-template-columns:1fr 460px;gap:36px;align-items:end;padding:30px 0;}
.hero-left h1{font-size:48px;line-height:1.05;margin:0;color:var(--txt);}
.lead{color:var(--muted);margin-top:10px;max-width:640px;}
.features{display:flex;gap:18px;margin-top:24px;flex-wrap:wrap;}
.card{background:var(--card);padding:18px;border-radius:12px;flex:1;min-width:220px;display:flex;flex-direction:column;align-items:center;text-align:center;cursor:pointer;}
.feature-icon{width:36px;height:36px;margin-bottom:10px;stroke:var(--accent1);}

/* Latest 4 horizontal boxes (AI Tools / Blog / Guides / News) */
.latest-row{display:flex;gap:18px;margin-top:18px;flex-wrap:wrap;}
.latest-box{flex:1;min-width:220px;background:var(--card);padding:18px;border-radius:12px;text-align:left;display:flex;flex-direction:column;justify-content:flex-start;}
.latest-box h3{margin:0 0 8px 0;color:var(--accent1);}

/* Popular AI Tools */
.popular {margin-top:28px;}
.tools{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:18px;}
.tool{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));padding:22px;border-radius:14px;min-height:140px;display:flex;flex-direction:column;justify-content:flex-end;transition:transform .24s ease,box-shadow .24s ease;cursor:pointer;}
.tool:hover{transform:translateY(-6px);box-shadow:0 24px 48px rgba(10,12,30,0.5);}

/* Testimonials vertical */
.testimonials-container{display:flex;flex-direction:column;gap:12px;margin-top:18px;}
.testimonial{background:var(--glass);padding:20px;border-radius:12px;color:var(--txt);}

/* footer */
.footer{padding:30px 0;border-top:1px solid rgba(255,255,255,0.02);color:var(--muted);font-size:14px;display:flex;justify-content:space-between;align-items:center;}

/* SVG bars grow from bottom via scaleY */
.hero-right svg { width:100%; height:auto; display:block; }
.hero-right rect {
  transform-origin: center bottom;
  transform: scaleY(0);
  animation: grow .9s forwards;
}
.hero-right rect:nth-of-type(1){animation-delay:0.08s;}
.hero-right rect:nth-of-type(2){animation-delay:0.18s;}
.hero-right rect:nth-of-type(3){animation-delay:0.28s;}
.hero-right rect:nth-of-type(4){animation-delay:0.38s;}
.hero-right rect:nth-of-type(5){animation-delay:0.48s;}

@keyframes grow {
  to { transform: scaleY(1); }
}

/* STILIŲ PAPILDYMAI NUORODOMS */
a.card, a.tool {
  color: inherit; /* Paveldi tekstų spalvas iš tėvinio elemento */
  text-decoration: none; /* Pašalina pabraukimus iš nuorodų */
  display: block; /* Užtikrina, kad nuoroda užims visą kortelės plotą */
}

a.card:hover, a.tool:hover {
  color: inherit; /* Išlaiko tekstų spalvas hover metu */
}

/* Užtikrina, kad feature kortelės hover efektai veikia */
a.card:hover {
  background: rgba(255,255,255,0.05); /* Šviesus hover efektas */
  transition: background 0.2s ease;
}

/* Užtikrina, kad tool kortelės hover efektai veikia */
a.tool:hover {
  transform: translateY(-6px);
  box-shadow: 0 24px 48px rgba(10,12,30,0.5);
  background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.02));
}

/* Small screens adjustments */
@media (max-width:980px){
  .hero{grid-template-columns:1fr;text-align:center;}
  .hero-right{order:-1;}
  .tools{grid-template-columns:1fr;}
  .latest-row{flex-direction:column;}
  .features{flex-direction:column;}
}
/* ==================== */
/* STRAIPSNIŲ STILIAI */
/* ==================== */

.article-header {
    text-align: center;
    padding: 30px 0 15px 0;
    background: linear-gradient(135deg, rgba(107,91,255,0.1), rgba(0,208,255,0.05));
    margin-bottom: 20px;
}

.article-title {
    font-size: 3em;
    font-weight: 800;
    line-height: 1.1;
    margin-bottom: 15px;
    background: linear-gradient(135deg, var(--accent2), var(--accent1));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.content-section {
    margin-bottom: 40px;
}

.section-title {
    font-size: 2em;
    margin-bottom: 20px;
    color: var(--txt);
    border-left: 4px solid var(--accent1);
    padding-left: 15px;
}

.subsection-title {
    font-size: 1.5em;
    margin: 25px 0 15px 0;
    color: var(--accent2);
}

/* PLATŪS ELEMENTAI */
.feature-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    gap: 30px;
    margin: 30px 0;
}

.feature-card {
    background: var(--card);
    padding: 30px;
    border-radius: 15px;
    border: 1px solid rgba(255,255,255,0.05);
    min-height: 220px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.strategy-comparison {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 25px;
    margin: 30px 0;
}

.strategy-card {
    background: var(--card);
    padding: 25px;
    border-radius: 12px;
    text-align: center;
    border: 1px solid rgba(255,255,255,0.05);
    min-height: 180px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.comparison-table {
    width: 100%;
    border-collapse: collapse;
    margin: 30px 0;
    background: var(--card);
    border-radius: 12px;
    overflow: hidden;
}

.comparison-table th,
.comparison-table td {
    padding: 16px;
    text-align: left;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

.comparison-table th {
    background: rgba(107,91,255,0.1);
    color: var(--accent1);
    font-weight: 600;
}

/* SPALVOS */
.rating-stars {
    color: #ffd700;
    font-size: 1.1em;
}

.security-badge {
    display: inline-block;
    background: rgba(0,208,255,0.1);
    color: var(--accent2);
    padding: 5px 12px;
    border-radius: 15px;
    font-size: 0.8em;
    margin: 2px;
}

.risk-badge {
    background: linear-gradient(135deg, #ff6b6b, #ffa500);
    color: white;
    padding: 8px 15px;
    border-radius: 20px;
    font-size: 0.8em;
    font-weight: 600;
    display: inline-block;
    margin: 5px;
}

.performance-badge {
    background: linear-gradient(135deg, #4CAF50, #8BC34A);
    color: white;
    padding: 8px 15px;
    border-radius: 20px;
    font-size: 0.8em;
    font-weight: 600;
    display: inline-block;
    margin: 5px;
}

.quantum-badge {
    background: linear-gradient(135deg, #ff6b6b, #ffa500);
    color: white;
    padding: 8px 15px;
    border-radius: 20px;
    font-size: 0.8em;
    font-weight: 600;
    display: inline-block;
    margin: 5px;
}

/* PAPILDOMI ELEMENTAI */
.step-by-step {
    background: var(--card);
    padding: 25px;
    border-radius: 15px;
    margin: 25px 0;
}

.step-number {
    display: inline-block;
    background: var(--accent1);
    color: white;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    text-align: center;
    line-height: 30px;
    margin-right: 10px;
    font-weight: bold;
}

.ai-feature {
    background: linear-gradient(135deg, rgba(107,91,255,0.1), rgba(0,208,255,0.1));
    padding: 20px;
    border-radius: 12px;
    margin: 20px 0;
    border-left: 4px solid var(--accent1);
}

.conclusion-box {
    background: linear-gradient(135deg, var(--accent1), var(--accent2));
    padding: 30px;
    border-radius: 15px;
    margin: 40px 0;
    text-align: center;
}

/* Mobile optimizavimas straipsniams */
@media (max-width: 980px) {
    .feature-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .strategy-comparison {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    
    .article-title {
        font-size: 2.2em;
    }
}