/* ======================================
   GLADKI BAU PREMIUM V3
====================================== */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');

:root{

--primary:#ff7a00;
--primary-dark:#e76e00;

--secondary:#0d1b2a;

--dark:#111827;
--light:#ffffff;

--gray:#f5f7fa;
--text:#4b5563;

--shadow:0 12px 35px rgba(0,0,0,.10);

--radius:18px;

}

*{
margin:0;
padding:0;
box-sizing:border-box;
}

html{
scroll-behavior:smooth;
}

body{

font-family:'Poppins',sans-serif;

background:#fff;

color:#222;

line-height:1.7;

overflow-x:hidden;

-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;

}

img{
max-width:100%;
display:block;
}

a{
text-decoration:none;
}

ul{
list-style:none;
}

.container{

width:90%;
max-width:1280px;

margin:auto;

}

/* ==========================
   TOP BAR
========================== */

.top-bar{

background:#111827;

color:#fff;

font-size:14px;

padding:10px 0;

}

.top-bar-content{

display:flex;

justify-content:space-between;

align-items:center;

gap:20px;

flex-wrap:wrap;

}

.top-bar i{

color:var(--primary);

margin-right:8px;

}

/* ==========================
   HEADER
========================== */

.header{
  position:fixed;
  top:42px;
  left:0;
  width:100%;
  z-index:9999;

  background:rgba(255,255,255,.88);
  backdrop-filter: blur(14px);

  border-bottom: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 10px 30px rgba(0,0,0,.08);

  transition: .3s ease;
}

.header.scrolled{
  top:0;
  background:#fff;
  box-shadow: 0 15px 40px rgba(0,0,0,.12);
  border-bottom: 1px solid rgba(0,0,0,.08);
}

.nav{
  height:92px;
  display:flex;
  justify-content:space-between;
  align-items:center;
}

/* LOGO PREMIUM */
.logo{
  background:#111;
  padding:10px 16px;
  border-radius:12px;
  display:inline-flex;
  align-items:center;
  box-shadow:0 8px 18px rgba(0,0,0,.15);
  transition:.3s;
}

.logo img{
  height:58px;
  display:block;
  transition:.3s;
}

.logo:hover{
  transform: translateY(-1px);
}

.logo:hover img{
  transform: scale(1.05);
}

/* MENU */
nav ul{
  display:flex;
  gap:30px;
  align-items:center;
}

nav ul li a{
  font-size:15px;
  font-weight:600;
  color:#111;
  position:relative;
  padding:6px 0;
  transition:.25s;
}

nav ul li a::after{
  content:'';
  position:absolute;
  left:0;
  bottom:-6px;
  width:0%;
  height:2px;
  background:var(--primary);
  transition:.3s;
}

nav ul li a:hover::after{
  width:100%;
}

nav ul li a:hover{
  color:var(--primary);
}

/* BUTTON CTA */
.nav-btn{
  background: linear-gradient(135deg, var(--primary), var(--primary-dark));
  color:#fff;
  padding:14px 28px;
  border-radius:50px;
  font-weight:700;

  box-shadow:0 12px 25px rgba(255,122,0,.25);
  transition:.3s;
}

.nav-btn:hover{
  transform: translateY(-3px);
  box-shadow:0 18px 35px rgba(255,122,0,.35);
}

/* PHONE */
.phone-header{
  font-weight:700;
  color:#0d1b2a;

  padding:12px 18px;
  border:2px solid #ff7a00;
  border-radius:50px;

  transition:.3s;
  white-space:nowrap;
}

.phone-header:hover{
  background:#ff7a00;
  color:#fff;
  transform: translateY(-2px);
}

.nav-right{
  display:flex;
  align-items:center;
  gap:15px;
}
/* ==========================
   HERO
========================== */

.hero{
    position:relative;
    min-height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    overflow:hidden;

    background:
    linear-gradient(rgba(0,0,0,.45),rgba(0,0,0,.45)),
    url("https://images.unsplash.com/photo-1504307651254-35680f356dfd?auto=format&fit=crop&w=2000&q=80");

    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
}

.hero-content{
    position:relative;
    z-index:2;
    max-width:1100px;
    width:100%;
    padding:120px 20px 60px;
}

