/*
Theme Name: Zeyline
Theme URI: https://zeyline.fr
Author: Zeyline
Description: Thème vitrine Zeyline léger, autonome et sans dépendance.
Version: 1.1.0
Text Domain: zeyline
*/

html, body {
  margin: 0;
  padding: 0;
  background: #071226;
}
body {
  overflow-x: hidden;
}

:root{
    --bg:#071226;
    --bg2:#0b1832;
    --card:rgba(255,255,255,.07);
    --line:rgba(255,255,255,.10);
    --text:#f5f8ff;
    --muted:#b8c7e6;
    --blue:#3b82f6;
    --cyan:#22d3ee;
    --violet:#8b5cf6;
    --green:#2dd4bf;
    --shadow:0 20px 60px rgba(0,0,0,.28);
    --radius:24px;
    --max:1120px;
  }

  .cyb-wrap *{box-sizing:border-box}
  .cyb-wrap{
    font-family:Inter,Arial,sans-serif;
    color:var(--text);
    background:
      radial-gradient(circle at 15% 15%, rgba(34,211,238,.15), transparent 24%),
      radial-gradient(circle at 85% 0%, rgba(139,92,246,.16), transparent 24%),
      linear-gradient(180deg, #06101f 0%, #09162c 100%);
    margin:0;
    padding:0;
    border-radius:28px;
    overflow:hidden;
  }

  .cyb-container{
    max-width:var(--max);
    margin:0 auto;
    padding:0 20px;
  }

  .cyb-section{
    padding:72px 0;
    position:relative;
  }

  .cyb-hero{
    padding:34px 0 54px;
  }

  .cyb-topbar{
    display:flex;
    justify-content:flex-end;
    margin-bottom:28px;
  }

  .cyb-chip{
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:10px 14px;
    border:1px solid var(--line);
    border-radius:999px;
    background:rgba(255,255,255,.05);
    font-size:13px;
    font-weight:700;
    color:#dbe9ff;
    backdrop-filter:blur(10px);
  }

  .cyb-chip-dot{
    width:10px;
    height:10px;
    border-radius:50%;
    background:linear-gradient(135deg,var(--green),var(--cyan));
    box-shadow:0 0 0 6px rgba(45,212,191,.14);
  }

  .cyb-hero-grid{
    display:grid;
    grid-template-columns:1.08fr .92fr;
    gap:28px;
    align-items:center;
  }

  .cyb-title{
    font-size:60px;
    line-height:.96;
    letter-spacing:-.04em;
    margin:0 0 18px;
    font-weight:900;
  }

  .cyb-title span{
    background:linear-gradient(135deg,#fff 0%, #9ed8ff 38%, #7cf0e5 72%, #b998ff 100%);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
  }

  .cyb-lead{
    font-size:19px;
    line-height:1.7;
    color:var(--muted);
    margin:0 0 18px;
    max-width:680px;
  }

  .cyb-punch{
    font-size:20px;
    font-weight:800;
    margin:0 0 26px;
  }

  .cyb-cta{
    display:flex;
    gap:14px;
    flex-wrap:wrap;
    margin-bottom:20px;
  }

  .cyb-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:54px;
    padding:14px 20px;
    border-radius:16px;
    text-decoration:none;
    font-weight:800;
    transition:.2s ease;
    cursor:pointer;
  }

  .cyb-btn:hover{transform:translateY(-2px)}
  .cyb-btn-primary{
    color:#fff;
    background:linear-gradient(135deg,var(--blue),var(--violet));
    box-shadow:0 18px 44px rgba(59,130,246,.25);
  }
  .cyb-btn-secondary{
    color:#fff;
    background:rgba(255,255,255,.05);
    border:1px solid var(--line);
  }

  .cyb-tags{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
  }

  .cyb-tag{
    padding:10px 12px;
    border-radius:14px;
    border:1px solid var(--line);
    background:rgba(255,255,255,.04);
    color:#d9e8ff;
    font-size:13px;
    font-weight:700;
  }

  .cyb-visual{
    position:relative;
  }

  .cyb-panel{
    position:relative;
    min-height:460px;
    border-radius:30px;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.10);
    background:
      linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03)),
      linear-gradient(180deg, #0a1730 0%, #081220 100%);
    box-shadow:var(--shadow);
  }

  .cyb-grid{
    position:absolute;
    inset:0;
    background-image:
      linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
    background-size:34px 34px;
    mask-image:linear-gradient(180deg, rgba(0,0,0,.95), transparent 92%);
  }

  .cyb-glow-a,.cyb-glow-b{
    position:absolute;
    border-radius:50%;
    filter:blur(16px);
  }

  .cyb-glow-a{
    width:180px;height:180px;
    background:rgba(34,211,238,.28);
    top:-30px;right:-20px;
  }
  .cyb-glow-b{
    width:210px;height:210px;
    background:rgba(139,92,246,.24);
    bottom:-40px;left:-30px;
  }

  .cyb-center-svg{
    position:absolute;
    inset:0;
    display:grid;
    place-items:center;
    z-index:2;
    padding:34px;
  }

  .cyb-float{
    position:absolute;
    z-index:3;
    padding:14px 16px;
    border-radius:18px;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.12);
    backdrop-filter:blur(12px);
    box-shadow:var(--shadow);
    font-size:14px;
    font-weight:800;
    color:#fff;
  }

  .cyb-float small{
    display:block;
    font-size:12px;
    font-weight:600;
    color:var(--muted);
    margin-top:4px;
  }

  .cyb-f1{top:22px;left:22px}
  .cyb-f2{top:80px;right:22px}
  .cyb-f3{bottom:24px;left:22px}
  .cyb-f4{bottom:42px;right:22px}

  .cyb-mini-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:16px;
    margin-top:26px;
  }

  .cyb-mini{
    padding:20px;
    border-radius:20px;
    background:rgba(255,255,255,.04);
    border:1px solid var(--line);
  }

  .cyb-mini strong{
    display:block;
    font-size:17px;
    margin-bottom:8px;
  }

  .cyb-mini span{
    color:var(--muted);
    font-size:14px;
    line-height:1.6;
  }

  .cyb-heading{
    text-align:center;
    max-width:820px;
    margin:0 auto 26px;
  }

  .cyb-heading h2{
    margin:0 0 14px;
    font-size:42px;
    line-height:1.05;
    letter-spacing:-.03em;
  }

  .cyb-heading p{
    margin:0;
    color:var(--muted);
    font-size:18px;
    line-height:1.7;
  }

  .cyb-pricing{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
  }

  .cyb-pricing.single{
    grid-template-columns:minmax(0,760px);
    justify-content:center;
  }

  .cyb-card{
    position:relative;
    display:flex;
    flex-direction:column;
    padding:26px;
    border-radius:26px;
    background:
      linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03));
    border:1px solid var(--line);
    box-shadow:var(--shadow);
  }

  .cyb-card.featured{
    transform:translateY(-8px);
    border-color:rgba(59,130,246,.42);
    box-shadow:0 24px 70px rgba(59,130,246,.18);
  }

  .cyb-badge{
    position:absolute;
    top:16px;
    right:16px;
    padding:8px 12px;
    border-radius:999px;
    background:linear-gradient(135deg,var(--blue),var(--cyan));
    color:#fff;
    font-size:12px;
    font-weight:800;
  }

  .cyb-card h3{
    font-size:30px;
    margin:0 0 10px;
    letter-spacing:-.03em;
  }

  .cyb-card p{
    margin:0 0 18px;
    color:var(--muted);
    line-height:1.7;
  }

  .cyb-price{
    margin:6px 0 18px;
    font-size:38px;
    font-weight:900;
    line-height:1;
  }

  .cyb-price small{
    display:block;
    margin-top:8px;
    font-size:13px;
    line-height:1.5;
    color:var(--muted);
    font-weight:700;
  }

  .cyb-list{
    list-style:none;
    padding:0;
    margin:0 0 22px;
    display:grid;
    gap:12px;
  }

  .cyb-list li{
    display:flex;
    gap:10px;
    align-items:flex-start;
    color:#e1ecff;
    font-size:15px;
    line-height:1.6;
  }

  .cyb-check{
    flex:0 0 22px;
    width:22px;
    height:22px;
    display:grid;
    place-items:center;
    border-radius:999px;
    background:rgba(45,212,191,.14);
    color:#82f2dc;
    font-size:12px;
    margin-top:1px;
  }

  .cyb-card .cyb-btn{
    width:100%;
    margin-top:auto;
  }

  .cyb-proof{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:16px;
  }

  .cyb-proof-box{
    padding:22px;
    border-radius:22px;
    background:rgba(255,255,255,.04);
    border:1px solid var(--line);
    text-align:center;
  }

  .cyb-proof-box strong{
    display:block;
    font-size:28px;
    margin-bottom:6px;
  }

  .cyb-proof-box span{
    color:var(--muted);
    font-size:14px;
    line-height:1.6;
  }

  .cyb-contact{
    display:grid;
    grid-template-columns:1.1fr .9fr;
    gap:22px;
  }

  .cyb-contact-card{
    padding:28px;
    border-radius:26px;
    background:
      linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03));
    border:1px solid var(--line);
    box-shadow:var(--shadow);
  }

  .cyb-contact-card h2,.cyb-contact-card h3{
    margin:0 0 12px;
  }

  .cyb-contact-card p{
    margin:0 0 18px;
    color:var(--muted);
    line-height:1.7;
  }

  .cyb-info{
    display:grid;
    gap:12px;
  }

  .cyb-info-box{
    padding:16px 18px;
    border-radius:18px;
    background:rgba(255,255,255,.04);
    border:1px solid var(--line);
  }

  .cyb-info-box strong{
    display:block;
    margin-bottom:6px;
  }

  .cyb-info-box span{
    color:var(--muted);
    font-size:14px;
    line-height:1.6;
  }

  .cyb-note{
    font-size:13px;
    color:var(--muted);
    line-height:1.6;
    margin-top:16px;
  }

  .cyb-footer{
    padding:20px 0 34px;
    text-align:center;
    color:var(--muted);
    font-size:14px;
  }

  @media (max-width: 1024px){
    .cyb-hero-grid,
    .cyb-pricing,
    .cyb-proof,
    .cyb-contact,
    .cyb-mini-grid{
      grid-template-columns:1fr;
    }
    .cyb-card.featured{transform:none}
  }

  @media (max-width: 780px){
    .cyb-section{padding:54px 0}
    .cyb-hero{padding:24px 0 44px}
    .cyb-title{font-size:42px}
    .cyb-heading h2{font-size:32px}
    .cyb-heading p,.cyb-lead{font-size:16px}
    .cyb-cta{flex-direction:column}
    .cyb-btn{width:100%}
    .cyb-panel{min-height:360px}
    .cyb-float{font-size:13px;padding:12px 14px}
  }

