/* =========================================================
DefenSMS – Style principal (briceneman.com vibe)
Fichier : /defensms/defensms.css
========================================================= */

/* ===== Palette ===== */
:root{
--bg-body:#050816;
--bg-card:#0b1020;
--bg-card-soft:#101827;
--accent:#2563eb;
--accent-soft:#1d4ed8;
--text-main:#f9fafb;
--text-muted:#cbd5f5;
--link:#38bdf8;
--link-hover:#7dd3fc;
--border-soft:rgba(148,163,184,.4);
--radius-lg:18px;
}


/* ===== Base ===== */
*,
*::before,
*::after{
box-sizing:border-box;
}

html, body{
height:100%;
}

body{
margin:0;
font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
background:radial-gradient(circle at top,#0b1120 0,#020617 55%,#000 100%);
color:var(--text-main);
}

a{
color:var(--link);
text-decoration:none;
}
a:hover{
color:var(--link-hover);
text-decoration:underline;
}

/* ===== En-tête / nav ===== */
.site-header{
background:linear-gradient(90deg,#020617,#020617 40%,#020617 100%);
border-bottom:1px solid rgba(148,163,184,.3);
}

.site-header-inner{
max-width:1000px;
margin:0 auto;
padding:16px 20px;
display:flex;
align-items:center;
justify-content:space-between;
gap:14px;
}

.site-title{
font-weight:700;
letter-spacing:.06em;
font-size:18px;
text-transform:uppercase;
}

.site-nav a{
margin-left:16px;
font-size:14px;
color:var(--text-muted);
}
.site-nav a:hover,
.site-nav a.active{
color:var(--link);
}

/* Mobile nav */
@media (max-width:820px){
.site-header-inner{
flex-direction:column;
align-items:flex-start;
}
.site-nav a{
margin-left:0;
margin-right:14px;
display:inline-block;
margin-top:8px;
}
}

/* ===== Contenu principal ===== */
.page-wrap{
max-width:1000px;
margin:32px auto 28px;
padding:0 20px;
}

.page-card{
background:radial-gradient(circle at top left,#111827 0,#020617 65%);
border-radius:var(--radius-lg);
padding:28px 24px 32px;
border:1px solid var(--border-soft);
box-shadow:0 30px 60px rgba(15,23,42,.8);
}

.page-title-pill{
display:inline-block;
background:linear-gradient(90deg,#111827,#0b1120);
border-radius:999px;
padding:6px 14px;
font-size:12px;
letter-spacing:.08em;
text-transform:uppercase;
color:var(--text-muted);
border:1px solid var(--border-soft);
margin-bottom:14px;
}

h1{
margin:0 0 14px;
font-size:26px;
}

h2{
margin-top:24px;
margin-bottom:8px;
font-size:20px;
}

h3{
margin-top:18px;
margin-bottom:6px;
font-size:17px;
}

p{
margin:8px 0;
line-height:1.6;
color:var(--text-muted);
}

ul, ol{
margin:6px 0 10px;
padding-left:20px;
color:var(--text-muted);
}

li{
margin:6px 0;
}

/* ===== Bloc Google Play ===== */
.gp-section{
margin-top:22px;
}

.gp-card{
background:rgba(255,255,255,.02);
border:1px solid rgba(148,163,184,.25);
border-radius:var(--radius-lg);
padding:18px;
box-shadow:0 20px 40px rgba(15,23,42,.35);
}

.gp-title{
margin:0 0 8px;
font-size:20px;
color:var(--text-main);
}

.gp-subtitle{
margin:0 0 14px;
color:var(--text-muted);
}

/* Badge + bouton */
.gp-actions{
display:flex;
flex-wrap:wrap;
justify-content:center;
align-items:center;
gap:14px;
margin:10px 0 16px;
text-align:center;
}

.gp-badge{
display:inline-block;
}

.gp-badge img{
height:60px;
width:auto;
display:block;
}

.gp-btn{
display:inline-block;
padding:12px 18px;
border-radius:999px;
background:#0B1F3B;
color:#fff !important;
text-decoration:none;
font-weight:700;
border:1px solid rgba(255,255,255,.10);
}
.gp-btn:hover{
opacity:.92;
}

/* QR + texte */
.gp-qr-wrap{
display:flex;
gap:16px;
align-items:center;
justify-content:center;
flex-wrap:wrap;
margin-top:6px;
}

.gp-qr-box{
display:inline-block;
background:#fff;
padding:12px;
border-radius:12px;
border:1px solid rgba(0,0,0,.18);
}

.gp-qr{
display:block;
width:180px;
height:180px;
}

.gp-qr-title{
margin:0 0 6px;
font-weight:700;
color:var(--text-main);
}

.gp-qr-text{
margin:0 0 6px;
color:var(--text-muted);
}

.gp-note{
margin:0;
color:var(--text-muted);
opacity:.9;
font-size:.95em;
}

.gp-card a{
text-decoration:none;
}

/* ===== Footer ===== */
.page-footer{
max-width:1000px;
margin:0 auto 28px;
padding:0 20px;
font-size:12px;
color:#64748b;
text-align:right;
}