.hero-logo{
    width:950px;
    max-width:95%;
    display:block;
    margin:0 auto 35px;

    filter:
    drop-shadow(0 0 30px rgba(255,255,255,.15))
    drop-shadow(0 20px 40px rgba(0,0,0,.7));
}

.hero-description{
    max-width:900px;
    margin:auto;
    font-size:26px;
    line-height:1.8;
    font-weight:500;
    color:#fff;
    text-shadow:0 3px 15px rgba(0,0,0,.8);
}

.hero-buttons{
    margin-top:45px;
    display:flex;
    justify-content:center;
    gap:20px;
    flex-wrap:wrap;
}

.btn-orange{
    background:#ff6b00;
    color:#fff;
    padding:18px 40px;
    border-radius:50px;
    font-weight:700;
    text-decoration:none;
    box-shadow:0 10px 25px rgba(255,107,0,.35);
    transition:.3s;
}

.btn-orange:hover{
    transform:translateY(-4px);
}

.btn-white{
    background:rgba(255,255,255,.12);
    backdrop-filter:blur(8px);
    color:#fff;
    border:2px solid rgba(255,255,255,.8);
    padding:18px 40px;
    border-radius:50px;
    font-weight:700;
    text-decoration:none;
    transition:.3s;
}

.btn-white:hover{
    background:#fff;
    color:#111;
}

@media(max-width:768px){

.hero{
    min-height:85vh;
}

.hero-logo{
    width:300px;
}

.hero-description{
    font-size:18px;
    line-height:1.6;
}

.hero-buttons{
    flex-direction:column;
    align-items:center;
}

.btn-orange,
.btn-white{
    width:280px;
}
}
/* ANIMATION */

@keyframes fadeUp{

from{
opacity:0;
transform:translateY(40px);
}

to{
opacity:1;
transform:translateY(0);
}

}

.hero-content{

animation:fadeUp 1s ease;

}
/* ==========================
   STATS
========================== */

.stats{

background:#111827;

padding:90px 0;

}

.stats-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:30px;

}

.stat-box{

background:#1f2937;

padding:40px 25px;

border-radius:var(--radius);

text-align:center;

border:1px solid rgba(255,255,255,.05);

transition:.35s;

}

.stat-box:hover{

transform:translateY(-8px);

box-shadow:0 20px 40px rgba(0,0,0,.15);

border-color:rgba(255,122,0,.30);

}

.stat-box h3{

font-size:50px;

font-weight:800;

color:var(--primary);

margin-bottom:10px;

}

.stat-box p{

color:#d1d5db;

font-size:16px;

}

/* ==========================
   SECTION TITLES
========================== */

.section-title{

text-align:center;

font-size:48px;

font-weight:800;

color:var(--secondary);

margin-bottom:70px;

position:relative;

}

.section-title::after{

content:'';

position:absolute;

left:50%;

transform:translateX(-50%);

bottom:-18px;

width:90px;

height:4px;

background:var(--primary);

border-radius:20px;

}

/* ==========================
   SERVICES
========================== */

.services{

padding:120px 0;

background:var(--gray);

}

.services-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:30px;

}

.service-card{

background:white;

padding:40px 35px;

border-radius:var(--radius);

box-shadow:var(--shadow);

transition:.35s;

position:relative;

overflow:hidden;

}

.service-card::before{

content:'';

position:absolute;

top:0;

left:0;

width:100%;

height:5px;

background:var(--primary);

transform:scaleX(0);

transform-origin:left;

transition:.35s;

}

.service-card:hover::before{

transform:scaleX(1);

}

.service-card:hover{

transform:translateY(-10px);

}

.service-card i{

font-size:48px;

color:var(--primary);

margin-bottom:20px;

display:block;

}

.service-card h3{

font-size:24px;

font-weight:700;

margin-bottom:15px;

color:var(--secondary);

}

.service-card p{

font-size:15px;

color:var(--text);

}

/* ==========================
   ABOUT
========================== */

.about{

padding:120px 0;

background:white;

}

.about-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:70px;

align-items:center;

}

.about-image{

position:relative;

}

.about-image img{
width:100%;
height:450px;
object-fit:cover;

border-radius:20px;

box-shadow:0 20px 40px rgba(0,0,0,.15);

transition:.4s;
}