/* Ajustements v1.1 : visuel plus propre et page plus concise */
.cyb-section{
  padding:60px 0;
}

.cyb-hero{
  padding:28px 0 46px;
}

.cyb-panel{
  min-height:430px;
}

.cyb-float{
  max-width:230px;
}

.cyb-f1{top:24px;left:20px}
.cyb-f2{top:96px;right:20px}
.cyb-f3{bottom:28px;left:20px}
.cyb-f4{bottom:48px;right:20px}

.cyb-center-svg svg{
  width:min(78%,360px);
  height:auto;
}

.cyb-pricing.single .cyb-card{
  padding-top:34px;
}

@media (max-width:780px){
  .cyb-section{
    padding:44px 0;
  }

  .cyb-hero{
    padding:20px 0 36px;
  }

  .cyb-panel{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    min-height:auto;
    padding:18px;
  }

  .cyb-grid,
  .cyb-glow-a,
  .cyb-glow-b{
    position:absolute;
  }

  .cyb-center-svg{
    position:relative;
    inset:auto;
    grid-column:1 / -1;
    min-height:250px;
    padding:8px 0 0;
    order:1;
  }

  .cyb-float{
    position:relative;
    inset:auto !important;
    z-index:3;
    max-width:none;
    min-height:94px;
    padding:13px 14px;
    margin:0;
    order:2;
  }

  .cyb-f3,
  .cyb-f4{
    order:3;
  }

  .cyb-badge{
    position:static;
    align-self:flex-start;
    margin:0 0 16px;
  }

  .cyb-card.featured{
    padding-top:26px;
  }

  .cyb-card h3{
    font-size:28px;
  }

  .cyb-price{
    font-size:34px;
  }
}

@media (max-width:520px){
  .cyb-panel{
    grid-template-columns:1fr;
  }

  .cyb-center-svg,
  .cyb-float{
    grid-column:1;
  }

  .cyb-center-svg{
    min-height:220px;
  }
}