:root{
    /* Casino-night Argentina palette */
    --bg: #0a1020;            /* deep navy */
    --bg-soft: #0d1731;       /* softer panel bg */
    --surface: #0f1a2e;       /* card bg */
    --surface-2: #0c1428;     /* alternate section */
    --border: #1e3357;        /* cold border */
    --line: #163054;          /* separators */
    --primary: #7fc8ff;       /* celeste neon */
    --primary-600:#4db6ff;
    --accent: #ffd166;        /* gold */
    --ink: #eaf2ff;           /* main text */
    --muted: #9fb7d4;         /* subtext */
    --shadow: 0 18px 40px rgba(0,0,0,.45), 0 6px 16px rgba(0,0,0,.35);
    --radius-xl: 22px;
    --radius-lg: 16px;
    --glow: 0 0 0 1px rgba(127,200,255,.25), 0 0 28px rgba(77,182,255,.25), inset 0 0 0 1px rgba(22,48,84,.6);
}
html,body{height:100%}
body{
    margin:0; font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    color:var(--ink); background: var(--bg);
    background-image:
            radial-gradient(1200px 600px at 80% -10%, rgba(77,182,255,.20), transparent 60%),
            radial-gradient(900px 500px at 10% 10%, rgba(41,124,214,.18), transparent 60%),
            radial-gradient(600px 400px at 60% 90%, rgba(255,209,102,.08), transparent 60%),
            linear-gradient(180deg, rgba(8,14,28,.9), rgba(8,14,28,.9));
    background-attachment: fixed;
}
a{color:inherit; text-decoration:none}
.container{max-width:1200px; margin:0 auto; padding:0 16px}