.about-image img:hover{
transform:scale(1.02);
}

.about-image::after{

content:'';

position:absolute;

right:-20px;

bottom:-20px;

width:120px;

height:120px;

background:var(--primary);

border-radius:20px;

z-index:-1;

}

.about-text h2{

font-size:42px;

font-weight:800;

color:var(--secondary);

margin-bottom:25px;

}

.about-text p{

font-size:17px;

color:var(--text);

margin-bottom:20px;

}

.about-text ul{

margin-top:20px;

}

.about-text ul li{

padding:12px 0;

font-size:17px;

font-weight:600;

border-bottom:1px solid #ececec;

}

/* ==========================
   ADVANTAGES
========================== */

.advantages-section{

padding:120px 0;

background:white;

}

.advantages-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:30px;

}

.advantage-card{

background:#f8fafc;

padding:35px;

border-radius:var(--radius);

box-shadow:var(--shadow);

text-align:center;

transition:.35s;

}

.advantage-card:hover{

transform:translateY(-8px);

}

.advantage-icon{

width:70px;

height:70px;

background:var(--primary);

color:white;

font-size:28px;

font-weight:700;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

margin:0 auto 20px;

}

.advantage-card h3{

font-size:24px;

margin-bottom:12px;

color:var(--secondary);

}

.advantage-card p{

color:var(--text);

font-size:15px;

}
/* ==========================
   REFERENZEN / GALLERY
========================== */

.gallery-section{

padding:120px 0;

background:#f8fafc;

}

.gallery{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:25px;

}

.gallery img{

width:100%;

height:320px;

object-fit:cover;

border-radius:18px;

cursor:pointer;

transition:.45s;

box-shadow:0 15px 35px rgba(0,0,0,.10);

}

.gallery img:hover{

transform:scale(1.05);

box-shadow:0 25px 50px rgba(0,0,0,.18);

}

/* ==========================
   REVIEWS
========================== */

.reviews{

padding:120px 0;

background:white;

}

.reviews-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:30px;

}

.review-card{

background:#f8fafc;

padding:40px;

border-radius:18px;

box-shadow:var(--shadow);

transition:.35s;

}

.review-card:hover{

transform:translateY(-8px);

}

.stars{

font-size:24px;

color:#ffb400;

margin-bottom:20px;

letter-spacing:3px;

}

.review-card p{

font-size:16px;

color:var(--text);

margin-bottom:20px;

}

.review-card h4{

font-size:18px;

font-weight:700;

color:var(--secondary);

}

/* ==========================
   CTA
========================== */

.cta{

padding:110px 0;

background:linear-gradient(
135deg,
#0d1b2a,
#1f2937
);

text-align:center;

color:white;

}

.cta h2{

font-size:48px;

font-weight:800;

margin-bottom:20px;

}

.cta p{

font-size:19px;

max-width:700px;

margin:auto;

margin-bottom:35px;

color:#e5e7eb;

}

/* ==========================
   CONTACT
========================== */

.contact{

padding:120px 0;

background:white;

}

.contact-box{

display:grid;

grid-template-columns:400px 1fr;

gap:50px;

align-items:start;

}

.contact-info{

background:linear-gradient(
135deg,
#0d1b2a,
#1f2937
);

padding:40px;

border-radius:18px;

color:white;

box-shadow:var(--shadow);

}

.contact-info h3{

font-size:30px;

font-weight:700;

margin-bottom:25px;

}

.contact-info p{

font-size:17px;

margin-bottom:18px;

color:#e5e7eb;

}

.contact-form{

background:white;

padding:40px;

border-radius:18px;

box-shadow:var(--shadow);

}

.contact-form form{

display:flex;

flex-direction:column;

gap:20px;

}

.contact-form input,
.contact-form textarea{

width:100%;

padding:18px 20px;

border:1px solid #d1d5db;

border-radius:12px;

font-size:16px;

font-family:'Poppins',sans-serif;

transition:.3s;

}

.contact-form input:focus,
.contact-form textarea:focus{

outline:none;

border-color:var(--primary);

box-shadow:0 0 0 4px rgba(255,122,0,.15);

}

.contact-form textarea{

height:180px;

resize:none;

}

