/* Components — glass, buttons, cards, lists, slider, badges */
.glass{margin-top:clamp(12px,3.0vw,28px);background:rgba(255,255,255,0.22);border:1px solid rgba(255,255,255,0.42);border-radius:16px;box-shadow:0 12px 36px rgba(0,0,0,0.14);backdrop-filter:blur(14px) saturate(150%);-webkit-backdrop-filter:blur(14px) saturate(150%);overflow:clip;padding:clamp(14px,2.2vw,22px);color:var(--text)}
@media(prefers-color-scheme:dark){.glass{background:rgba(12,16,20,0.72);border:1px solid rgba(255,255,255,0.08);box-shadow:0 14px 46px rgba(0,0,0,0.6)}}
.card .card-title, .card h2, .card h3{color:var(--text-strong)}
.kicker{display:inline-block;padding:6px 10px;border-radius:999px;background:rgba(16,33,54,.08);color:var(--accent-blue);border:1px solid var(--border);font-size:12px;letter-spacing:.35px;text-transform:uppercase}
@media(prefers-color-scheme:dark){.kicker{background:rgba(255,255,255,.04);color:var(--accent-blue);border-color:rgba(255,255,255,.06)}}
.hero__cta{display:grid;gap:14px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:10px 14px;border-radius:12px;font-weight:700;letter-spacing:.2px;cursor:pointer;text-align:center;transition:transform .08s ease,box-shadow .12s ease,background-color .12s ease,color .12s ease;border:0}
.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(0)}
.btn:focus-visible{outline:3px solid rgba(26,200,196,.18);outline-offset:3px}
.btn-primary{background-color:var(--accent-teal);color:#042926}
.btn-secondary{background-color:var(--accent-blue);color:#05243b}
.btn-ghost{background:transparent;color:var(--text);border:1px solid rgba(0,0,0,.06)}
.card{background:rgba(255,255,255,0.20);border:1px solid rgba(255,255,255,0.36);border-radius:14px;padding:clamp(14px,2vw,20px);box-shadow:0 8px 28px rgba(0,0,0,0.12);backdrop-filter:blur(12px) saturate(135%);-webkit-backdrop-filter:blur(12px) saturate(135%);color:var(--text)}
@media(prefers-color-scheme:dark){.card{background:rgba(8,10,12,0.68);border:1px solid rgba(255,255,255,0.06);box-shadow:0 12px 34px rgba(0,0,0,0.5)}}
.list{display:grid;gap:8px;margin:10px 0 0;padding-left:18px}
.badge{padding:6px 10px;border-radius:999px;border:1px solid var(--border);background:rgba(26,200,196,.12);color:#0d5c5a;font-weight:600;font-size:12px}
.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px}
.metric{background:rgba(255,255,255,0.16);border:1px solid rgba(255,255,255,0.24);border-radius:12px;padding:18px;text-align:center;backdrop-filter:blur(12px) saturate(130%);-webkit-backdrop-filter:blur(12px) saturate(130%)}
@media(prefers-color-scheme:dark){.metric{background:rgba(6,8,10,0.64);border:1px solid rgba(255,255,255,0.06)}}
.metric .num{font-weight:700;font-size:clamp(24px,3vw,36px);color:var(--text-strong)}
.metric .label{color:var(--text-muted);font-size:13px}

/* Slider */
.slider{position:relative;overflow:hidden;border-radius:16px;box-shadow:var(--shadow-lg);margin-top:14px}
.slides{display:flex;transition:transform .6s cubic-bezier(.4,0,.2,1)}
.slide{min-width:100%;padding:clamp(18px,3.5vw,36px);background:rgba(255,255,255,0.16);backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);border-right:1px solid rgba(255,255,255,0.14)}
@media(prefers-color-scheme:dark){.slide{background:rgba(8,10,12,0.6);border-right:1px solid rgba(255,255,255,0.06)}}
.slide .row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:880px){.slide .row{grid-template-columns:1fr}}
.slide .stars{display:flex;gap:4px}
.slide .stars span{color:#ffcc00;font-size:18px}
.slider-nav{display:flex;justify-content:center;gap:10px;margin-top:14px}
.slider-nav button{width:12px;height:12px;border-radius:50%;background:var(--text-muted);border:none;cursor:pointer;transition:.3s}
.slider-nav button.active{background:var(--accent-blue);transform:scale(1.2)}
.slider-arrows{position:absolute;inset:0;display:flex;align-items:center;justify-content:space-between;padding:0 6px;pointer-events:none}
.slider-arrows button{pointer-events:auto;border:none;background:rgba(0,0,0,.25);color:#fff;border-radius:999px;width:36px;height:36px;display:grid;place-items:center}

/* Footer — stronger & centered */
.footer-strong{margin-top:60px;padding:24px;border-top:1px solid var(--border);background:linear-gradient(180deg,rgba(var(--glass-bg),.08),rgba(var(--glass-bg),.04));backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%)}
@media(prefers-color-scheme:dark){.footer-strong{background:linear-gradient(180deg, rgba(0,0,0,.40), rgba(0,0,0,.18)); border-color: rgba(255,255,255,.06)}}
.footer-strong .footer-links{display:flex;gap:10px;align-items:center;justify-content:center}
.footer-strong .footer-links span{color:var(--text-muted);padding:0 8px}
@media(max-width:767.98px){
	.footer-strong .footer-links{flex-direction:column;gap:10px}
	.footer-strong .footer-links span{display:none}
	.footer-strong .footer-links a.btn{width:100%;max-width:360px}
	.footer-strong .wrap{padding-left:16px;padding-right:16px}
}
.footer-strong .title{font-weight:700;color:var(--text-strong)}

/* Glass button component and Bootstrap variant palette */
.glass-button {
	z-index: 9999;
	position: relative;
	padding: 1.2rem 2.5rem;
	font-size: 1.1rem;
	font-weight: 600;
	color: #000;
	background: rgba(255, 255, 255, 0.18);
	border: 1px solid rgba(255, 255, 255, 0.36);
	border-radius: 16px;
	cursor: pointer;
	box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.15);
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.glass-button span { width: 100%; height: 100%; position: relative; display: inline-block }
.glass-container { position: absolute; inset: 0; border-radius: 16px; height: 100%; width: 100%; pointer-events: none }
.glass-effect-backdrop { border-radius: 16px; position: absolute; left: 0; right: 0; top: 0; bottom: 0; -webkit-backdrop-filter: blur(0.5px); backdrop-filter: blur(0.5px); }
.glass-effect { border-radius: 9999px; position: absolute; left: 0px; right: 0; height: 0.8rem; width: 100%; -webkit-backdrop-filter: blur(0.5px); backdrop-filter: blur(0.5px); }
.glass-effect.top { top: 0; }
.glass-effect.bottom { bottom: 0; }
.glass-effect.left { left: 0; top: 0; bottom: 0; width: 0.8rem; height: 100%; }
.glass-effect.right { right: 0; left: auto; top: 0; bottom: 0; width: 0.8rem; height: 100%; }

/* Color palette variables for glass buttons (use existing theme variables where possible) */
:root{
	--btn-primary-glass: 26,200,196;
	--btn-secondary-glass: 58,160,240;
	--btn-success-glass: 43,196,122;
	--btn-danger-glass: 231,76,60;
	--btn-warning-glass: 246,194,62;
	--btn-info-glass: 111,156,255;
	--btn-dark-glass: 8,12,20;
}

/* Variant rules: apply glass look when using the helper class */
.btn.glass-button, button.glass-button, a.btn.glass-button {
	padding: 1rem 1.6rem; font-size: 1rem; border-radius: 12px; font-weight:600;
}
.btn-primary.glass-button{ background: rgba(var(--btn-primary-glass),0.14); color:#042926; border:1px solid rgba(var(--btn-primary-glass),0.28); box-shadow:0 8px 28px rgba(10,120,115,0.10)}
.btn-secondary.glass-button{ background: rgba(var(--btn-secondary-glass),0.12); color:#05243b; border:1px solid rgba(var(--btn-secondary-glass),0.22); box-shadow:0 8px 28px rgba(20,90,160,0.08)}
.btn-success.glass-button{ background: rgba(var(--btn-success-glass),0.12); color:#042a1f; border:1px solid rgba(var(--btn-success-glass),0.26)}
.btn-danger.glass-button{ background: rgba(var(--btn-danger-glass),0.12); color:#3a0f0b; border:1px solid rgba(var(--btn-danger-glass),0.26)}
.btn-warning.glass-button{ background: rgba(var(--btn-warning-glass),0.12); color:#3b2a00; border:1px solid rgba(var(--btn-warning-glass),0.28)}
.btn-info.glass-button{ background: rgba(var(--btn-info-glass),0.12); color:#07204b; border:1px solid rgba(var(--btn-info-glass),0.24)}
.btn-light.glass-button{ background: rgba(255,255,255,0.18); color:#042926; border:1px solid rgba(255,255,255,0.36)}
.btn-dark.glass-button{ background: rgba(var(--btn-dark-glass),0.42); color:#eef3f8; border:1px solid rgba(255,255,255,0.06)}

/* Hover & active states */
.btn.glass-button:hover{ transform:translateY(-2px); filter:brightness(1.03); }
.btn.glass-button:active{ transform:translateY(0); filter:brightness(.98) }

@media(prefers-color-scheme:dark){
	.glass-button{ background: rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.06); color:var(--text); box-shadow:0 8px 28px rgba(0,0,0,0.4)}
	.btn-primary.glass-button{ background: rgba(var(--btn-primary-glass),0.16); color:#e8f8f6; border:1px solid rgba(var(--btn-primary-glass),0.28)}
	.btn-secondary.glass-button{ background: rgba(var(--btn-secondary-glass),0.14); color:#eaf6ff}
	.btn-light.glass-button{ background: rgba(255,255,255,0.06); color:var(--text-strong); border:1px solid rgba(255,255,255,0.06)}
}