/* Header */
header{position:sticky; top:0; z-index:40; background:rgba(10,16,32,.65); backdrop-filter: blur(10px); border-bottom:1px solid var(--line)}
.nav{display:flex; align-items:center; justify-content:space-between; height:72px}
.brand{display:flex; gap:12px; align-items:center}
.logo{width:28px; height:28px; filter: drop-shadow(0 0 10px rgba(127,200,255,.35));}
.brand-title{font-weight:900; color:#bfe3ff; letter-spacing:.2px}
.brand-sub{font-size:12px; color:#7fc8ff}
.menu{display:none; gap:24px; font-size:14px; color:#cfe8ff}
.menu a{opacity:.85}
.menu a:hover{opacity:1; text-shadow:0 0 12px rgba(127,200,255,.5)}

/* Buttons */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:12px 18px; border-radius:16px; font-weight:800; letter-spacing:.2px; line-height:1.1; max-width:100%; box-sizing:border-box; white-space:nowrap}
.btn-primary{background:linear-gradient(180deg, var(--primary), var(--primary-600)); color:#00111e; box-shadow:var(--glow)}
.btn-outline{border:1px solid var(--border); color:#cfe8ff; background:transparent}
.btn-success{background:linear-gradient(180deg,#22c55e,#17a84c); color:#00110a; box-shadow:0 0 0 1px rgba(34,197,94,.2), 0 0 26px rgba(34,197,94,.25)}
.btn-block{display:flex; width:100%}

/* Hero */
.hero{position:relative; overflow:hidden; background: linear-gradient(180deg, rgba(12,20,40,.85), rgba(12,20,40,.6));}
.hero::before{content:""; position:absolute; inset:0; background:
        radial-gradient(900px 300px at 70% 0%, rgba(127,200,255,.25), transparent 60%),
        radial-gradient(700px 260px at 20% 10%, rgba(47,120,198,.22), transparent 60%);
    pointer-events:none; mix-blend-mode:screen;
}
.hero-grid{display:grid; grid-template-columns:1fr; gap:28px; padding:86px 0}
.hero h1{font-size:52px; line-height:1.05; margin:12px 0 0; color:#eaf6ff}
.badge{display:inline-block; padding:7px 12px; border-radius:999px; background:rgba(127,200,255,.18); color:#bfe3ff; font-size:12px; font-weight:900; border:1px solid rgba(127,200,255,.35)}
.hero p{color:var(--muted); font-size:18px}
.card{background:linear-gradient(180deg, rgba(17,29,50,.9), rgba(13,23,45,.9)); border:1px solid var(--border); border-radius:var(--radius-xl); padding:24px; box-shadow:var(--shadow)}
.dot{display:inline-block; width:10px; height:10px; border-radius:999px; background:var(--primary); box-shadow:0 0 14px rgba(127,200,255,.6)}

.glow-title{background: linear-gradient(90deg, #fff, #7fc8ff 40%, #ffd166 80%); -webkit-background-clip:text; background-clip:text; color:transparent; text-shadow:0 0 30px rgba(127,200,255,.2)}

/* Sections */
section{padding:76px 0}
.band{background: linear-gradient(180deg, rgba(12,20,40,.7), rgba(12,20,40,.4))}
.section-title{font-size:34px; font-weight:900; text-align:center; margin:0; color:#e6f4ff}
.section-sub{color:var(--muted); text-align:center; margin:10px 0 0}
.section-divider{height:1px; background:linear-gradient(90deg, transparent, var(--line), transparent); margin:28px 0}

/* Ranking */
.rank-list{display:grid; gap:16px}
.rank-item{display:grid; grid-template-columns:52px 1fr minmax(240px, 320px); gap:16px; align-items:center; border:1px solid var(--border); background: linear-gradient(180deg, rgba(18,31,56,.9), rgba(15,26,46,.9)); border-radius:var(--radius-lg); padding:16px; box-shadow:var(--shadow)}
.rank-pos{width:42px; height:42px; border-radius:12px; display:grid; place-items:center; font-weight:900; background:rgba(127,200,255,.12); color:#bfe3ff; box-shadow:inset 0 0 0 1px rgba(127,200,255,.3)}
.rank-tag{font-size:10px; padding:4px 8px; background:rgba(127,200,255,.12); border-radius:999px; color:#eaf6ff; border:1px solid rgba(127,200,255,.25); font-weight:800}
.stars{display:flex; gap:4px}
.star{width:20px; height:20px; fill:var(--accent); filter: drop-shadow(0 0 6px rgba(255,209,102,.35))}
.rank-right{text-align:right}
.rank-actions{display:grid; gap:8px; margin-top:8px}
.rank-actions .btn{width:100%}

/* Grids */
.grid-2{display:grid; grid-template-columns:1fr; gap:18px}
.pill{display:inline-block; padding:6px 10px; border:1px solid var(--border); border-radius:10px; font-size:14px; background:rgba(127,200,255,.12); color:#dbeeff}

/* Tips */
.tips-card{background:linear-gradient(180deg, rgba(18,31,56,.92), rgba(15,26,46,.92)); border:1px solid var(--border); border-radius:var(--radius-xl); padding:24px; box-shadow:var(--shadow)}
.tips-list{list-style:none; padding:0; margin:0}
.tips-list li{display:flex; gap:10px; margin:14px 0}
.tips-list small{color:var(--muted)}

/* Seguridad */
.seg-grid{display:grid; grid-template-columns:1fr; gap:18px}

/* Verificacion */
.verify-grid{display:grid; grid-template-columns:1fr; gap:16px}
.verify-card{background:linear-gradient(180deg, rgba(18,31,56,.92), rgba(15,26,46,.92)); border:1px solid var(--border); border-radius:16px; padding:20px; text-align:center; box-shadow:var(--shadow)}
.verify-index{width:40px; height:40px; border-radius:999px; background:linear-gradient(180deg, var(--primary), var(--primary-600)); color:#00111e; font-weight:900; display:grid; place-items:center; margin:0 auto 12px; box-shadow:var(--glow)}

/* Mobile games */
.mobile-grid{display:grid; grid-template-columns:1fr; gap:24px; align-items:center}
.phone{width:300px; height:440px; border-radius:26px; background:radial-gradient(220px 160px at 70% 20%, rgba(127,200,255,.18), transparent 60%), #0c162b; border:1px solid var(--border); overflow:hidden; box-shadow:var(--shadow)}
.app-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:10px; padding:16px}
.tile{height:96px; border-radius:14px; background:linear-gradient(180deg, rgba(20,34,62,.9), rgba(14,24,46,.9)); border:1px solid var(--line); display:flex; align-items:center; justify-content:center; font-size:26px; color:#cfe8ff}

/* Logo strip */
.logo-strip{display:flex; gap:18px; align-items:center; flex-wrap:wrap; opacity:.95}
.logo-chip{height:38px; padding:0 14px; border:1px solid var(--line); border-radius:999px; background:rgba(12,20,40,.6); display:flex; align-items:center; font-weight:800; color:#bfe3ff}

/* Footer */
footer{border-top:1px solid var(--line); background:rgba(10,16,32,.8)}

/* Utils */
.muted{color:var(--muted)}

/* Responsive */
@media (min-width: 768px){
    .menu{display:flex}
    .hero-grid{grid-template-columns:1.1fr .9fr}
    .grid-2{grid-template-columns:repeat(2,1fr)}
    .seg-grid{grid-template-columns:1fr 1fr}
    .verify-grid{grid-template-columns:repeat(3,1fr)}
    .mobile-grid{grid-template-columns:1.1fr .9fr}
    .rank-actions{grid-template-columns:repeat(2,minmax(120px,1fr))}
}
@media (max-width: 767px){
    .rank-item{grid-template-columns:1fr}
    .rank-right{text-align:left}
}




/* Mobile nav */
.hamburger{
    display:inline-flex; align-items:center; justify-content:center;
    width:42px; height:42px; border:1px solid var(--line); border-radius:12px;
    background:rgba(12,20,40,.5); color:#cfe8ff
}
.hamburger:hover{box-shadow:0 0 0 1px rgba(127,200,255,.25), 0 0 18px rgba(127,200,255,.15)}
.hamburger .bar{
    display:block; width:20px; height:2px; background:#cfe8ff; border-radius:2px;
    transition:.3s transform, .3s opacity; box-shadow:0 0 8px rgba(127,200,255,.4)
}
.hamburger .bar + .bar{margin-top:5px}
.hamburger[aria-expanded="true"] .bar:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hamburger[aria-expanded="true"] .bar:nth-child(2){opacity:0}
.hamburger[aria-expanded="true"] .bar:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.mobile-nav{
    position:fixed; top:72px; left:0; right:0;
    background:rgba(10,16,32,.96); backdrop-filter:blur(10px);
    border-top:1px solid var(--line); transform:translateY(-8px);
    opacity:0; pointer-events:none; transition:.25s ease; z-index:39
}
.mobile-nav.open{transform:translateY(0); opacity:1; pointer-events:auto}
.mobile-nav .container{padding:14px 16px 22px}

.mobile-menu{display:grid; gap:10px}
.mobile-menu a{
    padding:12px 14px; border:1px solid var(--line); border-radius:12px;
    color:#eaf6ff; background:rgba(18,31,56,.6)
}
.mobile-menu a:hover{box-shadow:0 0 0 1px rgba(127,200,255,.25), 0 0 18px rgba(127,200,255,.15)}

@media (min-width: 768px){
    .hamburger{display:none}
}
/* Красивый гамбургер */
.hamburger.pretty{
    display:inline-flex; align-items:center; justify-content:center;
    width:44px; height:44px; border:none;
    background:linear-gradient(180deg, rgba(20,32,60,.65), rgba(12,20,40,.55));
    border-radius:12px; cursor:pointer;
    box-shadow:0 0 0 1px rgba(127,200,255,.18), 0 8px 24px rgba(0,0,0,.35);
    transition:box-shadow .25s ease, transform .15s ease;
}
.hamburger.pretty:hover{
    box-shadow:0 0 0 1px rgba(127,200,255,.28), 0 0 22px rgba(127,200,255,.15), 0 8px 24px rgba(0,0,0,.35);
    transform:translateY(-1px);
}

.hamburger-icon{
    width:24px; height:24px;
    stroke:#cfe8ff; stroke-width:2.2; stroke-linecap:round; fill:none;
    filter:drop-shadow(0 0 8px rgba(127,200,255,.35));
}

/* линии */
.hamburger .line{ transition:transform .28s ease, opacity .2s ease; transform-origin:12px 12px; }
.hamburger .line.top    { transform: translateY(0); }
.hamburger .line.middle { opacity:1; }
.hamburger .line.bottom { transform: translateY(0); }

/* состояние ОТКРЫТО (крестик) */
.hamburger[aria-expanded="true"] .line.top    { transform: translateY(5px) rotate(45deg); }
.hamburger[aria-expanded="true"] .line.middle { opacity:0; }
.hamburger[aria-expanded="true"] .line.bottom { transform: translateY(-5px) rotate(-45deg); }

/* на десктопе кнопку скрываем */
@media (min-width:768px){
    .hamburger.pretty{display:none;}
}
/* Offer card (hero) */
.offer-card{
    position: relative; overflow: hidden;
    border-radius: var(--radius-xl);
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
    padding: 20px;
    min-height: 320px;
    background:
            radial-gradient(60% 100% at 80% 0%, rgba(127,200,255,.10), transparent 70%),
            linear-gradient(180deg, rgba(12,20,40,.65), rgba(12,20,40,.85)),
            var(--offer-bg) center/cover no-repeat;
    display: grid; gap: 16px;
}
.offer-overlay{position:absolute; inset:0; pointer-events:none;}

.offer-head{position:relative; display:flex; gap:14px; align-items:center; z-index:1}
.offer-logo{
    width:56px; height:56px; border-radius:14px;
    object-fit:contain; background:rgba(12,20,40,.6);
    border:1px solid var(--line);
    box-shadow:0 0 0 1px rgba(127,200,255,.15), 0 8px 24px rgba(0,0,0,.35);
    padding:8px;
}
.offer-title{margin:0; font-size:22px; color:#bfe3ff}
.offer-badges{display:flex; gap:8px; flex-wrap:wrap}
.badge-soft{
    font-size:12px; padding:4px 8px; border-radius:999px;
    color:#dff1ff; background:rgba(127,200,255,.12); border:1px solid rgba(127,200,255,.25)
}

.offer-list{
    position:relative; z-index:1; list-style:none; margin:0; padding:0 0 4px 0;
    color:#bfd5f1;
}
.offer-list li{display:flex; align-items:center; gap:10px; margin:8px 0}
.offer-list li::before{
    content:''; width:8px; height:8px; border-radius:999px;
    background:var(--primary); box-shadow:0 0 10px rgba(127,200,255,.45);
}

.offer-rating{position:relative; z-index:1; display:flex; align-items:center; gap:10px}
.offer-rating .star{width:18px; height:18px; fill:var(--accent); filter: drop-shadow(0 0 6px rgba(255,209,102,.35))}

.offer-cta{
    position:relative; z-index:1; margin-top:6px;
    box-shadow: 0 0 0 1px rgba(127,200,255,.2), 0 14px 28px rgba(0,0,0,.45);
}

/* адаптация в сетке hero */
@media (min-width: 768px){
    .offer-card{padding:24px 24px 22px}
}
.offer-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;         /* расстояние между бейджами */
    margin-top: 6px;  /* отступ сверху от заголовка */
    margin-bottom: 8px; /* отступ снизу перед списком */
}

.badge-soft {
    font-size: 12px;
    padding: 4px 10px;
    border-radius: 999px;
    color: #dff1ff;
    background: rgba(127,200,255,.12);
    border: 1px solid rgba(127,200,255,.25);
}


/* ===== Featured Ranking (single) ===== */
.rank-feature{
    position: relative; overflow: hidden;
    border-radius: var(--radius-xl);
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
    background: linear-gradient(180deg, rgba(18,31,56,.9), rgba(15,26,46,.95));
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    gap: 18px;
    padding: 26px 26px;
    margin-top: 22px;
}
.rank-feature .rf-bg{
    position:absolute; inset:0; pointer-events:none;
    background:
            radial-gradient(60% 100% at 90% 0%, rgba(127,200,255,.10), transparent 70%),
            linear-gradient(180deg, rgba(12,20,40,.65), rgba(12,20,40,.85)),
            var(--rf-bg) center/cover no-repeat;
    opacity:.9;
}
.rf-left, .rf-right{ position:relative; z-index:1 }

.rf-head{ display:flex; align-items:center; gap:14px; margin-bottom:6px }
.rf-logo{
    width:56px; height:56px; border-radius:14px; object-fit:contain;
    background:rgba(12,20,40,.6); border:1px solid var(--line);
    padding:8px; box-shadow:0 0 0 1px rgba(127,200,255,.15), 0 8px 24px rgba(0,0,0,.35);
}
.rf-title{ margin:0; font-size:22px; color:#d9edff }
.rf-badges{ display:flex; flex-wrap:wrap; gap:8px; margin-top:6px; margin-bottom:8px }
.badge-soft{
    font-size:12px; padding:4px 10px; border-radius:999px;
    color:#dff1ff; background:rgba(127,200,255,.12); border:1px solid rgba(127,200,255,.25)
}

.rf-list{ list-style:none; margin:0; padding:0; color:#bfd5f1 }
.rf-list li{ display:flex; align-items:center; gap:10px; margin:8px 0 }
.rf-list li::before{
    content:''; width:8px; height:8px; border-radius:999px;
    background:var(--primary); box-shadow:0 0 10px rgba(127,200,255,.45);
}

.rf-right{ display:flex; flex-direction:column; align-items:flex-end; gap:12px }
.rf-rating{ display:flex; align-items:center; gap:10px }
.rf-rating .star{ width:18px; height:18px; fill:var(--accent); filter: drop-shadow(0 0 6px rgba(255,209,102,.35)) }
.rf-cta{ display:grid; grid-template-columns:repeat(2, minmax(120px, 1fr)); gap:10px; width:100%; max-width:360px }
.rf-score{ color:#a9bfd9; font-size:13px }

@media (max-width: 900px){
    .rank-feature{ grid-template-columns: 1fr; padding:22px }
    .rf-right{ align-items:flex-start }
    .rf-cta{ max-width:none }
}
/* ==== Ranking single (custom) ==== */
.rank-hero .rank-intro{ text-align:center; margin-bottom:18px }
.rank-chip{
    display:inline-block; padding:6px 12px; border-radius:999px;
    background:rgba(127,200,255,.12); border:1px solid rgba(127,200,255,.25);
    color:#dff1ff; font-weight:700; font-size:12px;
}

/* tarjeta principal */
.rank-card{
    position:relative; overflow:hidden;
    border-radius: var(--radius-xl);
    border:1px solid var(--border);
    box-shadow: var(--shadow);
    margin-top: 16px;
}
.rank-card .rk-glow{
    position:absolute; inset:1px; border-radius:calc(var(--radius-xl) - 2px);
    background:
            linear-gradient(180deg, rgba(255,209,102,.08), rgba(127,200,255,.10));
    filter: blur(20px); opacity:.45;
}
.rank-card .rk-bg{
    position:absolute; inset:0; pointer-events:none;
    background:
            radial-gradient(600px 300px at 85% 10%, rgba(127,200,255,.12), transparent 60%),
            linear-gradient(180deg, rgba(12,20,40,.65), rgba(12,20,40,.92)),
            var(--rk-bg) center/cover no-repeat;
    opacity:.95;
}

/* contenido */
.rk-main{ position:relative; z-index:1; padding:24px 26px; display:grid; gap:14px }
.rk-head{ display:flex; align-items:center; justify-content:space-between; gap:16px }
.rk-brand{ display:flex; align-items:center; gap:12px; min-width:0 }
.rk-logo{
    width:60px; height:60px; border-radius:16px; object-fit:contain;
    background:rgba(12,20,40,.6); border:1px solid var(--line); padding:8px;
    box-shadow:0 0 0 1px rgba(127,200,255,.15), 0 8px 24px rgba(0,0,0,.35);
}
.rk-name h3{ margin:0; color:#d9edff; font-size:22px }
.rk-badges{ display:flex; flex-wrap:wrap; gap:8px; margin-top:6px }
.rk-badge{
    padding:4px 10px; border-radius:999px; font-size:12px; font-weight:700;
    color:#dff1ff; background:rgba(127,200,255,.14); border:1px solid rgba(127,200,255,.28)
}
.rk-badge--ghost{ background:rgba(255,255,255,.05); border-color:rgba(127,200,255,.18); color:#cfe8ff }

.rk-rating{ display:flex; align-items:center; gap:10px; color:#dbe8ff }
.rk-rating .star{ width:18px; height:18px; fill:var(--accent); filter:drop-shadow(0 0 6px rgba(255,209,102,.35)) }

.rk-bonus{
    display:flex; align-items:center; gap:10px; padding:12px 14px;
    border:1px solid var(--line); border-radius:14px;
    background:linear-gradient(180deg, rgba(20,34,62,.65), rgba(14,24,46,.75));
}
.rk-bonus-label{
    font-size:12px; padding:4px 10px; border-radius:999px;
    background:rgba(255,255,255,.06); color:#cfe8ff; border:1px solid rgba(127,200,255,.18);
}
.rk-bonus-text{ color:#eaf6ff }

.rk-list{ list-style:none; margin:0; padding:0; display:flex; gap:12px; flex-wrap:wrap; color:#bfd5f1 }
.rk-list li{ display:flex; align-items:center; gap:8px; }
.rk-list li::before{
    content:''; width:8px; height:8px; border-radius:999px; background:var(--primary);
    box-shadow:0 0 10px rgba(127,200,255,.45)
}

.rk-footer{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap }
.rk-payments{ display:flex; gap:8px; flex-wrap:wrap }
.rk-chip{
    display:inline-block; padding:6px 10px; border-radius:999px; font-weight:800; font-size:12px;
    background:rgba(127,200,255,.10); border:1px solid rgba(127,200,255,.22); color:#dff1ff
}

/* CTA con degradé celeste→oro */
.rk-cta{
    background: linear-gradient(90deg, var(--primary) 0%, #8bd3ff 50%, #ffd166 100%);
    color:#00111e; border-radius:14px; padding:12px 18px; font-weight:900;
    box-shadow:0 0 0 1px rgba(127,200,255,.25), 0 14px 28px rgba(0,0,0,.45);
}

/* note */
.rk-note{
    margin-top:18px; border:1px solid var(--border); background:linear-gradient(180deg, rgba(18,31,56,.9), rgba(15,26,46,.95));
    border-radius:16px; padding:16px; display:flex; gap:12px; align-items:flex-start; box-shadow:var(--shadow)
}
.rk-note-ico{ width:40px; height:40px; display:grid; place-items:center; border-radius:12px; background:rgba(127,200,255,.12); border:1px solid rgba(127,200,255,.25) }
.rk-note h4{ margin:0 0 6px; color:#e6f4ff }
.rk-note p{ margin:0 0 6px; color:#b7cae2 }

@media (max-width: 900px){
    .rk-main{ padding:20px }
    .rk-footer{ flex-direction:column; align-items:flex-start }
    .rk-cta{ width:100% }
}
.icon-card {
    background: linear-gradient(180deg, rgba(18,31,56,.95), rgba(12,20,40,.95));
    border: 1px solid var(--border);
    border-radius: 18px;
    box-shadow: var(--shadow);
    width: 120px;
    height: 120px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 36px;
    color: #cfe8ff;
    transition: all .25s ease;
}
.icon-card span {
    margin-top: 8px;
    font-size: 14px;
    font-weight: 600;
    color: var(--muted);
}
.icon-card:hover {
    transform: translateY(-6px) scale(1.05);
    box-shadow: 0 0 20px rgba(127,200,255,.3);
}



/* FAQ layout */
.faq-grid{display:grid; grid-template-columns:1fr 2fr; gap:18px}
.faq-card{border:1px solid var(--border); border-radius:20px; background:linear-gradient(180deg, rgba(18,31,56,.9), rgba(12,20,40,.95)); box-shadow:var(--shadow); padding:18px}
.faq-help{
    border-radius:20px; padding:18px;
    background: linear-gradient(135deg, rgba(127,200,255,.18), rgba(255,209,102,.18));
    border:1px solid rgba(127,200,255,.25);
    box-shadow:var(--shadow)
}
.faq-help h3{margin:0 0 6px}
.faq-help-link{
    display:block; margin-top:10px; padding:12px 14px; border-radius:12px;
    background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
    border:1px solid rgba(255,255,255,.08); color:#eaf6ff
}

/* Tabs */
.faq-tabs{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:12px}
.faq-tab{
    padding:8px 12px; border-radius:999px; border:1px solid var(--line);
    background:rgba(255,255,255,.04); color:#dff1ff; font-weight:700; cursor:pointer;
}
.faq-tab.is-active{
    background:linear-gradient(90deg, rgba(127,200,255,.25), rgba(255,209,102,.18));
    border-color:rgba(127,200,255,.35);
}

/* Panels & accordion */
.faq-panel{display:none}
.faq-panel.is-active{display:block}

.faq-item{
    margin-bottom:10px; border-radius:12px; overflow:hidden;
    background:rgba(255,255,255,.03); border:1px solid var(--line)
}
.faq-item summary{
    list-style:none; cursor:pointer; padding:14px 16px; font-weight:800; color:#eaf2ff;
    display:flex; align-items:center; justify-content:space-between; gap:10px;
}
.faq-item[open] summary{background:rgba(255,255,255,.06)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item .faq-body{padding:12px 16px; color:#c7d7ec}

@media (max-width: 980px){
    .faq-grid{grid-template-columns:1fr; }
}


/* Contact */
.contact{padding:72px 0}
.contact-grid{display:grid; grid-template-columns:1.2fr .8fr; gap:18px}

.c-form{
    border:1px solid var(--border); border-radius:20px;
    background:linear-gradient(180deg, rgba(18,31,56,.92), rgba(12,20,40,.96));
    box-shadow:var(--shadow); padding:20px;
}
.c-form-head{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:6px}
.c-form-head h2{margin:0}
.c-chip{
    display:inline-block; padding:6px 12px; border-radius:999px;
    background:linear-gradient(90deg, rgba(127,200,255,.18), rgba(255,209,102,.16));
    border:1px solid rgba(127,200,255,.28); color:#dff1ff; font-weight:800; font-size:12px
}

.c-row{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:12px}
.c-field-full{grid-column:1 / -1}
.c-field label{display:block; font-weight:800; margin:6px 0}
.c-field input,
.c-field select,
.c-field textarea{
    width:100%; box-sizing:border-box;
    padding:12px 14px; border-radius:14px; border:1px solid var(--line);
    background:linear-gradient(180deg, rgba(20,34,62,.65), rgba(14,24,46,.75));
    color:#eaf6ff; outline:none;
    transition:border-color .2s ease, box-shadow .2s ease;
}
.c-field textarea{resize:vertical}
.c-field input:focus,
.c-field select:focus,
.c-field textarea:focus{ box-shadow:0 0 0 1px rgba(127,200,255,.25), 0 0 24px rgba(127,200,255,.15) }

.c-error{display:none; color:#ffd166; font-size:12px; margin-top:6px}
.c-field.invalid .c-error{display:block}
.c-field.invalid input,
.c-field.invalid select,
.c-field.invalid textarea{ border-color:#a84; }

.c-check{display:flex; align-items:flex-start; gap:10px; margin:14px 0}
.c-check input{margin-top:3px}

.c-submit{
    width:100%; margin-top:6px;
    background: linear-gradient(90deg, var(--primary) 0%, #8bd3ff 50%, #ffd166 100%);
    color:#00111e; border-radius:14px; padding:14px 18px; font-weight:900;
    box-shadow:0 0 0 1px rgba(127,200,255,.25), 0 14px 28px rgba(0,0,0,.45);
}
.c-hint{margin:10px 0 0}

.c-aside{display:grid; gap:12px}
.c-banner{
    border:1px solid var(--border); border-radius:20px; overflow:hidden; position:relative;
    background:
            radial-gradient(500px 300px at 80% 20%, rgba(127,200,255,.16), transparent 60%),
            linear-gradient(180deg, rgba(12,20,40,.6), rgba(12,20,40,.85)),
            url('/img/contact-hero.jpg') center/cover no-repeat;
    min-height:180px; display:flex; align-items:flex-end;
}
.c-banner-content{padding:14px}
.c-banner h3{margin:0 0 4px}

.c-cards{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.c-card{
    border:1px solid var(--border); border-radius:16px; padding:14px;
    background:linear-gradient(180deg, rgba(18,31,56,.92), rgba(12,20,40,.95));
}
.c-card-title{font-weight:900; margin-bottom:4px}
.c-card-text{color:#cfe8ff}

.c-cta-block{
    border:1px solid var(--border); border-radius:16px; padding:16px;
    background:linear-gradient(135deg, rgba(127,200,255,.14), rgba(255,209,102,.12));
}

/* Toast */
.c-toast{
    position:fixed; left:50%; bottom:24px; transform:translateX(-50%) translateY(20px);
    background:linear-gradient(180deg, rgba(18,31,56,.98), rgba(12,20,40,.98));
    border:1px solid var(--border); color:#dff1ff;
    padding:12px 16px; border-radius:12px; box-shadow:var(--shadow);
    opacity:0; pointer-events:none; transition:all .25s ease; z-index:60;
}
.c-toast.show{opacity:1; transform:translateX(-50%) translateY(0)}

@media (max-width: 980px){
    .contact-grid{grid-template-columns:1fr}
    .c-row{grid-template-columns:1fr}
    .c-cards{grid-template-columns:1fr}
}
/* --- Dark styled select --- */
.c-select{
    appearance:none; -webkit-appearance:none; -moz-appearance:none;
    background:
            linear-gradient(180deg, rgba(20,34,62,.65), rgba(14,24,46,.85));
    color:#eaf6ff;
    border:1px solid var(--line);
    border-radius:14px;
    padding:12px 42px 12px 14px; /* правый паддинг под стрелку */
    cursor:pointer;
    transition:border-color .2s ease, box-shadow .2s ease, color .2s ease;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23bfe3ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
    background-repeat:no-repeat;
    background-position: right 14px center;
    background-size: 16px;
}
.c-select:focus{
    outline:none;
    box-shadow:0 0 0 1px rgba(127,200,255,.25), 0 0 24px rgba(127,200,255,.15);
}

/* Цвета раскрытого списка (Chrome/Edge/Firefox десктоп) */
.c-select option{
    background-color:#0f1a2e;    /* выпадающее меню тёмное */
    color:#eaf6ff;
}
.c-select option[disabled]{ color:#7fa0c4; }
.c-select option:checked{ background-color:#173052; }
.c-select option:hover{ background-color:#1b2b48; }

/* placeholder виден бледным до выбора */
.c-select.is-placeholder{ color:#9fb7d4; }

/* скрыть иконку в IE/старых Edge (на всякий) */
.c-select::-ms-expand{ display:none; }

/* чтобы список не перекрывался соседями */
.c-form, .c-field { position:relative; z-index:0; }
.c-select{ position:relative; z-index:1; }



/* ===== Footer ===== */
.site-foot{
    border-top:1px solid var(--line);
    background:linear-gradient(180deg, rgba(10,16,32,.92), rgba(8,14,28,.98));
    padding-top:22px;
}

.f-grid{
    display:grid;
    grid-template-columns: 1.1fr 1fr 1.2fr;
    gap:18px;
    align-items:start;
    padding:10px 16px 22px;
}

/* Brand */
.f-brand{display:flex; gap:12px; align-items:center}
.f-logo{
    width:42px; height:42px; border-radius:12px;
    display:grid; place-items:center;
    background:linear-gradient(180deg, rgba(127,200,255,.14), rgba(255,209,102,.10));
    border:1px solid rgba(127,200,255,.25);
    box-shadow:0 6px 18px rgba(0,0,0,.35);
}
.f-logo svg{width:22px; height:22px; filter: drop-shadow(0 0 10px rgba(127,200,255,.45))}
.f-title{font-weight:900; color:#d8eeff}
.f-sub{font-size:12px; color:#9fb7d4}

/* Nav */
.f-nav{
    display:flex; flex-wrap:wrap; gap:12px;
    padding-top:4px;
}
.f-nav a{
    padding:8px 10px; border-radius:10px; font-weight:700;
    color:#cfe8ff; border:1px solid rgba(127,200,255,.18);
    background:rgba(255,255,255,.03);
}
.f-nav a:hover{ box-shadow:0 0 0 1px rgba(127,200,255,.35) inset }

/* Responsible */
.f-resp{display:grid; gap:10px}
.f-badges{display:flex; gap:8px; flex-wrap:wrap}
.f-chip{
    display:inline-block; padding:6px 10px; border-radius:999px;
    font-size:12px; font-weight:800; color:#dff1ff;
    border:1px solid rgba(127,200,255,.25);
    background:linear-gradient(180deg, rgba(127,200,255,.14), rgba(255,209,102,.10));
}
.f-note{margin:0}

/* Bottom strip */
.f-bottom{
    border-top:1px solid var(--line);
    background:linear-gradient(90deg, rgba(127,200,255,.12), rgba(255,209,102,.10));
}
.f-bottom-inner{
    display:flex; align-items:center; justify-content:space-between;
    gap:12px; padding:10px 16px;
    color:#b7cae2; font-size:12px;
}
.f-links a{color:#cfe8ff}
.f-links .dot{opacity:.6; margin:0 6px}

@media (max-width: 980px){
    .f-grid{grid-template-columns:1fr; }
    .f-bottom-inner{flex-direction:column; align-items:flex-start}
}


/* Logos row */
.f-logos{
    display:flex; flex-wrap:wrap; gap:14px;
    align-items:center;
}
.f-logos img{
    height:28px;
    opacity:.85;
    filter:drop-shadow(0 2px 6px rgba(0,0,0,.45));
    transition:opacity .25s;
}
.f-logos img:hover{opacity:1}

.btn-submit {
    display: block;
    width: 100%;
    padding: 14px;
    border-radius: 12px;
    font-weight: 800;
    font-size: 16px;
    text-align: center;
    color: #00131f;
    background: linear-gradient(180deg, #7fc8ff, #4db6ff);
    box-shadow: 0 0 16px rgba(77,182,255,0.4), inset 0 0 0 1px rgba(0,50,90,0.6);
    border: none;
    cursor: pointer;
    transition: all .25s;
}
.btn-submit:hover {
    transform: translateY(-2px);
    box-shadow: 0 0 26px rgba(127,200,255,0.7);
}
.btn-submit:active {
    transform: scale(.98);
}
.footer {
    background: #0a1020;
    padding: 40px 16px;
    border-top: 1px solid #163054;
    color: #9fb7d4;
    font-size: 14px;
}
.footer-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 24px;
    align-items: center;
}
.footer-brand h3 {
    color: #7fc8ff;
    margin: 0 0 6px;
}
.footer-links a {
    margin-right: 14px;
    color: #bfe3ff;
    text-decoration: none;
}
.footer-links a:hover {
    text-decoration: underline;
}
.footer-services {
    display: flex;
    gap: 18px;
    align-items: center;
    flex-wrap: wrap;
}
.footer-logo {
    height: 36px;
    filter: brightness(0.95);
    transition: transform 0.25s, filter 0.25s;
}
.footer-logo:hover {
    transform: scale(1.08);
    filter: brightness(1.15);
}
.footer-bottom {
    text-align: center;
    margin-top: 22px;
    font-size: 12px;
    color: #6f8baa;
}
@media (max-width:1024px){
    .footer-grid{
        display:flex; flex-direction:column; align-items:center; gap:16px;
        padding:18px 16px 20px;
    }
    .footer-brand{ text-align:center; max-width:820px }
    .footer-services{
        justify-content:center; gap:16px;
        /* делаем «плитку» без изменения HTML */
        display:grid; grid-template-columns:repeat(4, minmax(80px,1fr));
    }
    .footer-logo{ height:30px }
    .footer-links{ justify-content:center }
}

/* ====== МОБИЛЬНЫЕ (≤ 680px) ======
   Большие кликабельные ссылки, лого — плиткой 2хN, всё центрируем */
@media (max-width:680px){
    .footer-grid{ gap:14px }
    .footer-brand{ text-align:center }
    .footer-brand p{ margin:0 }
    .footer-links{
        gap:10px; flex-wrap:wrap; justify-content:center;
    }
    .footer-links a{
        padding:10px 12px; font-weight:700;
        border-radius:12px; /* тап-френдли */
    }
    .footer-services{
        grid-template-columns:repeat(2, minmax(120px,1fr));
        gap:12px 16px; width:100%; max-width:420px;
    }
    .footer-logo{ height:32px } /* чуть крупнее на мобильных */
    .footer-bottom{ font-size:12px; padding:12px 10px }
}

/* ====== ОЧЕНЬ УЗКИЕ (≤ 360px) — плитка 1×N, чтобы не ломалось ====== */
@media (max-width:360px){
    .footer-services{ grid-template-columns:1fr; max-width:260px }
    .footer-logo{ height:28px }
}

@media (max-width:1024px){
    .footer-services{
        display:grid;
        grid-template-columns: repeat(4, minmax(110px, 1fr));
        gap:14px 16px;              /* горизонтальный и вертикальный зазоры */
        justify-items:center; align-items:center;
    }
}

/* Мобильные: адаптивная сетка без «слипания» */
@media (max-width:680px){
    .footer-services{
        display:grid;
        grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
        gap:14px 16px;
    }
    .footer-logo{ height:32px; width:auto; } /* немного крупнее, но в рамках */
}

/* Очень узкие: один столбец, чтобы точно не налезало */
@media (max-width:360px){
    .footer-services{
        grid-template-columns: 1fr;
        gap:12px;
    }
    .footer-logo{ height:28px; }
}
.c-inline-success{
    margin-top:10px;
    padding:12px 14px;
    border-radius:12px;
    border:1px solid rgba(34,197,94,.35);
    background:linear-gradient(180deg, rgba(20,46,32,.9), rgba(16,36,26,.95));
    color:#b8ffd1;
    font-weight:800;
    text-align:center;
    opacity:0; transform:translateY(-6px);
    transition:opacity .25s ease, transform .25s ease;
}
.c-inline-success.show{opacity:1; transform:translateY(0)}




/* ===== Hero: мобильная правка ===== */
@media (max-width: 1220px){
    /* сам блок баннера: не на всю ширину, с воздухом слева/справа */
    .hero{
        margin: 10px 12px 18px;           /* отступы от краёв экрана */
        border-radius: 18px;               /* скругление контейнера */
        overflow: hidden;                  /* обрезать фон внутри скругления */
        box-shadow: 0 18px 40px rgba(0,0,0,.35);
        background: linear-gradient(180deg, rgba(12,20,40,.88), rgba(12,20,40,.72));
    }

    /* внутренние отступы с учётом «чёлки» iOS */
    .hero .container{
        padding-left: max(14px, env(safe-area-inset-left));
        padding-right: max(14px, env(safe-area-inset-right));
        padding-top: 20px;
        padding-bottom: 18px;
    }

    /* сетка и заголовок компактнее */
    .hero-grid{ gap: 18px; padding: 0 }
    .hero h1{
        font-size: clamp(28px, 7.5vw, 36px);
        line-height: 1.08;
        letter-spacing: -0.2px;
        margin: 8px 0 0;
    }

    /* бейдж и кнопки — не упираются в края и не ломают строку */
    .badge{ margin-bottom: 8px; transform: translateX(1px); }
    .hero .btn{ padding: 12px 14px }
    .hero .btn-primary, .hero .btn-outline{
        flex: 1 1 48%;                     /* две кнопки в строку, если помещаются */
        min-width: 140px;
    }

    /* карта оффера внутри hero чуть уже, чтобы не «липла» */
    .hero .card{ margin-inline: 2px }

    /* чипы-логотипы под кнопками — больше воздуха между ними */
    .logo-strip{ gap: 12px; row-gap: 10px }
}

/* На очень узких (<=360px): ещё немного воздуха */
@media (max-width:360px){
    .hero{ margin: 8px 10px 16px }
    .hero .container{ padding-left: 12px; padding-right: 12px }
}


.tips-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
    align-items: center;
}

.tips-card {
    background: rgba(12,20,40,0.6);
    padding: 24px;
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(0,0,0,.3);
}

.tips-image img {
    width: 100%;
    border-radius: 16px;
    box-shadow: 0 12px 35px rgba(0,0,0,.35);
    object-fit: cover;
}

/* На мобилке фото уходит вниз */
@media (max-width: 768px) {
    .tips-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .tips-image img {
        max-height: 260px;
        object-fit: cover;
    }
}
/* ===== PRIVACIDAD — estilo aronline.casino ===== */
.pp-section{
    position:relative;
    padding:64px 0;
    background: radial-gradient(900px 400px at 80% -10%, rgba(127,200,255,.12), transparent 60%),
    radial-gradient(800px 360px at 10% 20%, rgba(255,209,102,.10), transparent 60%),
    var(--bg, #0a1020);
}
.pp-grid{ display:grid; grid-template-columns: 260px 1fr; gap:28px }
@media (max-width: 1024px){ .pp-grid{ grid-template-columns:1fr; } }

/* Hero/intro */
.pp-hero{
    grid-column: 1 / -1;
    text-align:center;
    margin-bottom: 6px;
}
.pp-pill{
    display:inline-block; padding:6px 10px; border-radius:999px;
    border:1px solid rgba(127,200,255,.35); background:rgba(127,200,255,.12);
    color:#cfe8ff; font-size:12px; font-weight:800; letter-spacing:.3px;
}
.pp-hero h1{
    margin:12px 0 6px; font-weight:900; font-size:clamp(28px, 3.2vw, 40px);
    background: linear-gradient(90deg, #eaf6ff, #7fc8ff 45%, #ffd166 90%);
    -webkit-background-clip:text; background-clip:text; color:transparent;
}
.pp-date{ color:#9fb7d4; font-size:13px }
.pp-lead{ color:#d7e6ff; max-width:860px; margin:12px auto 0 }

/* Índice (TOC) */
.pp-toc{
    position:sticky; top:88px; align-self:start;
    background: linear-gradient(180deg, rgba(18,31,56,.9), rgba(14,26,46,.9));
    border:1px solid var(--border, #1e3357); border-radius:16px; padding:16px;
    box-shadow: 0 18px 40px rgba(0,0,0,.25);
}
.pp-toc nav{ display:grid; gap:8px }
.pp-toc a{
    font-size:14px; color:#cfe8ff; opacity:.85; text-decoration:none; padding:6px 8px;
    border-radius:10px; border:1px solid transparent;
}
.pp-toc a:hover{ opacity:1; border-color:rgba(127,200,255,.35); background:rgba(127,200,255,.08) }
@media (max-width:1024px){ .pp-toc{ display:none } }

/* Contenido */
.pp-content{ display:grid; gap:18px }
.pp-card{
    background: linear-gradient(180deg, rgba(18,31,56,.92), rgba(15,26,46,.92));
    border:1px solid var(--border, #1e3357);
    border-radius:16px; padding:22px; color:#eaf2ff;
    box-shadow: 0 18px 40px rgba(0,0,0,.35);
}
.pp-card h2{ margin:0 0 10px; font-weight:900; color:#eaf6ff; }
.pp-card p, .pp-card li{ color:#cfe1ff }
.pp-card ul{ margin:8px 0 0 18px; display:grid; gap:6px }

/* CTA */
.pp-cta{ text-align:center; margin-top:6px }
.pp-cta .btn{ padding:12px 18px; border-radius:14px; font-weight:900 }
.btn.btn-primary{
    background:linear-gradient(180deg, var(--primary, #7fc8ff), var(--primary-600, #4db6ff));
    color:#001120; border:none; box-shadow: 0 0 0 1px rgba(127,200,255,.25), 0 12px 28px rgba(77,182,255,.25);
}
.btn.btn-primary:hover{ filter:brightness(1.05) }

/* ===== PRIVACIDAD — estilo aronline.casino ===== */
.pp-section{
    position:relative;
    padding:64px 0;
    background: radial-gradient(900px 400px at 80% -10%, rgba(127,200,255,.12), transparent 60%),
    radial-gradient(800px 360px at 10% 20%, rgba(255,209,102,.10), transparent 60%),
    var(--bg, #0a1020);
}
.pp-grid{ display:grid; grid-template-columns: 260px 1fr; gap:28px }
@media (max-width: 1024px){ .pp-grid{ grid-template-columns:1fr; } }

/* Hero/intro */
.pp-hero{
    grid-column: 1 / -1;
    text-align:center;
    margin-bottom: 6px;
}
.pp-pill{
    display:inline-block; padding:6px 10px; border-radius:999px;
    border:1px solid rgba(127,200,255,.35); background:rgba(127,200,255,.12);
    color:#cfe8ff; font-size:12px; font-weight:800; letter-spacing:.3px;
}
.pp-hero h1{
    margin:12px 0 6px; font-weight:900; font-size:clamp(28px, 3.2vw, 40px);
    background: linear-gradient(90deg, #eaf6ff, #7fc8ff 45%, #ffd166 90%);
    -webkit-background-clip:text; background-clip:text; color:transparent;
}
.pp-date{ color:#9fb7d4; font-size:13px }
.pp-lead{ color:#d7e6ff; max-width:860px; margin:12px auto 0 }

/* Índice (TOC) */
.pp-toc{
    position:sticky; top:88px; align-self:start;
    background: linear-gradient(180deg, rgba(18,31,56,.9), rgba(14,26,46,.9));
    border:1px solid var(--border, #1e3357); border-radius:16px; padding:16px;
    box-shadow: 0 18px 40px rgba(0,0,0,.25);
}
.pp-toc nav{ display:grid; gap:8px }
.pp-toc a{
    font-size:14px; color:#cfe8ff; opacity:.85; text-decoration:none; padding:6px 8px;
    border-radius:10px; border:1px solid transparent;
}
.pp-toc a:hover{ opacity:1; border-color:rgba(127,200,255,.35); background:rgba(127,200,255,.08) }
@media (max-width:1024px){ .pp-toc{ display:none } }

/* Contenido */
.pp-content{ display:grid; gap:18px }
.pp-card{
    background: linear-gradient(180deg, rgba(18,31,56,.92), rgba(15,26,46,.92));
    border:1px solid var(--border, #1e3357);
    border-radius:16px; padding:22px; color:#eaf2ff;
    box-shadow: 0 18px 40px rgba(0,0,0,.35);
}
.pp-card h2{ margin:0 0 10px; font-weight:900; color:#eaf6ff; }
.pp-card p, .pp-card li{ color:#cfe1ff }
.pp-card ul{ margin:8px 0 0 18px; display:grid; gap:6px }

/* CTA */
.pp-cta{ text-align:center; margin-top:6px }
.pp-cta .btn{ padding:12px 18px; border-radius:14px; font-weight:900 }
.btn.btn-primary{
    background:linear-gradient(180deg, var(--primary, #7fc8ff), var(--primary-600, #4db6ff));
    color:#001120; border:none; box-shadow: 0 0 0 1px rgba(127,200,255,.25), 0 12px 28px rgba(77,182,255,.25);
}
.btn.btn-primary:hover{ filter:brightness(1.05) }
/* TERMS: страница без левого сайдбара — растягиваем контент на всю ширину */
#tc-terminos .pp-content { grid-column: 1 / -1; }  /* контент на обе колонки */
#tc-terminos .pp-hero    { grid-column: 1 / -1; }  /* заголовок тоже на обе */
/* =========================================================
   Términos y Condiciones (sección #privacidad)
   — Без левого TOC: одна колонка, контент — во всю ширину
   — Акценты в голубых тонах (без жёлтых)
   ========================================================= */

/* 1) Сетка: здесь одна колонка, чтобы контент не «зажимался» */
#privacidad .pp-grid{
    display:grid;
    grid-template-columns: 1fr;   /* было 260px 1fr, здесь не нужен сайдбар */
    gap: 24px;
}

/* На всякий, ещё и явно тянем геро и контент на весь ряд */
#privacidad .pp-hero,
#privacidad .pp-content{
    grid-column: 1 / -1;
}

/* 2) Хиро-блок под стиль сайта (без жёлтого) */
#privacidad .pp-hero{
    text-align:center;
    margin-bottom: 14px;
}
#privacidad .pp-hero .pp-pill{
    display:inline-block;
    padding:7px 12px;
    border-radius:999px;
    border:1px solid rgba(127,200,255,.3);
    background:rgba(127,200,255,.12);
    color:#bfe3ff;
    font-weight:800;
    font-size:12px;
    letter-spacing:.3px;
}
#privacidad .pp-hero h1{
    margin:10px 0 6px;
    font-weight:900;
    line-height:1.1;
    /* мягкий голубой градиент без жёлтого */
    background:linear-gradient(90deg,#eaf6ff 0%, #bfe3ff 45%, #7fc8ff 100%);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}
#privacidad .pp-hero .pp-date{
    color: var(--muted);
    font-size:14px;
}

/* 3) Карточки текста — те же, что на «Политике», в твоей палитре */
#privacidad .pp-card{
    background:linear-gradient(180deg, rgba(18,31,56,.92), rgba(15,26,46,.92));
    border:1px solid var(--border);
    border-radius:16px;
    padding:22px;
    box-shadow: var(--shadow);
}
#privacidad .pp-card + .pp-card{ margin-top:16px; }

#privacidad .pp-card h2{
    margin:0 0 10px;
    font-weight:900;
    color:#e6f4ff;
}

/* списки — аккуратные «пилюли»-маркеры в голубом */
#privacidad .pp-card ul{
    margin:8px 0 0;
    padding-left:0;
    list-style:none;
}
#privacidad .pp-card ul li{
    position:relative;
    padding-left:24px;
    margin:8px 0;
}
#privacidad .pp-card ul li::before{
    content:"";
    position:absolute; left:0; top:10px;
    width:10px; height:10px; border-radius:50%;
    background:#7fc8ff;
    box-shadow:0 0 10px rgba(127,200,255,.45);
}

/* 4) Кнопка в конце */
#privacidad .pp-cta{
    text-align:center;
    margin-top:18px;
}
#privacidad .pp-cta .btn{
    display:inline-flex; align-items:center; justify-content:center;
    padding:12px 18px; border-radius:16px; font-weight:800;
    background:linear-gradient(180deg, var(--primary), var(--primary-600));
    color:#00111e; box-shadow:var(--glow);
}

/* 5) Адаптив: на мобильном и так одна колонка, просто добавим интервалы */
@media (max-width: 768px){
    #privacidad .pp-card{ padding:18px; }
    #privacidad .pp-hero h1{ font-size:28px; }
}

/* 6) Немного воздуха сверху/снизу у секции */
#privacidad.pp-section{ padding: 72px 0; }


/* Ошибка поля */
.is-invalid { outline: 2px solid #ff6b6b; outline-offset: 2px; }
.c-field .c-error { display: none; color: #ffb3b3; font-size: 12px; margin-top: 6px; }

/* Ошибка для чекбокса */
.c-check .is-invalid { outline: 2px solid #ff6b6b; }

/* Тост-уведомление */
.c-toast{
    position: fixed; left:50%; bottom: 22px; transform: translateX(-50%) translateY(8px);
    background: linear-gradient(180deg, #0f1a2e, #0b1528);
    border:1px solid rgba(127,200,255,.3);
    color:#eaf2ff; padding:12px 16px; border-radius:12px;
    box-shadow: 0 10px 30px rgba(0,0,0,.35);
    opacity:0; transition: opacity .2s ease, transform .2s ease;
    z-index: 9999; font-weight: 700;
}
.c-toast.is-show{ opacity:1; transform: translateX(-50%) translateY(0); }


/* ===== Age Gate ===== */
.agegate{ position:fixed; inset:0; z-index:1200; display:none; }
.agegate.is-open{ display:block; }
.agegate__backdrop{ position:absolute; inset:0; background:rgba(8,14,28,.8); backdrop-filter:blur(4px); }
.agegate__box{
    position:relative; z-index:1;
    max-width:560px; margin:8vh auto; padding:24px;
    border-radius:20px;
    background:linear-gradient(180deg, rgba(17,29,50,.96), rgba(13,23,45,.96));
    border:1px solid rgba(127,200,255,.25);
    box-shadow:0 24px 80px rgba(0,0,0,.55);
    color:#eaf2ff;
}
.agegate__pill{
    display:inline-block; font-size:11px; font-weight:800; letter-spacing:.2px;
    padding:6px 10px; border-radius:999px;
    background:rgba(127,200,255,.12); border:1px solid rgba(127,200,255,.3); color:#bfe3ff;
}
.agegate__head h3{ margin:10px 0 6px; font-size:24px; }
.agegate__sub{ margin:0; color:#9fb7d4; }
.agegate__actions{ display:flex; gap:10px; margin-top:16px; }
.agegate__actions .btn{
    flex:1 1 auto; padding:12px 16px; border-radius:14px; font-weight:800; letter-spacing:.2px;
}
.btn.btn-primary{ background:linear-gradient(180deg,#7fc8ff,#4db6ff); color:#00111e; box-shadow:0 0 0 1px rgba(127,200,255,.25), 0 0 24px rgba(77,182,255,.25); border:none; }
.btn.btn-outline{ border:1px solid #1e3357; background:transparent; color:#cfe8ff; }
.agegate__logos{ display:flex; gap:12px; align-items:center; margin-top:14px; opacity:.9; flex-wrap:wrap; }
.agegate__logos img{ height:24px; width:auto; display:block; filter:drop-shadow(0 1px 2px rgba(0,0,0,.25)); }

/* блокируем прокрутку, пока открыт age-gate */
body.modal-open{ overflow:hidden; }