.contact-form button{

background:var(--primary);

color:white;

border:none;

padding:18px;

font-size:17px;

font-weight:700;

border-radius:12px;

cursor:pointer;

transition:.3s;

}

.contact-form button:hover{

background:var(--primary-dark);

transform:translateY(-3px);

}

/* ==========================
   MAP SECTION
========================== */

.map-section{

padding:120px 0;

background:#f8fafc;

}

.map-text{

text-align:center;

font-size:18px;

color:var(--text);

max-width:900px;

margin:0 auto 40px;

}

.map-wrapper{

overflow:hidden;

border-radius:18px;

box-shadow:0 20px 45px rgba(0,0,0,.12);

}

.map-wrapper iframe{

width:100%;

height:450px;

border:none;

display:block;

}

/* ==========================
   SEO TEXT SECTION
========================== */

.seo-section{

padding:100px 0;

background:white;

}

.seo-section h2{

font-size:38px;

font-weight:800;

color:var(--secondary);

margin-bottom:25px;

text-align:center;

}

.seo-section p{

max-width:1000px;

margin:auto;

text-align:center;

font-size:17px;

color:var(--text);

line-height:1.9;

}
/* ==========================
   FOOTER PREMIUM
========================== */

footer{

background:#111827;

color:white;

padding:80px 0 30px;

border-top:4px solid var(--primary);

}

.footer-container{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:40px;

margin-bottom:40px;

}

.footer-column img{

height:80px;

margin-bottom:20px;

}

.footer-column h3{

font-size:22px;

margin-bottom:20px;

font-weight:700;

}

.footer-column p,
.footer-column li{

color:#d1d5db;

font-size:15px;

margin-bottom:10px;

line-height:1.8;

}

.footer-column ul{

padding:0;

}

footer hr{

border:none;

height:1px;

background:rgba(255,255,255,.10);

margin:30px 0;

}

.footer-links{

display:flex;

justify-content:center;

gap:30px;

margin-bottom:20px;

}

.footer-links a{

color:#d1d5db;

font-weight:600;

transition:.3s;

}

.footer-links a:hover{

color:var(--primary);

}

.footer-bottom{

text-align:center;

color:#9ca3af;

font-size:14px;

}

/* ==========================
   WHATSAPP BUTTON
========================== */

.whatsapp-float{

position:fixed;

right:25px;

bottom:25px;

background:#25D366;

color:white;

padding:16px 22px;

border-radius:50px;

font-size:17px;

font-weight:700;

display:flex;

align-items:center;

gap:10px;

z-index:9999;

box-shadow:0 15px 35px rgba(37,211,102,.35);

transition:.3s;

}

.whatsapp-float:hover{

transform:translateY(-4px);

color:white;

}

.whatsapp-float i{

font-size:26px;

}

/* ==========================
   BACK TO TOP
========================== */

.back-to-top{

position:fixed;

left:25px;

bottom:25px;

width:55px;

height:55px;

background:var(--primary);

color:white;

border-radius:50%;

display:flex;

align-items:center;

justify-content:center;

font-size:20px;

z-index:9998;

box-shadow:0 10px 30px rgba(255,122,0,.30);

transition:.3s;

}

.back-to-top:hover{

background:var(--primary-dark);

transform:translateY(-4px);

color:white;

}

/* ==========================
   COOKIE INFO
========================== */

.cookie-info{

background:#f8fafc;

text-align:center;

padding:14px;

font-size:14px;

color:#6b7280;

border-top:1px solid #e5e7eb;

}

/* ==========================
   GLOBAL SPACING
========================== */

section{

overflow:hidden;

}

.services,
.about,
.advantages-section,
.gallery-section,
.reviews,
.contact,
.map-section,
.seo-section{

position:relative;

}

/* ==========================
   HOVER EFFECTS
========================== */

.service-card,
.stat-box,
.advantage-card,
.review-card,
.contact-form,
.contact-info{

transition:
transform .35s ease,
box-shadow .35s ease;

}

.service-card:hover,
.stat-box:hover,
.advantage-card:hover,
.review-card:hover{

box-shadow:0 25px 50px rgba(0,0,0,.12);

}

/* ==========================
   CUSTOM SCROLLBAR
========================== */

::-webkit-scrollbar{

width:10px;

}

