:root{
  --forest:#1e4332;
  --forest-2:#2c5a45;
  --forest-light:#3d7a5a;
  --cream:#f7f3ee;
  --sand:#e8ded3;
  --ink:#1f2f27;
  --muted:#64786d;
  --line:#d8e1dc;
  --white:#fff;
  --shadow:0 4px 20px rgba(18,30,24,.12);
  --radius:14px;
  --radius-sm:8px;
}
*{box-sizing:border-box}
body{margin:0;font-family:Segoe UI,Arial,sans-serif;background:var(--cream);color:var(--ink)}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto}

/* Header */
.topbar{padding:.72rem 1rem;background:rgba(255,255,255,.92);position:sticky;top:0;z-index:100;border-bottom:1px solid var(--line);box-shadow:0 2px 10px rgba(0,0,0,.05)}
.topbar-inner{max-width:1280px;margin:0 auto;display:flex;gap:1rem;align-items:center;justify-content:space-between}
.brand-link{display:inline-flex;align-items:center;gap:.7rem}
.logo-wrap{background:linear-gradient(145deg,#eef4f0 0%, #e1ece6 100%);border:1px solid #d0ddd5;border-radius:12px;padding:.42rem .6rem;display:inline-flex;box-shadow:0 4px 10px rgba(26,54,41,.08)}
.logo-wrap img{height:56px;display:block}
.brand-text{display:flex;flex-direction:column;line-height:1.08}
.brand-text strong{font-size:1.03rem;color:#153126;letter-spacing:.01em}
.brand-text small{font-size:.72rem;color:#5c7268;text-transform:uppercase;letter-spacing:.08em}
nav{display:flex;gap:.35rem;padding:.28rem;background:#f3f7f4;border:1px solid #dfe8e2;border-radius:999px}
nav a{color:var(--ink);font-weight:600;transition:all .2s;padding:.4rem .72rem;border-radius:999px;font-size:.92rem}
nav a:hover{color:var(--forest);background:#e7efe9}
.top-actions{display:flex;gap:.5rem;align-items:center}
.lang{text-decoration:none;color:var(--muted);font-size:.8rem;padding:.2rem .4rem;border-radius:4px;transition:all .2s}
.lang:hover,.lang.active{background:var(--forest);color:var(--white)}
.lang:not(:last-child)::after{content:"/";margin-left:.6rem;opacity:.4}

.btn{background:var(--forest);color:#f5fbf8;border:none;padding:.62rem 1.2rem;border-radius:var(--radius);text-decoration:none;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;font-weight:700;transition:all .2s;font-size:.95rem}
.btn:hover{background:var(--forest-2);transform:translateY(-1px);box-shadow:var(--shadow)}
.btn.small{padding:.45rem .9rem;font-size:.85rem;border-radius:var(--radius-sm)}
.btn-ghost{background:transparent;border:2px solid var(--forest);color:var(--forest)}
.btn-ghost:hover{background:var(--forest);color:var(--white)}
.btn-whatsapp{background:#25D366}
.btn-whatsapp:hover{background:#20BA5A}

.flash{margin:.7rem auto;max-width:1200px;background:#d4edda;border:1px solid #c3e6cb;color:#155724;padding:.9rem 1.2rem;border-radius:var(--radius);display:flex;align-items:center;gap:.5rem}
.flash::before{content:"✓";font-weight:bold}
.flash.error{background:#f8d7da;border-color:#f5c6cb;color:#721c24}
.flash.error::before{content:"✕"}

/* Hero Section */
.hero{max-width:1280px;margin:1.5rem auto;position:relative;border-radius:20px;overflow:hidden;min-height:480px}
.hero-media{position:absolute;inset:0;background-size:cover;background-position:center;filter:brightness(.55)}
.hero-content{position:relative;z-index:2;padding:2.5rem 2rem 1rem;color:var(--white);text-align:center}
.hero-content h1{font-size:2.8rem;line-height:1.15;margin:0 0 .6rem;text-shadow:0 2px 10px rgba(0,0,0,.3)}
.hero-content p{font-size:1.25rem;margin:0;opacity:.95;text-shadow:0 1px 5px rgba(0,0,0,.3)}

/* Hero Tabs */
.hero-tabs{display:flex;gap:.4rem;margin:1.5rem auto;max-width:900px;flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin}
.tab-btn{padding:.55rem 1.1rem;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.25);color:var(--white);border-radius:30px;cursor:pointer;font-size:.85rem;font-weight:600;transition:all .25s;backdrop-filter:blur(5px)}
.tab-btn{white-space:nowrap;flex:0 0 auto}
.tab-btn:hover,.tab-btn.active{background:var(--white);color:var(--forest);border-color:var(--white)}

/* Tab Content */
.tab-content{display:none;padding:.8rem 1.5rem 1.5rem;background:rgba(255,255,255,.12);backdrop-filter:blur(10px);border-radius:var(--radius);max-width:1000px;margin:0 auto}
.tab-content.active{display:block}

/* Search Box */
.search-box{background:var(--white);border-radius:var(--radius);padding:1rem;display:grid;gap:.7rem}
.search-box.two-col{grid-template-columns:2fr 1fr}
.search-box.three-col{grid-template-columns:1fr 1fr 1fr}
.search-box.four-col{grid-template-columns:1.5fr 1fr 1fr auto}
.search-box input,.search-box select,.booking-form input,.admin-form input,.admin-form textarea,.auth-card input{border:1.5px solid var(--line);border-radius:var(--radius-sm);padding:.7rem .9rem;font-size:.95rem;width:100%;transition:border-color .2s}
.search-box input:focus,.search-box select:focus{border-color:var(--forest);outline:none}
.search-box button,.search-box input[type="submit"]{background:var(--forest);border:none;color:var(--white);border-radius:var(--radius-sm);padding:.7rem 1.5rem;font-weight:700;cursor:pointer;transition:all .2s}
.search-box button:hover,.search-box input[type="submit"]:hover{background:var(--forest-2)}
.search-box label{font-size:.8rem;color:var(--muted);margin-bottom:.2rem;display:block}

/* Sections */
.grid-section,.content{max-width:1280px;margin:2.5rem auto;padding:0 1rem}
.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;flex-wrap:wrap;gap:1rem}
.grid-section h2,.content h1{font-size:2rem;margin:0;color:var(--forest)}
.section-subtitle{color:var(--muted);font-size:1.05rem;margin-top:.3rem}

/* Category Filters */
.filter-tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1.5rem}
.filter-btn{padding:.5rem 1rem;background:var(--white);border:1.5px solid var(--line);border-radius:30px;cursor:pointer;font-size:.85rem;transition:all .2s}
.filter-btn:hover,.filter-btn.active{background:var(--forest);color:var(--white);border-color:var(--forest)}

/* Card Grid */
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.2rem}
.card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:.8rem;box-shadow:var(--shadow);transition:all .3s;display:flex;flex-direction:column}
.card:hover{transform:translateY(-4px);box-shadow:0 12px 30px rgba(18,30,24,.15)}
.card img{width:100%;height:200px;object-fit:cover;border-radius:10px}
.card-badge{position:absolute;top:1rem;left:1rem;background:var(--forest);color:var(--white);padding:.3rem .7rem;border-radius:20px;font-size:.75rem;font-weight:700}
.card-body{flex:1;padding:.8rem 0}
.card h3{margin:.5rem 0;font-size:1.15rem}
.card .summary{color:var(--muted);font-size:.9rem;margin:.3rem 0 .8rem;line-height:1.5}
.price{color:var(--forest);font-weight:800;font-size:1.4rem;margin:.5rem 0}
.price span{font-size:.85rem;color:var(--muted);font-weight:400;text-decoration:line-through;margin-left:.5rem}
.card-actions{display:flex;gap:.5rem;margin-top:auto;padding-top:.8rem}

/* Trust Band */
.trust-band{max-width:1280px;margin:2rem auto;background:linear-gradient(135deg,var(--forest),var(--forest-2));color:var(--white);padding:1.8rem;border-radius:var(--radius);display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem;text-align:center}
.trust-item i{font-size:1.8rem;margin-bottom:.5rem}
.trust-item h4{margin:0;font-size:1rem}
.trust-item p{opacity:.85;font-size:.9rem;margin:.2rem 0 0}

/* Newsletter */
.newsletter-section{background:var(--sand);padding:3rem 1rem;margin-top:3rem}
.newsletter{max-width:600px;margin:0 auto;text-align:center}
.newsletter h3{color:var(--forest);font-size:1.8rem;margin:0 0 .5rem}
.newsletter p{color:var(--muted);margin:0 0 1.5rem}
.newsletter-form{display:flex;gap:.7rem;flex-wrap:wrap;justify-content:center}
.newsletter-form input[type="email"]{flex:1;min-width:250px;padding:.8rem 1rem;border:1.5px solid var(--line);border-radius:var(--radius-sm);font-size:1rem}
.newsletter-form button{white-space:nowrap}

/* Footer */
.footer{background:var(--ink);color:#d0d8d4;padding:3rem 1rem 1.5rem;margin-top:0}
.footer-grid{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:2rem}
.footer-col h4{color:var(--white);margin:0 0 1rem;font-size:1rem}
.footer-col ul{list-style:none;padding:0;margin:0}
.footer-col li{margin:.5rem 0}
.footer-col a{color:#a0b0a8;transition:color .2s}
.footer-col a:hover{color:var(--white)}
.footer-social{display:flex;gap:1rem;margin-top:1rem}
.footer-social a{width:40px;height:40px;background:rgba(255,255,255,.1);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--white);transition:all .2s}
.footer-social a:hover{background:var(--forest);transform:scale(1.1)}
.footer-bottom{max-width:1280px;margin:2rem auto 0;padding-top:1.5rem;border-top:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;font-size:.85rem}

/* Auth Pages */
.auth-wrap{display:grid;place-items:center;padding:3rem 1rem;min-height:60vh}
.auth-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:2rem;width:100%;max-width:450px;box-shadow:var(--shadow)}
.auth-card h1{color:var(--forest);margin:0 0 1.5rem;text-align:center;font-size:1.6rem}
.auth-card label{display:block;font-weight:600;margin:.8rem 0 .3rem;font-size:.9rem}
.auth-card .btn{width:100%;justify-content:center;margin-top:1rem}
.auth-card .auth-footer{text-align:center;margin-top:1rem;font-size:.9rem;color:var(--muted)}
.auth-card .auth-footer a{color:var(--forest);font-weight:600}

/* Dashboard */
.dashboard-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.2rem;margin-bottom:2rem}
.stat-card{background:var(--white);border-radius:var(--radius);padding:1.5rem;box-shadow:var(--shadow)}
.stat-card h4{color:var(--muted);margin:0;font-size:.85rem;text-transform:uppercase;letter-spacing:.5px}
.stat-card .value{font-size:2.2rem;font-weight:800;color:var(--forest);margin:.3rem 0}
.stat-card .trend{font-size:.85rem;color:var(--muted)}
.stat-card .trend.up{color:#28a745}
.stat-card .trend.down{color:#dc3545}

/* Tables */
.table{width:100%;border-collapse:collapse;background:var(--white);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.table th{background:var(--forest);color:var(--white);padding:1rem;font-weight:600;text-align:left;font-size:.9rem}
.table td{padding:.9rem;border-bottom:1px solid var(--line);font-size:.95rem}
.table tr:last-child td{border-bottom:none}
.table tr:hover td{background:#f8f9fa}
.table .actions{display:flex;gap:.4rem}
.table .badge{display:inline-block;padding:.2rem .6rem;border-radius:20px;font-size:.75rem;font-weight:700}
.badge-pending{background:#fff3cd;color:#856404}
.badge-confirmed{background:#d4edda;color:#155724}
.badge-cancelled{background:#f8d7da;color:#721c24}
.badge-paid{background:#cce5ff;color:#004085}

/* Admin Panel */
.admin-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;flex-wrap:wrap;gap:1rem}
.admin-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-bottom:2rem}
.admin-sidebar{display:flex;gap:1rem;margin-bottom:2rem;flex-wrap:wrap}
.sidebar-link{padding:.7rem 1.2rem;background:var(--white);border-radius:var(--radius-sm);font-weight:600;transition:all .2s;border:1.5px solid var(--line)}
.sidebar-link:hover,.sidebar-link.active{background:var(--forest);color:var(--white);border-color:var(--forest)}
.panel{background:var(--white);border-radius:var(--radius);padding:1.5rem;margin-bottom:1.5rem;box-shadow:var(--shadow)}
.panel h2{color:var(--forest);margin:0 0 1.2rem;font-size:1.3rem}

/* Content pages */
.page-hero h1{margin:0;color:var(--forest)}
.page-intro{margin:.7rem 0 0;max-width:70ch}
.page-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-bottom:1.2rem}
.page-card h2{font-size:1.12rem;margin:0 0 .7rem}
.page-list{margin:0;padding-left:1.1rem;display:grid;gap:.45rem}
.faq-stack{display:grid;gap:.8rem}
.faq-item{border:1px solid var(--line);border-radius:10px;padding:.8rem .9rem;background:#fbfdfc}
.faq-item h3{margin:0 0 .3rem;font-size:1rem;color:var(--ink)}
.faq-item p{margin:0;color:var(--muted);line-height:1.6}
.page-contact h2{margin-bottom:.9rem}
.page-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}
.page-form .full{grid-column:1/-1}
.page-form label{display:block;margin:0 0 .3rem;font-weight:600;font-size:.9rem}
.page-form input,.page-form textarea{width:100%;border:1.5px solid var(--line);border-radius:8px;padding:.65rem .75rem;font-size:.94rem}
.page-actions{display:flex;gap:.7rem;flex-wrap:wrap;margin:1.1rem 0 2rem}

/* Checkout */
.checkout-panel{max-width:980px;margin:1.2rem auto}
.checkout-steps{max-width:980px;margin:.4rem auto 1rem;display:flex;align-items:center;gap:.65rem}
.checkout-steps .step{display:inline-flex;align-items:center;gap:.45rem;color:var(--muted);font-weight:600;font-size:.9rem}
.checkout-steps .step span{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;border:1.5px solid #b8c8bf;background:#f6faf8;color:#416252;font-size:.82rem}
.checkout-steps .step.active{color:var(--forest)}
.checkout-steps .step.active span{background:var(--forest);border-color:var(--forest);color:#fff}
.checkout-steps .step.done{color:#2e6a4e}
.checkout-steps .step.done span{background:#dff2e7;border-color:#98ceb2;color:#20553e}
.checkout-steps .step-line{height:2px;flex:1;background:linear-gradient(90deg,#d5e3db,#ecf3ef)}
.checkout-summary{display:grid;grid-template-columns:220px 1fr;gap:1rem;align-items:start;background:#f8fbf9;border:1px solid var(--line);border-radius:12px;padding:.8rem;margin:1rem 0 1.2rem}
.checkout-summary img{width:100%;height:145px;object-fit:cover;border-radius:10px}
.checkout-summary h2{margin:.2rem 0 .4rem}
.checkout-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}
.checkout-form .full{grid-column:1/-1}
.checkout-form label{display:block;font-weight:600;font-size:.9rem;margin-bottom:.3rem}
.checkout-form input,.checkout-form textarea{width:100%;border:1.5px solid var(--line);border-radius:8px;padding:.65rem .75rem;font-size:.94rem}
.checkout-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:1rem}
.checkout-actions{display:flex;gap:.6rem;flex-wrap:wrap}

/* Forms */
.admin-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}
.admin-form input,.admin-form select,.admin-form textarea{border:1.5px solid var(--line);border-radius:var(--radius-sm);padding:.7rem;font-size:.95rem;width:100%}
.admin-form textarea{grid-column:1/-1;min-height:100px;resize:vertical}
.admin-form input:focus,.admin-form select:focus,.admin-form textarea:focus{border-color:var(--forest);outline:none}
.booking-form{display:grid;gap:.5rem}
.booking-form input[type="date"],.booking-form input[type="number"]{width:auto}

/* Floating Widgets */
.floating-widgets{position:fixed;bottom:1.5rem;right:1.5rem;display:flex;flex-direction:column;gap:.8rem;z-index:1000}
.float-btn{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;font-size:1.6rem;box-shadow:var(--shadow);transition:all .3s;cursor:pointer;border:none}
.float-btn:hover{transform:scale(1.1)}
.float-whatsapp{background:#25D366;color:var(--white)}
.float-scroll{background:var(--white);color:var(--forest);border:2px solid var(--forest);opacity:0;pointer-events:none;transition:opacity .3s}
.float-scroll.visible{opacity:1;pointer-events:auto}

/* WhatsApp Modal */
.whatsapp-modal{position:fixed;bottom:6rem;right:1.5rem;background:var(--white);border-radius:var(--radius);box-shadow:0 10px 40px rgba(0,0,0,.2);padding:1.2rem;width:300px;z-index:999;display:none;animation:slideUp .3s ease}
.whatsapp-modal.show{display:block}
.whatsapp-modal h4{color:var(--forest);margin:0 0 .5rem}
.whatsapp-modal p{color:var(--muted);font-size:.9rem;margin:0 0 1rem}
.whatsapp-modal a{display:block;background:#25D366;color:var(--white);padding:.8rem;border-radius:var(--radius-sm);text-align:center;font-weight:700}
@keyframes slideUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}

/* Cookie Banner */
.cookie-banner{position:fixed;bottom:0;left:0;right:0;background:var(--ink);color:var(--white);padding:1.2rem;z-index:1001;display:none;box-shadow:0 -4px 20px rgba(0,0,0,.2)}
.cookie-banner.show{display:block}
.cookie-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.cookie-inner p{font-size:.9rem;margin:0;opacity:.9}
.cookie-buttons{display:flex;gap:.5rem}
.cookie-buttons button{padding:.6rem 1.2rem;border-radius:var(--radius-sm);cursor:pointer;font-weight:600;transition:all .2s}

/* Package Detail */
.package-detail{max-width:900px;margin:0 auto;padding:2rem 1rem}
.package-hero{border-radius:var(--radius);overflow:hidden;margin-bottom:2rem}
.package-hero img{width:100%;height:400px;object-fit:cover}
.package-info{background:var(--white);border-radius:var(--radius);padding:2rem;box-shadow:var(--shadow)}
.package-info h1{color:var(--forest);margin:0 0 .5rem}
.package-meta{display:flex;gap:1.5rem;flex-wrap:wrap;margin:1rem 0;color:var(--muted);font-size:.9rem}
.package-meta span{display:flex;align-items:center;gap:.4rem}
.package-description{margin:1.5rem 0;line-height:1.7;color:#444}
.package-sidebar{background:var(--sand);border-radius:var(--radius);padding:1.5rem;margin-top:1.5rem}
.package-sidebar h3{margin:0 0 1rem;color:var(--forest)}

/* Profile */
.profile-grid{display:grid;grid-template-columns:250px 1fr;gap:2rem;align-items:start}
.profile-sidebar{background:var(--white);border-radius:var(--radius);padding:1.5rem;text-align:center;box-shadow:var(--shadow)}
.profile-avatar{width:100px;height:100px;background:var(--forest);border-radius:50%;display:grid;place-items:center;color:var(--white);font-size:2.5rem;font-weight:700;margin:0 auto 1rem}
.profile-menu{list-style:none;padding:0;margin:1.5rem 0 0}
.profile-menu li{margin:.3rem 0}
.profile-menu a{display:block;padding:.7rem 1rem;border-radius:var(--radius-sm);transition:all .2s;color:var(--ink)}
.profile-menu a:hover,.profile-menu a.active{background:var(--forest);color:var(--white)}
.profile-content{background:var(--white);border-radius:var(--radius);padding:2rem;box-shadow:var(--shadow)}

/* Breadcrumb */
.breadcrumb{display:flex;gap:.5rem;font-size:.85rem;color:var(--muted);margin-bottom:1rem;max-width:1280px;margin-left:auto;margin-right:auto;padding:0 1rem}
.breadcrumb a{color:var(--forest)}
.breadcrumb span{color:var(--muted);font-size:.85rem}

/* Loading */
.loading{text-align:center;padding:3rem;color:var(--muted)}

/* Utilities */
.text-center{text-align:center}
.text-muted{color:var(--muted)}
.mt-1{margin-top:1rem}.mt-2{margin-top:2rem}.mt-3{margin-top:3rem}
.mb-1{margin-bottom:1rem}.mb-2{margin-bottom:2rem}
.p-1{padding:1rem}.p-2{padding:2rem}
.hidden{display:none}

/* Responsive */
@media (max-width: 980px){
  nav{display:none}
  .topbar-inner{gap:.6rem}
  .hero-content h1{font-size:2.2rem}
  .hero{min-height:400px}
  .card-grid{grid-template-columns:repeat(2,1fr)}
  .profile-grid{grid-template-columns:1fr}
  .admin-form{grid-template-columns:1fr}
  .page-grid{grid-template-columns:1fr}
  .page-form{grid-template-columns:1fr}
  .checkout-summary{grid-template-columns:1fr}
  .checkout-grid{grid-template-columns:1fr}
  .checkout-form{grid-template-columns:1fr}
  .checkout-steps{padding:0 .2rem}
}
@media (max-width: 640px){
  .topbar{padding:.55rem .7rem}
  .topbar-inner{flex-wrap:wrap}
  .logo-wrap img{height:44px}
  .brand-text strong{font-size:.9rem}
  .brand-text small{display:none}
  .hero-content{left:1rem;right:1rem;top:1.5rem}
  .hero-content h1{font-size:1.7rem}
  .hero-content p{font-size:1rem}
  .hero{min-height:350px}
  .hero-tabs{gap:.3rem}
  .tab-btn{padding:.4rem .7rem;font-size:.75rem}
  .search-box{position:static;margin:.8rem;border-radius:var(--radius)}
  .card-grid{grid-template-columns:1fr}
  .trust-band{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
  .footer-bottom{flex-direction:column;text-align:center}
  .newsletter-form{flex-direction:column}
  .newsletter-form input[type="email"]{min-width:auto}
  .floating-widgets{bottom:1rem;right:1rem}
}

/* Layout fixes: hero/search/footer */
.hero{
  max-width:1280px;
  margin:1.2rem auto 0;
  border-radius:18px;
  overflow:hidden;
  min-height:0;
  position:relative;
}

.hero-media{
  position:relative;
  height:400px;
  background-size:cover;
  background-position:center;
  filter:brightness(.55);
}

.hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(1200px 320px at 18% 82%, rgba(15,39,29,.5), rgba(15,39,29,0));
  pointer-events:none;
}

.hero-content{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  align-items:flex-start;
  padding:1.4rem 2rem 2rem;
  color:var(--white);
  z-index:2;
  max-width:760px;
}

.hero-search-wrap{
  max-width:1200px;
  margin:-76px auto 2rem;
  padding:0 1rem;
  position:relative;
  z-index:3;
}

.hero-search-card{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:18px;
  padding:1.05rem;
  box-shadow:0 12px 34px rgba(18,30,24,.14);
}

.hero-tabs{
  margin:0 0 .8rem;
  justify-content:flex-start;
}

.tab-btn{
  background:#eef3f0;
  color:var(--ink);
  border:1px solid #d6e0da;
  backdrop-filter:none;
}

.tab-btn:hover,
.tab-btn.active{
  background:var(--forest);
  color:var(--white);
  border-color:var(--forest);
}

.tab-content{
  background:transparent;
  border-radius:0;
  padding:0;
  margin:0;
}

.search-box{
  position:static;
  left:auto;
  right:auto;
  bottom:auto;
  border:0;
  padding:0;
  border-radius:0;
}

.search-box.four-col{grid-template-columns:1.2fr 1fr 1fr auto}
.search-box.three-col{grid-template-columns:1fr 1fr auto}

.footer{
  background:linear-gradient(180deg, #17382b 0%, #10261d 100%);
  color:#d9e5df;
}

.footer-col h4{color:#f3faf6}
.footer-col a{color:#bfd2c7}
.footer-col a:hover{color:#ffffff}

@media (max-width:980px){
  .hero-content{padding:1.4rem}
  .hero-media{height:320px}
  .hero-search-wrap{margin:-44px auto 1.5rem}
}

@media (max-width:640px){
  .hero-media{height:280px}
  .hero-content{max-width:none;padding:1rem}
  .hero-content h1{font-size:1.6rem}
  .hero-content p{font-size:.95rem}
  .hero-search-wrap{margin:-26px auto 1.2rem}
  .hero-tabs{justify-content:center}
  .search-box.four-col,.search-box.three-col{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
}

/* Premium refinement pass */
body{
  font-family:Inter,"Segoe UI",Arial,sans-serif;
  line-height:1.45;
}

.topbar{
  backdrop-filter:saturate(120%) blur(6px);
}

.user-chip{
  display:inline-flex;
  align-items:center;
  padding:.45rem .9rem;
  border-radius:8px;
  border:1px solid var(--forest);
  color:var(--forest);
  background:#f3f8f5;
  font-weight:600;
}

.hero-content h1{
  letter-spacing:-.02em;
  max-width:18ch;
}

.hero-content p{
  max-width:54ch;
}

.hero-copy-card{
  background:linear-gradient(145deg, rgba(12, 33, 24, .52), rgba(24, 54, 40, .26));
  border:1px solid rgba(231, 241, 236, .22);
  border-radius:16px;
  padding:1.15rem 1.2rem 1.05rem;
  backdrop-filter:blur(6px);
  box-shadow:0 14px 28px rgba(9, 24, 17, .26);
  max-width:min(680px, calc(100% - 176px));
}

.hero-copy-card h1{
  margin:0 0 .52rem;
  font-size:clamp(1.8rem, 3.2vw, 3rem);
  line-height:1.06;
  font-weight:800;
  text-wrap:balance;
}

.hero-copy-card p{
  margin:0;
  font-size:clamp(.98rem, 1.1vw, 1.2rem);
  line-height:1.5;
  color:#e7f1ec;
}

.hero-copy-card::after{
  content:"";
  display:block;
  width:72px;
  height:3px;
  border-radius:999px;
  margin-top:.85rem;
  background:linear-gradient(90deg, #8fd2ae, rgba(143,210,174,0));
}

.hero-corner-logo{
  position:absolute;
  top:.8rem;
  right:.9rem;
  z-index:4;
  display:inline-flex;
  padding:.36rem;
  border-radius:16px;
  background:rgba(250, 254, 252, .94);
  border:1px solid rgba(24, 56, 42, .14);
  box-shadow:0 12px 26px rgba(16, 38, 29, .2);
}

.hero-corner-logo img{
  width:136px;
  height:auto;
  display:block;
  border-radius:12px;
}

body.cookies-open .floating-widgets{
  display:none;
}

.hero-search-card{
  border:1px solid #d3ddd7;
  box-shadow:0 18px 40px rgba(19,35,28,.16);
}

.search-box input,
.search-box select{
  background:#fbfdfc;
}

.search-box input:focus,
.search-box select:focus{
  box-shadow:0 0 0 3px rgba(44,90,69,.16);
}

.package-grid{
  align-items:stretch;
}

.package-card{
  border:1px solid #dce6e1;
  overflow:hidden;
}

.package-card .card-body{
  padding:.95rem .15rem .3rem;
}

.package-card h3{
  font-size:1.08rem;
  line-height:1.35;
}

.package-card .summary{
  min-height:2.6rem;
}

.price{
  letter-spacing:-.01em;
}

.footer{
  margin-top:2.4rem;
  border-top:1px solid rgba(255,255,255,.07);
}

.footer-grid{
  gap:2.2rem;
}

.footer-logo-wrap{
  display:flex;
  align-items:center;
  gap:.8rem;
  margin-bottom:.9rem;
}

.footer-brand-text{
  font-size:.92rem;
  opacity:.9;
  margin:.1rem 0 0;
  max-width:32ch;
}

.footer-col ul li{
  line-height:1.55;
}

.footer-social a{
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.04em;
}

.footer-bottom{
  color:#b2c1b8;
}

@media (min-width:1100px){
  .topbar{padding:.68rem 1rem}
  .hero-media{height:430px}
  .hero-content{padding:1.25rem 2.2rem 2.2rem}
  .hero-copy-card{max-width:min(720px, calc(100% - 190px))}
  .hero-copy-card h1{font-size:clamp(2rem, 2.8vw, 3.1rem)}
  .hero-search-wrap{margin:-86px auto 2.2rem}
  .card-grid{grid-template-columns:repeat(3, minmax(0, 1fr));gap:1.28rem}
  .card img{height:214px}
  .package-card .summary{min-height:3rem}
  .footer{padding:3.2rem 1rem 1.6rem}
  .footer-grid{grid-template-columns:1.2fr repeat(4, minmax(150px,1fr));gap:2.4rem}
}

@media (max-width:980px){
  .hero-content{
    padding:1.1rem 1.35rem 1.35rem;
  }
  .hero-search-card{
    padding:.85rem;
  }
  .hero-tabs{
    justify-content:flex-start;
  }
}

@media (max-width:640px){
  .hero{
    border-radius:12px;
  }
  .hero-corner-logo{
    top:.55rem;
    right:.55rem;
    padding:.24rem;
    border-radius:10px;
  }
  .hero-corner-logo img{
    width:112px;
  }
  .hero-content{
    justify-content:flex-start;
    padding:.78rem .8rem 1rem;
  }
  .hero-content h1{
    font-size:1.45rem;
  }
  .hero-content p{
    font-size:.9rem;
  }
  .hero-copy-card{
    max-width:calc(100% - 128px);
    padding:.9rem .9rem .85rem;
    border-radius:12px;
  }
  .hero-copy-card::after{
    width:56px;
    margin-top:.7rem;
  }
  .hero-search-wrap{
    margin:-14px auto 1.2rem;
  }
  .hero-search-card{
    border-radius:12px;
  }
  .tab-btn{
    font-size:.73rem;
  }
  .card{
    padding:.7rem;
  }
  .card img{
    height:182px;
  }
  .footer{
    padding:2.2rem 1rem 1.2rem;
  }
  .footer-grid{
    gap:1.2rem;
  }
}

@media (max-width:480px){
  .topbar{
    padding:.46rem .56rem;
    gap:.45rem;
  }
  .brand-text strong{
    display:none;
  }
  .top-actions{
    margin-left:auto;
    gap:.25rem;
    align-items:center;
  }
  .lang{
    font-size:.69rem;
    padding:.12rem .22rem;
  }
  .top-actions .btn{
    padding:.36rem .52rem;
    font-size:.74rem;
    border-radius:8px;
  }
  .hero-content{
    padding:.62rem .68rem .88rem;
  }
  .hero-corner-logo{
    top:.45rem;
    right:.45rem;
  }
  .hero-corner-logo img{
    width:102px;
  }
  .hero-copy-card{
    max-width:calc(100% - 112px);
    padding:.72rem .72rem .68rem;
  }
  .hero-copy-card h1{
    font-size:1.18rem;
    line-height:1.14;
  }
  .hero-copy-card p{
    font-size:.84rem;
    line-height:1.34;
  }
  .hero-search-wrap{
    margin:-8px auto 1rem;
  }
  .hero-tabs{
    flex-wrap:nowrap;
    justify-content:flex-start;
    overflow-x:auto;
    gap:.32rem;
    padding-bottom:.22rem;
    scrollbar-width:thin;
  }
  .hero-tabs::-webkit-scrollbar{
    height:4px;
  }
  .hero-tabs::-webkit-scrollbar-thumb{
    background:#b9cbc1;
    border-radius:999px;
  }
  .tab-btn{
    flex:0 0 auto;
    white-space:nowrap;
    font-size:.68rem;
    padding:.28rem .56rem;
  }
  .search-box input,
  .search-box select{
    padding:.58rem .64rem;
    font-size:.87rem;
  }
  .search-box label{
    font-size:.72rem;
  }
  .trust-band{
    padding:1.15rem .85rem;
    gap:.9rem;
  }
  .trust-item h4{
    font-size:.93rem;
  }
  .trust-item p{
    font-size:.8rem;
  }
}

@media (max-width:390px){
  .top-actions a[href="/register"]{
    display:none;
  }
  .hero-copy-card{
    max-width:calc(100% - 108px);
  }
}

@media (max-width:360px){
  .hero-corner-logo img{
    width:92px;
  }
  .hero-copy-card{
    max-width:calc(100% - 98px);
    padding:.64rem .62rem .62rem;
  }
  .top-actions .lang:not(.active){
    display:none;
  }
  .top-actions .btn{
    padding:.34rem .48rem;
  }
}

@media (max-width:480px){
  html[lang="de"] .tab-btn,
  html[lang="pt"] .tab-btn{
    font-size:.62rem;
    padding:.26rem .48rem;
  }

  html[lang="de"] .hero-copy-card h1,
  html[lang="pt"] .hero-copy-card h1{
    font-size:1.06rem;
    max-width:15ch;
  }

  html[lang="de"] .hero-copy-card p,
  html[lang="pt"] .hero-copy-card p,
  html[lang="en"] .hero-copy-card p{
    font-size:.79rem;
    line-height:1.3;
  }

  html[lang="de"] .search-box label,
  html[lang="pt"] .search-box label,
  html[lang="en"] .search-box label{
    font-size:.68rem;
  }
}

/* Payment Methods */
.payment-methods{
  display:grid;
  gap:.8rem;
  margin-bottom:.5rem;
}

.payment-option{
  cursor:pointer;
  display:block;
}

.payment-option input[type="radio"]{
  display:none;
}

.payment-card{
  display:flex;
  align-items:center;
  gap:1rem;
  padding:1rem 1.2rem;
  border:2px solid var(--line);
  border-radius:var(--radius);
  background:var(--white);
  transition:all .2s;
}

.payment-option input[type="radio"]:checked + .payment-card{
  border-color:var(--forest);
  background:#f0f7f3;
  box-shadow:0 0 0 3px rgba(30,67,50,.1);
}

.payment-card:hover{
  border-color:var(--forest-light);
}

.payment-icon{
  width:48px;
  height:48px;
  background:#f8f9fa;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}

.payment-info{
  display:flex;
  flex-direction:column;
  gap:.15rem;
}

.payment-info strong{
  font-size:.95rem;
  color:var(--ink);
}

.payment-info small{
  font-size:.8rem;
  color:var(--muted);
}

.policy-box{
  margin-top:1.2rem;
  padding:1rem;
  background:#f8faf9;
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
}

.policy-box p{
  font-size:.85rem;
  color:var(--muted);
  margin:0;
  line-height:1.6;
}

/* Page Hero Banner */
.page-hero-banner {
  position:relative;
  height:240px;
  display:flex;
  align-items:center;
  overflow:hidden;
  margin-bottom:2rem;
}

.page-hero-banner-bg {
  position:absolute;
  inset:0;
  background:linear-gradient(135deg, #1a3d2e 0%, #2c5a45 50%, #3d7a5a 100%);
}

.page-hero-banner-bg::after {
  content:"";
  position:absolute;
  inset:0;
  background:url("data:image/svg+xml,%3Csvg width='80' height='80' viewBox='0 0 80 80' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Cpath d='M50 50c0-5.523 4.477-10 10-10s10 4.477 10 10-4.477 10-10 10c0 5.523-4.477 10-10 10s-10-4.477-10-10 4.477-10 10-10zM10 10c0-5.523 4.477-10 10-10s10 4.477 10 10-4.477 10-10 10c0 5.523-4.477 10-10 10s-10-4.477-10-10zM54 54c0-5.523 4.477-10 10-10s10 4.477 10 10-4.477 10-10 10c0 5.523-4.477 10-10 10s-10-4.477-10-10z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

.page-hero-banner-content {
  position:relative;
  z-index:1;
  padding:0 2rem;
  max-width:1280px;
  width:100%;
  margin:0 auto;
}

.page-hero-badge {
  display:inline-block;
  background:rgba(255,255,255,.15);
  color:rgba(255,255,255,.9);
  padding:.25rem .8rem;
  border-radius:20px;
  font-size:.78rem;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.08em;
  margin-bottom:.8rem;
  border:1px solid rgba(255,255,255,.2);
}

.page-hero-banner-content h1 {
  color:var(--white);
  font-size:2.4rem;
  margin:0 0 .6rem;
  text-shadow:0 2px 8px rgba(0,0,0,.2);
}

.page-hero-banner-content p {
  color:rgba(255,255,255,.8);
  font-size:1.05rem;
  margin:0;
}

/* Trust band alt */
.trust-band-alt {
  background:linear-gradient(135deg, var(--forest) 0%, var(--forest-2) 100%);
  position:relative;
  overflow:hidden;
}

.trust-band-alt::before {
  content:"";
  position:absolute;
  inset:0;
  background:url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M20 20c0-2.76 2.24-5 5-5s5 2.24 5 5-2.24 5-5 5c0 2.76-2.24 5-5 5s-5-2.24-5-5z'/%3E%3C/g%3E%3C/svg%3E");
}

/* Hero animations */
@keyframes fadeInUp {
  from { opacity:0; transform:translateY(20px); }
  to { opacity:1; transform:translateY(0); }
}

@keyframes fadeIn {
  from { opacity:0; }
  to { opacity:1; }
}

.hero-copy-card {
  animation:fadeInUp .8s ease both;
}

.hero-corner-logo {
  animation:fadeIn .6s ease both;
}

.hero-tabs {
  animation:fadeInUp .9s ease .1s both;
}

.hero-search-card {
  animation:fadeInUp 1s ease .2s both;
}

.trust-band-alt {
  animation:fadeInUp 1.1s ease .3s both;
}

.trust-item {
  animation:fadeInUp .6s ease both;
}

.trust-item:nth-child(1) { animation-delay:.35s }
.trust-item:nth-child(2) { animation-delay:.45s }
.trust-item:nth-child(3) { animation-delay:.55s }
.trust-item:nth-child(4) { animation-delay:.65s }

/* Package card hover */
.package-card {
  transition:transform .3s ease, box-shadow .3s ease;
}

.package-card:hover {
  transform:translateY(-6px);
  box-shadow:0 16px 40px rgba(18,30,24,.16);
}

/* Hero gradient overlay */
.hero::after {
  background:linear-gradient(to right, rgba(15,39,29,.55) 0%, rgba(15,39,29,.1) 60%);
}

/* ============================================
   MOBILE DRAWER (Hamburger Menu)
   ============================================ */

.hamburger {
  display:none;
  flex-direction:column;
  justify-content:center;
  gap:5px;
  width:40px;
  height:40px;
  background:transparent;
  border:none;
  cursor:pointer;
  padding:.5rem;
  border-radius:8px;
  transition:background .2s;
}

.hamburger:hover {
  background:#f0f4f1;
}

.hamburger span {
  display:block;
  height:2.5px;
  background:var(--forest);
  border-radius:999px;
  transition:all .2s;
}

.hamburger span:nth-child(1) { width:22px }
.hamburger span:nth-child(2) { width:16px }
.hamburger span:nth-child(3) { width:22px }

.mobile-overlay {
  position:fixed;
  inset:0;
  background:rgba(15,39,29,.45);
  z-index:998;
  opacity:0;
  pointer-events:none;
  transition:opacity .3s;
  backdrop-filter:blur(3px);
}

.mobile-overlay.active {
  opacity:1;
  pointer-events:auto;
}

.mobile-drawer {
  position:fixed;
  top:0;
  left:-300px;
  width:280px;
  height:100vh;
  background:var(--white);
  z-index:999;
  transition:left .35s cubic-bezier(.4,0,.2,1);
  display:flex;
  flex-direction:column;
  box-shadow:4px 0 30px rgba(15,39,29,.18);
  overflow-y:auto;
}

.mobile-drawer.open {
  left:0;
}

.mobile-drawer-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:1rem 1.2rem;
  border-bottom:1px solid var(--line);
  background:linear-gradient(145deg, #f4f8f5 0%, #ecf2ef 100%);
}

.mobile-drawer-brand {
  display:flex;
  align-items:center;
  gap:.7rem;
}

.mobile-drawer-brand img {
  width:36px;
  height:36px;
  border-radius:8px;
  object-fit:cover;
}

.mobile-drawer-brand strong {
  color:var(--forest);
  font-size:.95rem;
}

.mobile-drawer-close {
  background:transparent;
  border:none;
  font-size:1.2rem;
  cursor:pointer;
  color:var(--muted);
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border-radius:8px;
  transition:all .2s;
}

.mobile-drawer-close:hover {
  background:var(--line);
  color:var(--ink);
}

.mobile-drawer-nav {
  flex:1;
  padding:.8rem .8rem;
  display:flex;
  flex-direction:column;
  gap:.15rem;
}

.mobile-nav-link {
  display:flex;
  align-items:center;
  gap:.7rem;
  padding:.75rem .9rem;
  border-radius:10px;
  font-weight:600;
  font-size:.95rem;
  color:var(--ink);
  transition:all .2s;
  background:transparent;
  border:none;
  text-align:left;
  cursor:pointer;
  width:100%;
}

.mobile-nav-link:hover,
.mobile-nav-link.active {
  background:var(--forest);
  color:var(--white);
}

.mobile-nav-cta {
  background:var(--forest);
  color:var(--white);
  margin-top:.3rem;
}

.mobile-nav-cta:hover {
  background:var(--forest-2);
}

.mobile-nav-logout {
  color:#dc3545;
}

.mobile-nav-logout:hover {
  background:#fdf2f2;
  color:#c82333;
}

.mobile-drawer-footer {
  padding:1rem 1.2rem;
  border-top:1px solid var(--line);
}

.mobile-lang-switch {
  display:flex;
  gap:.4rem;
}

.mobile-lang-switch a {
  padding:.35rem .65rem;
  border-radius:6px;
  font-size:.82rem;
  font-weight:600;
  color:var(--muted);
  border:1.5px solid var(--line);
  transition:all .2s;
}

.mobile-lang-switch a:hover,
.mobile-lang-switch a.active {
  background:var(--forest);
  color:var(--white);
  border-color:var(--forest);
}

@media (max-width: 768px) {
  .hamburger {
    display:flex;
  }
  .desktop-nav {
    display:none;
  }
}

@media (min-width: 769px) {
  .mobile-overlay,
  .mobile-drawer {
    display:none;
  }
}

/* Desktop nav / lang switch */
.desktop-nav {
  display:flex;
  gap:.35rem;
  padding:.28rem;
  background:#f3f7f4;
  border:1px solid #dfe8e2;
  border-radius:999px;
}

.desktop-nav a {
  color:var(--ink);
  font-weight:600;
  transition:all .2s;
  padding:.4rem .72rem;
  border-radius:999px;
  font-size:.92rem;
}

.desktop-nav a:hover,
.desktop-nav a.active {
  color:var(--forest);
  background:#e7efe9;
}

.lang-switch {
  display:flex;
  gap:.25rem;
  align-items:center;
}

.lang-switch .lang {
  text-decoration:none;
  color:var(--muted);
  font-size:.8rem;
  padding:.2rem .4rem;
  border-radius:4px;
  transition:all .2s;
}

.lang-switch .lang:hover,
.lang-switch .lang.active {
  background:var(--forest);
  color:var(--white);
}

.lang-switch .lang:not(:last-child)::after {
  content:"/";
  margin-left:.6rem;
  opacity:.4;
}

/* ============================================
   ADMIN PANEL
   ============================================ */

.admin-wrap {
  display:grid;
  grid-template-columns:240px 1fr;
  min-height:calc(100vh - 80px);
  max-width:1400px;
  margin:0 auto;
  padding:1.5rem 1rem;
  gap:1.5rem;
  align-items:start;
}

.admin-sidebar {
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  position:sticky;
  top:90px;
  box-shadow:var(--shadow);
}

.admin-sidebar-brand {
  display:flex;
  align-items:center;
  gap:.8rem;
  padding:1.1rem 1rem;
  background:linear-gradient(145deg, #f0f6f3 0%, #e8f0ec 100%);
  border-bottom:1px solid var(--line);
}

.admin-sidebar-brand img {
  width:38px;
  height:38px;
  border-radius:8px;
  object-fit:cover;
}

.admin-sidebar-brand div {
  display:flex;
  flex-direction:column;
}

.admin-sidebar-brand strong {
  color:var(--forest);
  font-size:.95rem;
}

.admin-sidebar-brand small {
  color:var(--muted);
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.06em;
}

.admin-nav {
  display:flex;
  flex-direction:column;
  padding:.6rem;
  gap:.15rem;
}

.admin-nav-item {
  display:flex;
  align-items:center;
  gap:.65rem;
  padding:.72rem .9rem;
  border-radius:var(--radius-sm);
  font-weight:600;
  font-size:.9rem;
  color:var(--ink);
  transition:all .2s;
}

.admin-nav-item:hover,
.admin-nav-item.active {
  background:var(--forest);
  color:var(--white);
}

.admin-sidebar-footer {
  padding:.6rem;
  border-top:1px solid var(--line);
}

.admin-main {
  min-width:0;
}

.admin-topbar {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:1.5rem;
  flex-wrap:wrap;
  gap:1rem;
}

.admin-topbar h1 {
  color:var(--forest);
  margin:0;
  font-size:1.5rem;
}

.admin-topbar p {
  color:var(--muted);
  margin:.2rem 0 0;
  font-size:.9rem;
}

.admin-topbar-actions {
  display:flex;
  gap:.5rem;
}

.admin-kpi-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:1rem;
  margin-bottom:1.5rem;
}

.kpi-card {
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:1.2rem;
  display:flex;
  align-items:center;
  gap:.9rem;
  box-shadow:var(--shadow);
  transition:all .2s;
}

.kpi-card:hover {
  transform:translateY(-2px);
  box-shadow:0 8px 24px rgba(18,30,24,.14);
}

.kpi-icon {
  font-size:1.6rem;
  flex-shrink:0;
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:12px;
}

.kpi-primary .kpi-icon { background:#e8f5ee; }
.kpi-warning .kpi-icon { background:#fff8e6; }
.kpi-success .kpi-icon { background:#e6f7ec; }
.kpi-info .kpi-icon { background:#e6f0fa; }
.kpi-secondary .kpi-icon { background:#f3f0f8; }

.kpi-data {
  display:flex;
  flex-direction:column;
  gap:.15rem;
}

.kpi-value {
  font-size:1.5rem;
  font-weight:800;
  color:var(--ink);
  line-height:1;
}

.kpi-primary .kpi-value { color:#1e7e3c; }
.kpi-warning .kpi-value { color:#856404; }
.kpi-success .kpi-value { color:#155724; }
.kpi-info .kpi-value { color:#004085; }
.kpi-secondary .kpi-value { color:#5a4a78; }

.kpi-label {
  font-size:.78rem;
  color:var(--muted);
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.5px;
}

.admin-section {
  display:block;
}

.section-card {
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--shadow);
  margin-bottom:1.5rem;
}

.section-card-header {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:1.1rem 1.4rem;
  background:#f8faf9;
  border-bottom:1px solid var(--line);
  flex-wrap:wrap;
  gap:.8rem;
}

.section-card-header h2 {
  color:var(--forest);
  margin:0;
  font-size:1.1rem;
}

.table-wrap {
  overflow-x:auto;
}

.table {
  width:100%;
  border-collapse:collapse;
  background:var(--white);
  border-radius:0;
  overflow:hidden;
  box-shadow:none;
}

.customer-cell {
  display:flex;
  align-items:center;
  gap:.7rem;
}

.customer-avatar {
  width:36px;
  height:36px;
  border-radius:50%;
  background:var(--forest);
  color:var(--white);
  display:grid;
  place-items:center;
  font-weight:700;
  font-size:.85rem;
  flex-shrink:0;
}

.admin-actions {
  display:flex;
  gap:.35rem;
  align-items:center;
}

.btn-success {
  background:#28a745;
  color:#fff;
  border:none;
  padding:.42rem .7rem;
  border-radius:var(--radius-sm);
  font-weight:700;
  cursor:pointer;
  transition:all .2s;
  font-size:.82rem;
}

.btn-success:hover {
  background:#218838;
}

.btn-danger {
  background:#dc3545;
  color:#fff;
  border:none;
  padding:.42rem .7rem;
  border-radius:var(--radius-sm);
  font-weight:700;
  cursor:pointer;
  transition:all .2s;
  font-size:.82rem;
}

.btn-danger:hover {
  background:#c82333;
}

.change-request-banner {
  background:#fff8e6;
  border:1px solid #ffeaa7;
  border-radius:var(--radius-sm);
  padding:.7rem;
  margin-top:.5rem;
  font-size:.8rem;
  color:#856404;
  display:flex;
  flex-direction:column;
  gap:.5rem;
}

.change-actions {
  display:flex;
  align-items:center;
  gap:.5rem;
  flex-wrap:wrap;
}

.admin-form-2col {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.8rem;
  padding:1.4rem;
}

.form-field {
  display:flex;
  flex-direction:column;
  gap:.3rem;
}

.form-field label {
  font-weight:600;
  font-size:.88rem;
  color:var(--ink);
}

.form-field input,
.form-field select,
.form-field textarea {
  border:1.5px solid var(--line);
  border-radius:var(--radius-sm);
  padding:.65rem .8rem;
  font-size:.92rem;
  transition:border-color .2s, box-shadow .2s;
}

.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus {
  border-color:var(--forest);
  outline:none;
  box-shadow:0 0 0 3px rgba(30,67,50,.1);
}

.form-field input[type="url"] {
  font-size:.85rem;
}

.form-field-full {
  grid-column:1/-1;
}

@media (max-width: 900px) {
  .admin-wrap {
    grid-template-columns:1fr;
  }
  .admin-sidebar {
    position:static;
  }
  .admin-form-2col {
    grid-template-columns:1fr;
  }
}

/* ============================================
   CHECKOUT PREVIEW (Payment + Summary)
   ============================================ */

.checkout-layout {
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:1.5rem;
  align-items:start;
  max-width:1000px;
  margin:0 auto;
}

.checkout-payment-side {
  min-width:0;
}

.checkout-panel-card {
  padding:1.8rem;
}

.checkout-panel-card h2 {
  color:var(--forest);
  margin:0 0 .4rem;
  font-size:1.3rem;
}

.payment-methods-lg .payment-card {
  padding:1.15rem 1.3rem;
}

.payment-check {
  margin-left:auto;
  width:26px;
  height:26px;
  border-radius:50%;
  border:2px solid var(--line);
  display:grid;
  place-items:center;
  font-size:.75rem;
  color:transparent;
  transition:all .2s;
  flex-shrink:0;
}

.payment-option input[type="radio"]:checked + .payment-card .payment-check {
  background:var(--forest);
  border-color:var(--forest);
  color:var(--white);
}

.payment-card.selected {
  border-color:var(--forest);
  background:#f0f7f3;
}

.btn-checkout {
  background:linear-gradient(135deg, var(--forest) 0%, var(--forest-2) 100%);
  font-size:1rem;
  padding:.75rem 1.5rem;
  border-radius:var(--radius);
  min-width:200px;
}

.btn-checkout:hover {
  background:linear-gradient(135deg, var(--forest-2) 0%, var(--forest-light) 100%);
  transform:translateY(-1px);
  box-shadow:0 8px 20px rgba(30,67,50,.25);
}

.checkout-summary-side {
  min-width:0;
}

.checkout-summary-card {
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--shadow);
  position:sticky;
  top:90px;
}

.summary-header {
  padding:1.1rem 1.2rem;
  background:linear-gradient(145deg, #f4f8f5 0%, #edf2ef 100%);
  border-bottom:1px solid var(--line);
}

.summary-header h3 {
  color:var(--forest);
  margin:0;
  font-size:1rem;
  font-weight:700;
}

.summary-package {
  display:flex;
  gap:.8rem;
  padding:1rem 1.2rem;
  border-bottom:1px solid var(--line);
}

.summary-package img {
  width:72px;
  height:72px;
  object-fit:cover;
  border-radius:8px;
  flex-shrink:0;
}

.summary-package-info {
  display:flex;
  flex-direction:column;
  gap:.35rem;
  min-width:0;
}

.summary-package-info h4 {
  margin:0;
  font-size:.95rem;
  color:var(--ink);
  line-height:1.3;
}

.summary-details {
  padding:.8rem 1.2rem;
  display:flex;
  flex-direction:column;
  gap:.5rem;
}

.summary-row {
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:.88rem;
  color:var(--ink);
}

.summary-row span:first-child {
  color:var(--muted);
}

.summary-divider {
  height:1px;
  background:var(--line);
  margin:.2rem 0;
}

.summary-row-total {
  font-weight:700;
  font-size:1rem;
}

.summary-total {
  color:var(--forest);
  font-size:1.1rem;
}

.summary-trust {
  padding:.9rem 1.2rem;
  background:#f8faf9;
  border-top:1px solid var(--line);
  display:flex;
  flex-direction:column;
  gap:.4rem;
}

.summary-trust-item {
  font-size:.8rem;
  color:var(--muted);
  display:flex;
  align-items:center;
  gap:.4rem;
}

@media (max-width: 860px) {
  .checkout-layout {
    grid-template-columns:1fr;
  }
  .checkout-summary-card {
    position:static;
    order:-1;
  }
}

/* ============================================
   PROFILE
   ============================================ */

.profile-layout {
  display:grid;
  grid-template-columns:240px 1fr;
  gap:1.5rem;
  align-items:start;
  max-width:960px;
  margin:0 auto;
}

.profile-sidebar {
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:1.8rem 1.2rem;
  text-align:center;
  box-shadow:var(--shadow);
  position:sticky;
  top:90px;
}

.profile-avatar-lg {
  width:88px;
  height:88px;
  background:linear-gradient(145deg, var(--forest) 0%, var(--forest-2) 100%);
  border-radius:50%;
  display:grid;
  place-items:center;
  color:var(--white);
  font-size:2.2rem;
  font-weight:700;
  margin:0 auto 1rem;
  box-shadow:0 6px 16px rgba(30,67,50,.2);
}

.profile-sidebar h2 {
  color:var(--ink);
  margin:0;
  font-size:1.05rem;
}

.profile-nav {
  display:flex;
  flex-direction:column;
  gap:.2rem;
  margin:1.2rem 0 0;
  text-align:left;
}

.profile-nav-item {
  display:block;
  padding:.65rem .9rem;
  border-radius:var(--radius-sm);
  font-weight:600;
  font-size:.88rem;
  color:var(--ink);
  transition:all .2s;
}

.profile-nav-item:hover,
.profile-nav-item.active {
  background:var(--forest);
  color:var(--white);
}

.profile-content-area {
  display:flex;
  flex-direction:column;
  gap:1.2rem;
  min-width:0;
}

.panel-heading {
  padding-bottom:1rem;
  border-bottom:1px solid var(--line);
  margin-bottom:1.2rem;
}

.panel-heading h2 {
  color:var(--forest);
  margin:0 0 .3rem;
  font-size:1.15rem;
}

.panel-heading p {
  color:var(--muted);
  margin:0;
  font-size:.88rem;
}

.profile-form {
  display:flex;
  flex-direction:column;
  gap:.8rem;
}

.form-row {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.8rem;
}

.form-actions {
  display:flex;
  gap:.6rem;
  padding-top:.3rem;
}

@media (max-width: 768px) {
  .profile-layout {
    grid-template-columns:1fr;
  }
  .profile-sidebar {
    position:static;
  }
  .form-row {
    grid-template-columns:1fr;
  }
}

/* ============================================
   FAQ ACCORDION
   ============================================ */

.faq-section {
  padding:1.5rem;
}

.faq-section-title {
  color:var(--forest);
  margin:0 0 1.2rem;
  font-size:1.2rem;
}

.faq-accordion {
  display:flex;
  flex-direction:column;
  gap:.6rem;
}

.faq-item {
  border:1.5px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  background:#fbfdfc;
  transition:border-color .2s, box-shadow .2s;
}

.faq-item:hover {
  border-color:#c0d4c8;
}

.faq-item.open {
  border-color:var(--forest);
  box-shadow:0 2px 12px rgba(30,67,50,.1);
  background:var(--white);
}

.faq-question {
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:1rem 1.2rem;
  background:transparent;
  border:none;
  cursor:pointer;
  text-align:left;
  font-size:.95rem;
  font-weight:600;
  color:var(--ink);
  transition:all .2s;
}

.faq-question:hover {
  background:#f0f7f3;
}

.faq-item.open .faq-question {
  background:#eef4f0;
  color:var(--forest);
}

.faq-question span:first-child {
  flex:1;
}

.faq-icon {
  font-size:1.2rem;
  font-weight:300;
  color:var(--forest);
  transition:transform .25s;
  flex-shrink:0;
}

.faq-answer {
  max-height:0;
  overflow:hidden;
  transition:max-height .3s ease;
}

.faq-item.open .faq-answer {
  max-height:400px;
}

.faq-answer p {
  padding:0 1.2rem 1rem;
  margin:0;
  color:var(--muted);
  line-height:1.65;
  font-size:.93rem;
}

/* ============================================
   CONTENT PAGES (FAQ, Contact, Terms, etc.)
   ============================================ */

.content-page-wrap {
  max-width:1280px;
  margin:0 auto;
  padding:0 1rem 2rem;
}

.info-sections {
  display:grid;
  gap:1.2rem;
  margin-bottom:2rem;
}

.info-block {
  padding:1.5rem;
}

.info-block h2 {
  color:var(--forest);
  margin:0 0 1rem;
  font-size:1.15rem;
}

.info-list {
  padding-left:1.3rem;
  margin:0;
  display:grid;
  gap:.45rem;
  color:var(--muted);
  line-height:1.6;
}

.info-list li {
  font-size:.93rem;
}

/* Contact section */
.contact-section {
  padding:1.5rem;
}

.contact-grid {
  display:grid;
  grid-template-columns:1fr 1.4fr;
  gap:2rem;
  align-items:start;
}

.contact-info h2 {
  color:var(--forest);
  margin:0 0 .7rem;
  font-size:1.3rem;
}

.contact-info > p {
  color:var(--muted);
  margin:0 0 1.5rem;
  line-height:1.6;
}

.contact-channels {
  display:flex;
  flex-direction:column;
  gap:.9rem;
}

.contact-channel {
  display:flex;
  align-items:flex-start;
  gap:.8rem;
}

.contact-channel > span {
  font-size:1.3rem;
  flex-shrink:0;
  margin-top:.1rem;
}

.contact-channel div {
  display:flex;
  flex-direction:column;
  gap:.2rem;
}

.contact-channel strong {
  font-size:.9rem;
  color:var(--ink);
}

.contact-channel a {
  color:var(--forest);
  font-size:.9rem;
  font-weight:600;
}

.contact-channel span {
  font-size:.9rem;
  color:var(--muted);
}

.contact-form {
  display:flex;
  flex-direction:column;
  gap:.8rem;
}

.contact-form .form-row {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.8rem;
}

.contact-form .form-field {
  display:flex;
  flex-direction:column;
  gap:.3rem;
}

.contact-form .form-field label {
  font-weight:600;
  font-size:.88rem;
  color:var(--ink);
}

.contact-form .form-field input,
.contact-form .form-field textarea {
  border:1.5px solid var(--line);
  border-radius:var(--radius-sm);
  padding:.65rem .8rem;
  font-size:.92rem;
  transition:border-color .2s, box-shadow .2s;
  width:100%;
}

.contact-form .form-field input:focus,
.contact-form .form-field textarea:focus {
  border-color:var(--forest);
  outline:none;
  box-shadow:0 0 0 3px rgba(30,67,50,.1);
}

.contact-form .form-field textarea {
  resize:vertical;
  min-height:120px;
}

/* Page CTA */
.page-cta {
  background:linear-gradient(135deg, var(--forest) 0%, var(--forest-2) 100%);
  border-radius:var(--radius);
  padding:2.5rem 2rem;
  text-align:center;
  margin-top:2rem;
  position:relative;
  overflow:hidden;
}

.page-cta::before {
  content:"";
  position:absolute;
  inset:0;
  background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

.page-cta h2 {
  color:var(--white);
  margin:0 0 .7rem;
  font-size:1.7rem;
  position:relative;
}

.page-cta p {
  color:rgba(255,255,255,.8);
  margin:0 0 1.5rem;
  font-size:1rem;
  position:relative;
}

.page-cta-actions {
  display:flex;
  gap:.7rem;
  justify-content:center;
  flex-wrap:wrap;
  position:relative;
}

.page-cta .btn {
  background:var(--white);
  color:var(--forest);
}

.page-cta .btn:hover {
  background:#f0f7f3;
  transform:translateY(-1px);
}

.page-cta .btn-ghost {
  background:transparent;
  border:2px solid rgba(255,255,255,.6);
  color:var(--white);
}

.page-cta .btn-ghost:hover {
  background:rgba(255,255,255,.1);
  border-color:var(--white);
}

@media (max-width: 768px) {
  .contact-grid {
    grid-template-columns:1fr;
  }
  .contact-form .form-row {
    grid-template-columns:1fr;
  }
}

/* ============================================
   AUTH SPLIT LAYOUT (Login + Register)
   ============================================ */

.auth-wrap {
  display:grid;
  grid-template-columns:1fr 1fr;
  min-height:calc(100vh - 80px);
}

.auth-hero {
  background:linear-gradient(145deg, #1a3d2e 0%, #2c5a45 50%, #3d7a5a 100%);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:3rem;
  position:relative;
  overflow:hidden;
}

.auth-hero::before {
  content:"";
  position:absolute;
  inset:0;
  background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

.auth-hero-content {
  position:relative;
  z-index:1;
  max-width:380px;
}

.auth-hero-logo {
  margin-bottom:2rem;
}

.auth-hero-logo img {
  height:64px;
  border-radius:14px;
  display:block;
}

.auth-hero-content h2 {
  color:var(--white);
  font-size:2.2rem;
  line-height:1.2;
  margin:0 0 1rem;
}

.auth-hero-content > p {
  color:rgba(255,255,255,.75);
  font-size:1.05rem;
  line-height:1.6;
  margin:0 0 1.8rem;
}

.auth-hero-benefits {
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:.7rem;
}

.auth-hero-benefits li {
  color:rgba(255,255,255,.9);
  font-size:.95rem;
  display:flex;
  align-items:center;
  gap:.7rem;
}

.auth-form-side {
  display:flex;
  align-items:center;
  justify-content:center;
  padding:3rem 2rem;
  background:var(--cream);
}

.auth-card {
  width:100%;
  max-width:420px;
}

.auth-card-header {
  margin-bottom:2rem;
}

.auth-card-header h1 {
  color:var(--forest);
  margin:0 0 .4rem;
  font-size:1.8rem;
}

.auth-card-header p {
  color:var(--muted);
  margin:0;
  font-size:.95rem;
}

.field-group {
  margin-bottom:1.2rem;
}

.field-group label {
  display:block;
  font-weight:600;
  margin-bottom:.4rem;
  font-size:.9rem;
  color:var(--ink);
}

.field-group input {
  border:1.5px solid var(--line);
  border-radius:var(--radius-sm);
  padding:.75rem .9rem;
  font-size:.95rem;
  width:100%;
  transition:border-color .2s, box-shadow .2s;
  background:var(--white);
}

.field-group input:focus {
  border-color:var(--forest);
  outline:none;
  box-shadow:0 0 0 3px rgba(30,67,50,.12);
}

.auth-divider {
  display:flex;
  align-items:center;
  gap:1rem;
  margin:1.2rem 0;
  color:var(--muted);
  font-size:.85rem;
}

.auth-divider::before,
.auth-divider::after {
  content:"";
  flex:1;
  height:1px;
  background:var(--line);
}

.auth-trust {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  margin-top:1.2rem;
  font-size:.82rem;
  color:var(--muted);
}

.auth-terms {
  text-align:center;
  font-size:.8rem;
  color:var(--muted);
  margin:1rem 0 0;
}

@media (max-width: 768px) {
  .auth-wrap {
    grid-template-columns:1fr;
  }
  .auth-hero {
    display:none;
  }
  .auth-form-side {
    padding:2rem 1rem;
  }
}