::-webkit-scrollbar-track{

background:#f1f1f1;

}

::-webkit-scrollbar-thumb{

background:var(--primary);

border-radius:20px;

}

::-webkit-scrollbar-thumb:hover{

background:var(--primary-dark);

}

/* ==========================
   RESPONSIVE 1200
========================== */

@media(max-width:1200px){

.services-grid,
.advantages-grid,
.reviews-grid{

grid-template-columns:repeat(2,1fr);

}

.gallery{

grid-template-columns:repeat(2,1fr);

}

.footer-container{

grid-template-columns:repeat(2,1fr);

}

}

/* ==========================
   RESPONSIVE 992
========================== */

@media(max-width:992px){

.nav-right{
flex-direction:column;
}

.header{

top:0;

}

.top-bar{

display:none;

}
.nav{

height:auto;

padding:20px 0;

flex-direction:column;

gap:20px;

}

nav ul{

flex-wrap:wrap;

justify-content:center;

gap:20px;

}

.hero{

height:auto;

min-height:100vh;

padding-top:160px;

}

.hero h1{

font-size:58px;

}

.hero h2{

font-size:28px;

}

.about-grid{

grid-template-columns:1fr;

}

.contact-box{

grid-template-columns:1fr;

}

.stats-grid{

grid-template-columns:repeat(2,1fr);

}

.gallery{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.hero h1{

font-size:42px;

}

.hero h2{

font-size:22px;

}

.hero p{

font-size:16px;

}

.hero-buttons{

flex-direction:column;

}

.btn-orange,
.btn-white{

width:100%;

max-width:320px;

text-align:center;

}

.stats-grid,
.services-grid,
.advantages-grid,
.reviews-grid,
.gallery,
.footer-container{

grid-template-columns:1fr;

}

.section-title{

font-size:34px;

}

.about-text h2{

font-size:34px;

}

.cta h2{

font-size:30px;

}

.whatsapp-float span{

display:none;

}

.whatsapp-float{

width:65px;

height:65px;

padding:0;

justify-content:center;

border-radius:50%;

}

.back-to-top{

width:50px;

height:50px;

}

}

@media(max-width:480px){

.hero{

padding-top:140px;

}

.hero h1{

font-size:34px;

}

.hero h2{

font-size:18px;

}

.logo img{

height:55px;

}

.section-title{

font-size:28px;

}

.contact-form{

padding:25px;

}

.contact-info{

padding:25px;

}

.map-wrapper iframe{

height:300px;

}

}

/* ==========================
   FINAL PREMIUM TOUCH
========================== */

.hero,
.cta{

background-attachment:fixed;

}

.gallery img,
.service-card,
.stat-box,
.advantage-card,
.review-card,
.contact-form,
.contact-info{

border-radius:18px;

}

body{

background:white;

}
@media(max-width:992px){

.phone-header{
display:none;
}

.hero{
padding-top:280px;
}

}
.service-card-link{
display:block;
text-decoration:none;
color:inherit;
}

.service-card-link:hover{
color:inherit;
}

.service-card{
transition:all .3s ease;
cursor:pointer;
}

.service-card:hover{
transform:translateY(-8px);
border:2px solid #ff7a00;
box-shadow:0 15px 35px rgba(0,0,0,.12);
}

.service-more{
margin-top:15px;
font-weight:600;
color:#ff7a00;
opacity:0;
transform:translateY(10px);
transition:all .3s ease;
}

.service-card:hover .service-more{
opacity:1;
transform:translateY(0);
}
/* ==========================
   LIGHTBOX REFERENZEN
========================== */

.lightbox{

display:none;
position:fixed;
top:0;
left:0;
width:100%;
height:100%;

background:rgba(0,0,0,.92);

justify-content:center;
align-items:center;

z-index:99999;

padding:30px;

cursor:pointer;

}

.lightbox img{

max-width:95%;
max-height:90vh;

border-radius:20px;

box-shadow:0 20px 60px rgba(0,0,0,.6);

animation:zoomIn .3s ease;

}

.lightbox-close{

position:absolute;

top:25px;
right:35px;

font-size:55px;
color:white;

font-weight:700;

cursor:pointer;

}

@keyframes zoomIn{

from{
transform:scale(.8);
opacity:0;
}

to{
transform:scale(1);
opacity:1;
}

}

.gallery img{

cursor:pointer;

}
.top-bar {
    color: #ff7a00;
}

.top-bar i {
    color: #ff7a00;
    margin-right: 6px;
}

.top-bar div:hover {
    color: #ff9a3d;
}
.top-bar {
    background: #111; /* elegancka czerń */
    color: #fff;
    font-size: 14px;
    padding: 8px 0;
    border-bottom: 2px solid #ff7a00;
}

.top-bar-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
}

/* pojedyncze elementy */
.top-bar-content div {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #ddd;
    transition: 0.3s ease;
}

/* ikony */
.top-bar-content i {
    color: #ff7a00;
    font-size: 14px;
}

/* hover efekt premium */
.top-bar-content div:hover {
    color: #fff;
    transform: translateY(-1px);
}

/* linki (jeśli dodasz tel/mail później) */
.top-bar a {
    color: #ddd;
    text-decoration: none;
    transition: 0.3s;
}

.top-bar a:hover {
    color: #ff7a00;
}
.back-to-top{
  position:fixed;
  left:25px;
  bottom:25px;
  width:55px;
  height:55px;
  background:#ff7a00;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-size:24px;
  text-decoration:none;
}

.back-to-top::after{
  content:"↑";
  font-size:24px;
  color:#fff;
}
.whatsapp-float .wa-icon {
    font-size: 18px;
}
.whatsapp-float-v2 {
    position: fixed;
    bottom: 20px;
    right: 20px;
    background: #25D366;
    color: white;
    padding: 12px 14px;
    border-radius: 50px;
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    font-weight: bold;
    box-shadow: 0 10px 25px rgba(0,0,0,0.25);
    z-index: 9999;
    transition: all 0.3s ease;
}

/* ICON */
.whatsapp-float-v2 .wa-icon {
    font-size: 22px;
}

/* TEXT */
.whatsapp-float-v2 .wa-text {
    display: flex;
    flex-direction: column;
    line-height: 1.1;
}

.whatsapp-float-v2 .wa-title {
    font-size: 14px;
}

.whatsapp-float-v2 .wa-sub {
    font-size: 11px;
    opacity: 0.85;
    font-weight: normal;
}

/* HOVER EFFECT */
.whatsapp-float-v2:hover {
    transform: scale(1.05);
    box-shadow: 0 15px 30px rgba(0,0,0,0.35);
}

/* PULSE ANIMATION */
@keyframes waPulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.08); }
    100% { transform: scale(1); }
}

.whatsapp-float-v2 {
    animation: waPulse 2.5s infinite;
}

/* MOBILE SIMPLIFICATION */
@media (max-width: 600px) {
    .whatsapp-float-v2 .wa-sub {
        display: none;
    }

    .whatsapp-float-v2 {
        padding: 12px;
    }
}
/* =========================
   COOKIE BANNER PRO
========================= */

.cookie-banner{
  position:fixed;
  bottom:20px;
  left:20px;
  right:20px;
  z-index:999999;
  display:none;
}

.cookie-box{
  max-width:900px;
  margin:auto;
  background:#111827;
  color:#fff;
  padding:20px;
  border-radius:16px;
  box-shadow:0 20px 50px rgba(0,0,0,.4);
  border:1px solid rgba(255,122,0,.4);
}

.cookie-box h3{
  margin-bottom:10px;
  color:#ff7a00;
}

.cookie-box p{
  font-size:14px;
  color:#d1d5db;
  margin-bottom:15px;
  line-height:1.5;
}

.cookie-buttons{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.cookie-btn{
  padding:10px 16px;
  border:none;
  border-radius:10px;
  cursor:pointer;
  font-weight:600;
  transition:.3s;
}

.cookie-btn.accept{
  background:#ff7a00;
  color:#fff;
}

.cookie-btn.decline{
  background:#374151;
  color:#fff;
}

.cookie-btn.settings{
  background:transparent;
  border:1px solid #555;
  color:#fff;
}

.cookie-settings{
  margin-top:15px;
  display:none;
  flex-direction:column;
  gap:10px;
  font-size:14px;
  color:#d1d5db;
}

.cookie-settings input{
  margin-right:8px;
}