:root {
    --bg: #f3f1eb;
    --surface: #fff;
    --surface-soft: #fbf9f6;
    --ink: #16212b;
    --muted: #5b6774;
    --primary: #c09a44;
    --primary-dark: #9f7f35;
    --accent: #143a5e;
    --accent-deep: #0d2c49;
    --success: #2d8a4f;
    --warning: #c57f26;
    --danger: #c03d35;
    --line: #dde2e8;
    --radius: 18px;
    --radius-sm: 12px;
    --shadow-sm: 0 12px 28px rgba(19,31,43,0.08);
    --shadow-md: 0 18px 42px rgba(19,31,43,0.14);
    --shadow-lg: 0 24px 60px rgba(19,31,43,0.18);
    --transition: 0.25s ease;
    --touch-target: 44px;
}

*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{min-height:100vh;font-family:'Inter',sans-serif;color:var(--ink);background:var(--bg);line-height:1.7;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}img,svg,iframe,picture{max-width:100%;display:block;height:auto}a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}button,input,select,textarea{font:inherit;-webkit-appearance:none;appearance:none}button{cursor:pointer;min-height:var(--touch-target);min-width:var(--touch-target)}input[type="checkbox"],input[type="radio"]{width:1.25rem;height:1.25rem;cursor:pointer}

.site-main{min-height:calc(100vh - 160px);padding-bottom:3rem}
.site-main > *:first-child{margin-top:1rem}

.container{width:min(1140px,94vw);margin:0 auto;padding:0 1rem}

.alert-custom{position:relative;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.25rem 1.5rem;background:rgba(255,255,255,0.95);border-radius:18px;border-left:4px solid transparent;box-shadow:0 16px 35px rgba(20,58,94,0.08);color:var(--ink);font-weight:600;transition:transform var(--transition),opacity var(--transition);margin-bottom:1rem;overflow:hidden}
.alert-custom .btn-close{margin-left:1rem;width:1.4rem;height:1.4rem;opacity:0.75}
.alert-custom .btn-close:hover{opacity:1}
.alert-progress{position:absolute;left:0;right:0;bottom:0;height:4px;background:rgba(0,0,0,0.08);overflow:hidden;border-radius:0 0 18px 18px}
.alert-progress span{display:block;height:100%;width:100%;background:rgba(20,58,94,0.85);transform-origin:left center;transition:width linear}
.alert-success.alert-custom .alert-progress span{background:rgba(45,138,79,0.85)}
.alert-danger.alert-custom .alert-progress span{background:rgba(192,61,53,0.85)}
.alert-warning.alert-custom .alert-progress span{background:rgba(197,127,38,0.85)}
.alert-info.alert-custom .alert-progress span{background:rgba(20,58,94,0.85)}
.alert-success.alert-custom{background:rgba(45,138,79,0.12);border-color:rgba(45,138,79,0.35);color:#1f4d2d}
.alert-danger.alert-custom{background:rgba(192,61,53,0.12);border-color:rgba(192,61,53,0.28);color:#7f2520}
.alert-warning.alert-custom{background:rgba(197,127,38,0.12);border-color:rgba(197,127,38,0.28);color:#8a531f}
.alert-info.alert-custom{background:rgba(20,58,94,0.12);border-color:rgba(20,58,94,0.28);color:#0f2d51}
.alert-custom.fade{opacity:1}
.alert-custom.fade.show{opacity:1}
.alert-custom.fade:not(.show){opacity:0;transform:translateY(-8px)}
@keyframes alert-fade{0%{opacity:1;transform:translateY(0);max-height:120px;margin-bottom:1rem;padding-top:1rem;padding-bottom:1rem}99%{opacity:1;transform:translateY(0);max-height:120px;margin-bottom:1rem;padding-top:1rem;padding-bottom:1rem}100%{opacity:0;transform:translateY(-8px);max-height:0;margin-bottom:0;padding-top:0;padding-bottom:0}}

.navbar{background:linear-gradient(90deg,var(--accent-deep),var(--accent));box-shadow:0 8px 24px rgba(13,44,73,0.18);padding:clamp(0.75rem,2vw,1rem) clamp(1rem,4vw,1.5rem);backdrop-filter:blur(8px)}.navbar-brand{font-size:clamp(1.1rem,3vw,1.35rem);color:#fff;font-weight:800;letter-spacing:0.035em;display:flex;align-items:center;gap:clamp(0.5rem,2vw,0.75rem)}.navbar-brand img{height:clamp(32px,8vw,38px);width:auto}

.navbar-toggler{background:var(--primary) !important;border:1px solid rgba(255,255,255,0.16) !important;border-radius:var(--radius-sm) !important;padding:clamp(0.5rem,1.5vw,0.65rem) clamp(0.7rem,2vw,0.9rem) !important;box-shadow:0 8px 22px rgba(192,154,68,0.28) !important;transition:transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, border-color 0.2s ease !important;z-index:9999;display:flex !important;align-items:center !important;justify-content:center !important;min-height:var(--touch-target) !important;min-width:var(--touch-target) !important;position:relative !important;margin-left:auto !important;cursor:pointer !important;-webkit-user-select:none !important;user-select:none !important}
.navbar-toggler:hover{background:var(--primary-dark) !important;transform:translateY(-2px) !important;box-shadow:0 10px 26px rgba(192,154,68,0.35) !important}
.navbar-toggler:active{transform:translateY(-1px) scale(0.98) !important}
.navbar-toggler:focus{outline:2px solid rgba(192,154,68,0.5) !important;outline-offset:3px !important;border-radius:var(--radius-sm) !important}
.navbar-toggler:disabled{opacity:0.6 !important;cursor:not-allowed !important}
@media (hover:none){.navbar-toggler:active{background:var(--primary-dark) !important;box-shadow:0 8px 22px rgba(192,154,68,0.35) !important}}

.navbar-toggler-icon{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30' fill='none'><path stroke='%23fff' stroke-width='2.5' stroke-linecap='round' d='M4 8h22M4 16h22M4 24h22'/></svg>") !important;width:22px !important;height:22px !important;background-size:contain !important;background-position:center !important;background-repeat:no-repeat !important;transition:transform 0.25s ease, background-image 0.25s ease, opacity 0.25s ease !important;filter:drop-shadow(0 1px 2px rgba(0,0,0,0.1)) !important;display:inline-block !important}

.navbar-toggler.collapsed .navbar-toggler-icon{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30' fill='none'><path stroke='%23fff' stroke-width='2.5' stroke-linecap='round' d='M4 8h22M4 16h22M4 24h22'/></svg>") !important;transform:scale(1) rotate(0deg) !important}

.navbar-toggler:not(.collapsed) .navbar-toggler-icon{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30' fill='none'><path stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round' d='M6 10l9 9 9-9'/></svg>") !important;transform:scale(1.06) rotate(0deg) !important}

@media (min-width:992px){.navbar-toggler{display:none !important}}

.navbar-collapse{padding-top:0.5rem;transition:opacity 0.35s cubic-bezier(0.4,0,0.2,1),visibility 0.35s cubic-bezier(0.4,0,0.2,1)}.navbar-dark .navbar-nav .nav-link,.navbar-light .navbar-nav .nav-link{color:rgba(255,255,255,0.85);padding:clamp(0.6rem,1.5vw,0.75rem) clamp(0.8rem,2vw,1rem);font-weight:500;border-radius:8px;transition:all var(--transition);position:relative;min-height:var(--touch-target)}.navbar-dark .navbar-nav .nav-link:hover,.navbar-dark .navbar-nav .nav-link.active,.navbar-light .navbar-nav .nav-link:hover,.navbar-light .navbar-nav .nav-link.active{color:var(--primary);background:rgba(192,154,68,0.12)}

@media (max-width:991px){.navbar-nav{flex-direction:column;gap:0.5rem;padding-top:1rem;border-top:1px solid rgba(255,255,255,0.1)}.navbar-collapse{padding-top:1rem;animation:slideDownMenu 0.35s cubic-bezier(0.4,0,0.2,1) forwards;background:rgba(13,44,73,0.96);border:1px solid rgba(255,255,255,0.08);border-radius:16px;box-shadow:0 18px 40px rgba(9,25,39,0.22)}.navbar-collapse .nav-item{width:100%}.navbar-collapse .nav-link{width:100%}} 
@keyframes slideDownMenu{from{opacity:0;max-height:0;overflow:hidden;transform:translateY(-12px)}to{opacity:1;max-height:600px;overflow:visible;transform:translateY(0)}}

.footer{padding:clamp(2rem,5vw,3.5rem) 1rem 1.5rem;background:var(--accent-deep);color:rgba(255,255,255,0.88)}.footer h4,.footer a:hover{color:var(--primary);margin-bottom:1rem}.footer a{color:rgba(255,255,255,0.88);word-break:break-word}.footer-bottom{border-top:1px solid rgba(255,255,255,0.12);padding-top:1.5rem;margin-top:2rem;color:rgba(255,255,255,0.7);font-size:clamp(0.85rem,2vw,0.95rem)}

.hero-section{background:linear-gradient(135deg,rgba(20,58,94,0.95),rgba(13,44,73,0.92));color:white;padding:clamp(3rem,8vw,5rem) 1rem;position:relative;overflow:hidden;min-height:clamp(300px,80vh,600px);display:flex;align-items:center}.hero-section h1{font-size:clamp(1.75rem,6vw,4.2rem);font-weight:800;line-height:1.2;margin-bottom:clamp(1rem,2vw,1.5rem)}.hero-section p{max-width:680px;margin-bottom:clamp(1rem,2vw,1.75rem);font-size:clamp(0.95rem,2vw,1.05rem);color:rgba(255,255,255,0.92)}.hero-section .btn{min-width:auto;font-weight:600;width:100%;max-width:280px}@media (min-width:576px){.hero-section .btn{width:auto}}

.feature-section{background:var(--surface);padding:clamp(2rem,5vw,5rem) 1rem}.feature-card{background:rgba(255,255,255,0.98);border-radius:var(--radius);padding:clamp(2rem,4vw,2.5rem);box-shadow:var(--shadow-sm);transition:transform 0.35s ease,box-shadow 0.35s ease;min-height:100%;display:flex;flex-direction:column;align-items:flex-start}.feature-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-md)}.feature-card img{width:clamp(70px,10vw,85px);margin-bottom:clamp(1.25rem,2vw,1.75rem);filter:drop-shadow(0 2px 8px rgba(19,31,43,0.08))}.feature-card h3{margin-bottom:1rem;color:var(--accent-deep);font-size:clamp(1.15rem,2.5vw,1.45rem);line-height:1.3;font-weight:700}.feature-card p{color:var(--muted);font-size:clamp(0.9rem,1.5vw,0.95rem);line-height:1.65}

.highlight-card{background:rgba(255,255,255,0.12);border-radius:var(--radius-sm);padding:clamp(1.75rem,3vw,2.25rem);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.18);transition:all 0.35s ease}.highlight-card:hover{background:rgba(255,255,255,0.18);transform:translateY(-6px);border-color:rgba(255,255,255,0.3)}.highlight-icon{font-size:clamp(2.5rem,6vw,3rem);margin-bottom:clamp(0.85rem,1.5vw,1rem);line-height:1}

.highlights-section{background:linear-gradient(135deg,var(--accent-deep),var(--accent));color:white;padding:clamp(2rem,5vw,5rem) 1rem}.highlights-section h2{color:white;margin-bottom:clamp(1.5rem,3vw,2rem);font-size:clamp(1.8rem,5vw,2.9rem);font-weight:800}.highlights-section h4{margin-bottom:1rem;color:white;font-size:clamp(1.1rem,2.5vw,1.3rem);font-weight:700}.highlights-section p{color:rgba(255,255,255,0.82);font-size:clamp(0.9rem,1.5vw,0.95rem)}

.cta-section{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:white;text-align:center;padding:clamp(2rem,5vw,5rem) 1rem}.cta-section h2{font-size:clamp(1.8rem,5vw,3.2rem);margin-bottom:clamp(0.75rem,1.5vw,1rem)}.cta-section p{max-width:720px;margin:0 auto clamp(1rem,2vw,2rem);color:rgba(255,255,255,0.92);font-size:clamp(0.95rem,2vw,1.05rem)}.cta-section .btn{min-width:auto;width:100%;max-width:280px}@media (min-width:576px){.cta-section .btn{width:auto}}

.form-container{max-width:clamp(320px,95vw,540px);margin:0 auto;background:var(--surface);border-radius:var(--radius);padding:clamp(1.5rem,4vw,2.5rem);box-shadow:var(--shadow-md)}.form-container h1{color:var(--accent-deep);margin-bottom:0.75rem;font-size:clamp(1.5rem,3vw,2rem)}.form-container .form-label{font-weight:600;color:var(--accent-deep);font-size:clamp(0.95rem,1.5vw,1rem);margin-bottom:0.5rem}.form-container input,.form-container textarea,.form-container select,.form-container .form-control{border:1px solid #d7dbe2;border-radius:var(--radius-sm);padding:clamp(0.75rem,1.5vw,0.95rem) clamp(0.8rem,1.5vw,1rem);box-shadow:none;transition:border-color var(--transition),box-shadow var(--transition);min-height:var(--touch-target);font-size:clamp(0.95rem,1.5vw,1rem)}.form-container input:focus,.form-container textarea:focus,.form-container select:focus,.form-container .form-control:focus{border-color:var(--primary);box-shadow:0 0 0 0.15rem rgba(192,154,68,0.18)}.form-container .btn{min-width:100%;margin-top:clamp(0.75rem,1.5vw,1rem)}

.card{border-radius:var(--radius);border:1px solid rgba(20,58,94,0.08);background:var(--surface)}.card-header{border-radius:var(--radius) var(--radius) 0 0}.card-body{padding:clamp(1.25rem,3vw,2rem);overflow-wrap:break-word;word-wrap:break-word;word-break:break-word;min-width:0}.card-body p{overflow-wrap:break-word;word-wrap:break-word;word-break:break-word;min-width:0}.card-body span{overflow-wrap:break-word;word-wrap:break-word;word-break:break-word;display:inline-block}.card-body div{min-width:0}.card-body h6{overflow-wrap:break-word;word-wrap:break-word}.card .btn{min-width:auto}

.package-card{border:none;overflow:hidden;transition:transform 0.35s cubic-bezier(0.4,0,0.2,1),box-shadow 0.35s ease;display:flex;flex-direction:column;background:var(--surface);border-radius:var(--radius);box-shadow:0 10px 30px rgba(20,58,94,0.08);height:100%;position:relative;max-width:100%}.package-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--primary),var(--accent));border-radius:var(--radius) var(--radius) 0 0}.package-card:hover{transform:translateY(-14px);box-shadow:0 20px 50px rgba(20,58,94,0.18)}@media (hover:none){.package-card:active{transform:translateY(-8px);box-shadow:0 15px 35px rgba(20,58,94,0.12)}}

.package-image-container{width:100%;height:180px;position:relative;overflow:hidden;background:linear-gradient(135deg,rgba(20,58,94,0.08),rgba(192,154,68,0.06))}.package-image-container img{width:100%;height:100%;object-fit:cover;display:block}.package-summary{min-height:2.8rem}.package-meta-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0.5rem;margin-top:0.75rem}.package-meta-grid .meta-item{display:flex;align-items:center;gap:0.5rem;color:var(--muted);font-size:0.82rem;line-height:1.3}.package-actions .btn{min-width:0}

.filters-section .btn-check:checked+.btn,.filters-section .btn-outline-light{background-color:rgba(255,255,255,0.15);border:2px solid rgba(255,255,255,0.3);color:#fff !important;font-weight:600;padding:clamp(0.65rem,1.5vw,0.85rem) clamp(0.9rem,1.5vw,1.2rem);transition:all 0.25s cubic-bezier(0.4,0,0.2,1);min-height:var(--touch-target);border-radius:var(--radius-sm)}.filters-section .btn-check:checked+.btn{background-color:var(--primary);border-color:var(--primary);color:#fff !important;box-shadow:0 8px 28px rgba(192,154,68,0.35);transform:translateY(-2px)}.filters-section .btn-outline-light:hover{background-color:rgba(255,255,255,0.25);border-color:rgba(255,255,255,0.6);color:#fff;transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,0.2)}@media (hover:none){.filters-section .btn-outline-light:active{background-color:rgba(255,255,255,0.3);border-color:rgba(255,255,255,0.7)}}.filters-section .btn-group-vertical>.btn-check:not(:checked)+.btn{margin-bottom:0.65rem}.filters-section .form-select{background-color:rgba(255,255,255,0.15);border:2px solid rgba(255,255,255,0.3);color:#fff;padding:clamp(0.65rem,1.5vw,0.85rem) clamp(0.9rem,1.5vw,1.2rem);font-weight:600;min-height:var(--touch-target);border-radius:var(--radius-sm);transition:all 0.25s ease}.filters-section .form-select:hover{background-color:rgba(255,255,255,0.2);border-color:rgba(255,255,255,0.5)}.filters-section .form-select:focus{background-color:rgba(255,255,255,0.2);border-color:var(--primary);box-shadow:0 0 0 3px rgba(192,154,68,0.3)}.filters-section .form-select option{background:#1a2d42;color:#fff}.filters-section .form-label{color:#fff !important;font-weight:600;font-size:clamp(0.95rem,1.5vw,1.05rem);margin-bottom:clamp(0.75rem,1.5vw,1.2rem)}

.package-image{width:100%;height:clamp(160px,40vw,220px);background:linear-gradient(135deg,rgba(20,58,94,0.08),rgba(192,154,68,0.06));display:flex;align-items:center;justify-content:center;font-size:clamp(3.5rem,9vw,5.5rem);font-weight:300;position:relative;overflow:hidden}.package-image::after{content:'';position:absolute;top:-50%;right:-20%;width:300px;height:300px;background:rgba(192,154,68,0.08);border-radius:50%;animation:float 6s ease-in-out infinite}

@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-20px)}}.package-image>*{position:relative;z-index:1}

.package-content{flex:1;padding:clamp(1.25rem,2.5vw,1.75rem);display:flex;flex-direction:column;justify-content:space-between}.package-name{font-size:clamp(1.1rem,2.8vw,1.3rem);font-weight:800;color:var(--accent-deep);margin-bottom:0.45rem;line-height:1.3}.package-price{font-size:clamp(1.2rem,4vw,1.75rem);font-weight:800;color:var(--primary);margin:0.45rem 0}.package-duration{font-size:clamp(0.85rem,1.4vw,0.95rem);color:var(--muted);font-weight:600;margin:0.4rem 0}.package-description{font-size:clamp(0.85rem,1.4vw,0.9rem);color:var(--muted);line-height:1.5;margin:0.7rem 0;flex-grow:1}

.package-meta{display:flex;flex-wrap:wrap;gap:clamp(0.4rem,1.2vw,0.6rem);margin-top:0.85rem}.package-meta span{display:inline-flex;gap:0.4rem;align-items:center;color:var(--muted);font-size:clamp(0.75rem,1.3vw,0.85rem)}.package-meta .badge{padding:clamp(0.3rem,0.8vw,0.4rem) clamp(0.55rem,1.2vw,0.75rem);border-radius:5px;font-size:clamp(0.68rem,0.9vw,0.75rem)}

.filters-section{background:linear-gradient(135deg,var(--accent-deep) 0%,var(--accent) 100%);border-radius:calc(var(--radius)+4px);box-shadow:0 28px 60px rgba(18,41,72,0.28);padding:clamp(2rem,4vw,3rem);border:1px solid rgba(255,255,255,0.15);position:relative;overflow:hidden}.filters-section::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at top left,rgba(255,255,255,0.1),transparent 40%),radial-gradient(circle at bottom right,rgba(192,154,68,0.1),transparent 30%);pointer-events:none}.filters-section .form-label{color:#fff;font-size:clamp(0.95rem,1.5vw,1.05rem);font-weight:700;margin-bottom:clamp(0.75rem,1.5vw,1rem);display:flex;align-items:center;gap:0.5rem}.filters-section .package-search-input{background-color:rgba(255,255,255,0.12) !important;border:2px solid rgba(255,255,255,0.3) !important;color:#fff !important;padding:clamp(0.75rem,1.5vw,1rem) clamp(1rem,2vw,1.25rem) !important;border-radius:var(--radius-sm) !important;font-size:clamp(0.95rem,1.5vw,1rem) !important;transition:all 0.25s ease !important;min-height:var(--touch-target)}.filters-section .package-search-input::placeholder{color:rgba(255,255,255,0.6) !important}.filters-section .package-search-input:focus{background-color:rgba(255,255,255,0.18) !important;border-color:var(--primary) !important;box-shadow:0 0 0 3px rgba(192,154,68,0.3) !important;color:#fff !important}.filters-section .text-white{color:#fff !important}.filters-section .text-white-50{color:rgba(255,255,255,0.7) !important}.filters-section .badge{background-color:var(--primary) !important;color:#fff !important;font-weight:600;border-radius:var(--radius-sm)}.filters-section .text-muted{color:rgba(255,255,255,0.7) !important}.active-filters{margin-top:clamp(1.5rem,3vw,2rem);padding-top:clamp(1.5rem,3vw,2rem);border-top:1px solid rgba(255,255,255,0.2)}.filters-section .btn-reset{background-color:var(--primary) !important;border-color:var(--primary) !important;color:#fff !important;font-weight:600;padding:clamp(0.65rem,1.5vw,0.85rem) clamp(0.9rem,1.5vw,1.2rem);min-height:var(--touch-target);border-radius:var(--radius-sm);transition:all 0.25s ease}.filters-section .btn-reset:hover{background-color:var(--primary-dark) !important;border-color:var(--primary-dark) !important;transform:translateY(-2px);box-shadow:0 8px 28px rgba(192,154,68,0.35)}.filter-chips-group{display:flex;flex-wrap:wrap;gap:0.5rem}.filter-chips-group .btn-filter-chip{background:rgba(255,255,255,0.2);border:1px solid rgba(255,255,255,0.4);color:white;padding:0.4rem 0.8rem;font-size:0.8rem;border-radius:20px;transition:all 0.25s ease}.filter-chips-group .btn-filter-chip:hover{background:rgba(255,255,255,0.35);border-color:rgba(255,255,255,0.6)}.filter-chips-group .btn-check:checked+.btn-filter-chip{background:var(--primary);border-color:var(--primary);color:white}.filter-hero-icon{font-size:clamp(2rem,5vw,3.5rem);color:rgba(255,255,255,0.8);margin-bottom:1rem}

.badge-verified{background-color:#2d8a4f!important;color:white;padding:clamp(0.4rem,1vw,0.55rem) clamp(0.7rem,1.5vw,0.95rem);border-radius:6px;font-weight:600;font-size:clamp(0.8rem,1.5vw,0.95rem)}.badge-unverified{background-color:#c57f26!important;color:white;padding:clamp(0.4rem,1vw,0.55rem) clamp(0.7rem,1.5vw,0.95rem);border-radius:6px;font-weight:600;font-size:clamp(0.8rem,1.5vw,0.95rem)}

.profile-avatar{width:clamp(100px,20vw,120px);height:clamp(100px,20vw,120px);border-radius:50%;display:flex;align-items:center;justify-content:center;color:white;background:linear-gradient(135deg,#143a5e,#0d2c49);font-size:clamp(2.5rem,5vw,3rem);margin-bottom:1.5rem}

.stat-card,.section-panel,.about-panel,.profile-card{background:var(--surface);border:1px solid rgba(20,58,94,0.08);border-radius:var(--radius);padding:clamp(1.25rem,3vw,2rem);box-shadow:var(--shadow-sm)}

.section-panel,.about-panel{padding:clamp(1.5rem,3vw,2.5rem)}

.about-hero{background:linear-gradient(135deg,#143a5e,#0d2c49);color:white;padding:clamp(2rem,4vw,3rem) 1rem;border-radius:1rem;text-align:center;margin-bottom:clamp(2rem,4vw,3rem)}

.table{font-size:clamp(0.85rem,1.5vw,0.95rem);overflow-x:auto}.table thead th{border-bottom:2px solid rgba(20,58,94,0.12);padding:clamp(0.75rem,1.5vw,1rem)}.table tbody td{padding:clamp(0.75rem,1.5vw,1rem)}.table tbody tr:hover{background:rgba(192,154,68,0.08)}

.breadcrumb{background:transparent;padding:0;margin-bottom:clamp(1rem,2vw,1.5rem);flex-wrap:wrap}.breadcrumb .breadcrumb-item+.breadcrumb-item::before{color:rgba(0,0,0,0.35)}

.btn{min-height:var(--touch-target);padding:clamp(0.6rem,1.5vw,0.75rem) clamp(1.2rem,2vw,1.5rem);border-radius:var(--radius-sm);font-weight:600;transition:all var(--transition);font-size:clamp(0.95rem,1.5vw,1rem)}

.package-actions .btn{min-height:auto;padding:0.55rem 0.85rem;font-size:0.9rem;line-height:1.25}

.btn-primary{background:var(--primary);border-color:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-dark);border-color:var(--primary-dark)}

.btn-outline-primary{color:var(--primary);border-color:var(--primary)}.btn-outline-primary:hover{background:var(--primary);color:#fff;border-color:var(--primary)}

@media (max-width:374px){.container{padding:0 0.75rem}.form-container{border-radius:12px;padding:1rem}.feature-card{padding:1.5rem}.package-card{margin-bottom:1rem}.package-image{height:clamp(140px,45vw,160px)}}

@media (max-width:479px){.hero-section,.feature-section,.highlights-section,.cta-section{padding:2rem 1rem}.navbar{padding:0.75rem 1rem}.filters-section{padding:1rem}.package-card{margin-bottom:1rem}.table{font-size:0.8rem}.btn-group-vertical{width:100%}.feature-section .row{row-gap:1.5rem}.highlights-section .row{row-gap:1.5rem}}

@media (min-width:480px) and (max-width:767px){.hero-section,.feature-section,.highlights-section,.cta-section{padding:2.5rem 1.5rem}.navbar{padding:0.85rem 1.25rem}.package-card{box-shadow:0 12px 35px rgba(20,58,94,0.12)}.package-image{height:clamp(180px,38vw,220px)}}

@media (min-width:768px) and (max-width:991px){.sticky-top-card,.sticky-top-custom{position:static;top:auto}.filters-section{padding:1.75rem 1rem}.package-card{box-shadow:0 14px 40px rgba(20,58,94,0.14)}.package-image{height:clamp(200px,35vw,240px)}.feature-card{padding:2.25rem}.feature-card:hover{transform:translateY(-10px)}}

@media (min-width:992px){.sticky-top-card,.sticky-top-custom{position:sticky;top:1rem}.package-card:hover{box-shadow:0 25px 55px rgba(20,58,94,0.22)}}

/* Narropil brand layer: keeps Bootstrap structure, replaces its visual defaults. */
:root {
    --bg: #f8f7f4;
    --surface: #ffffff;
    --surface-soft: #f0eee8;
    --ink: #17232d;
    --muted: #65717a;
    --primary: #c09a44;
    --primary-dark: #9f7f35;
    --accent: #143a5e;
    --accent-deep: #0d2c49;
    --line: #dfe3e3;
    --radius: 8px;
    --radius-sm: 5px;
    --shadow-sm: 0 10px 26px rgba(13, 44, 73, 0.07);
    --shadow-md: 0 18px 42px rgba(13, 44, 73, 0.12);
}

body { font-family: 'DM Sans', sans-serif; background: var(--bg); color: var(--ink); }
h1, h2, h3, h4, h5, h6, .navbar-brand { font-family: 'Manrope', sans-serif; letter-spacing: 0; }
h1, h2, h3 { font-weight: 800; }
p { color: var(--muted); }
.site-main > *:first-child { margin-top: 0; }
.container { max-width: 1180px; }
.eyebrow { color: var(--primary-dark); font-size: .72rem; font-weight: 800; letter-spacing: .16em; line-height: 1.4; text-transform: uppercase; }
.section-lead { font-size: 1.1rem; line-height: 1.7; max-width: 34rem; }

.narropil-nav { background: rgba(13, 44, 73, .97); border-bottom: 1px solid rgba(255,255,255,.1); padding: 1rem 0; }
.narropil-nav .navbar-brand { font-size: 1rem; letter-spacing: .07em; line-height: 1; text-transform: uppercase; }
.narropil-nav .navbar-brand img { height: 34px; }
.narropil-nav .navbar-brand small { display: block; color: var(--primary); font-family: 'DM Sans', sans-serif; font-size: .58rem; font-weight: 700; letter-spacing: .22em; margin-top: .38rem; }
.narropil-nav .navbar-nav .nav-link { color: rgba(255,255,255,.72); font-size: .87rem; padding: .65rem .8rem; }
.narropil-nav .navbar-nav .nav-link:hover, .narropil-nav .navbar-nav .nav-link.active { background: transparent; color: #fff; }
.narropil-nav .nav-book-button { color: #fff; font-size: .82rem; min-height: 42px; padding: .65rem 1rem; }
.navbar-toggler { border-radius: var(--radius-sm) !important; }

.btn { border-radius: var(--radius-sm); font-size: .88rem; letter-spacing: .01em; }
.btn-primary { background: var(--primary); border-color: var(--primary); color: #fff; }
.btn-primary:hover, .btn-primary:focus { background: var(--primary-dark); border-color: var(--primary-dark); color: #fff; transform: translateY(-1px); }
.btn-outline-primary { color: var(--accent); border-color: var(--accent); }
.btn-outline-primary:hover { background: var(--accent); border-color: var(--accent); color: #fff; }
.btn-success { background: var(--success); border-color: var(--success); }
.btn:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid rgba(192,154,68,.55); outline-offset: 3px; }

.home-hero { min-height: min(720px, 82vh); padding: 0 0 5rem; display: flex; align-items: stretch; background: var(--accent-deep); isolation: isolate; }
.home-hero-slides { position: absolute; inset: 0; z-index: -2; background: var(--accent-deep); }
.home-hero-slide { position: absolute; inset: 0; opacity: 0; transition: opacity 1.2s ease; }
.home-hero-slide.is-active { opacity: 1; }
.home-hero-slide::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(8,26,42,.88) 0%, rgba(8,26,42,.55) 47%, rgba(8,26,42,.18) 100%); }
.home-hero-slide img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.home-hero-fallback { background: linear-gradient(90deg, rgba(8,26,42,.9), rgba(8,26,42,.35)), url('/media/package_images/2026/04/amboselielephants.webp') center/cover; }
.home-hero::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(8,26,42,.65), transparent 42%); pointer-events: none; }
.home-hero .container { display: flex; align-items: flex-end; padding-bottom: 1rem; }
.min-vh-75 { min-height: 75vh; }
.home-hero h1 { max-width: 760px; color: #fff; font-size: clamp(2.7rem, 6.5vw, 6.25rem); line-height: .98; margin: .75rem 0 1.5rem; }
.home-hero .hero-copy { color: rgba(255,255,255,.86); font-size: clamp(1rem, 1.7vw, 1.2rem); line-height: 1.65; max-width: 34rem; }
.hero-note { border-left: 1px solid rgba(255,255,255,.5); color: rgba(255,255,255,.82); margin-bottom: 1rem; padding: .25rem 0 .25rem 1.25rem; max-width: 18rem; }
.hero-note p { color: inherit; font-size: .9rem; line-height: 1.65; }
.hero-actions .btn { min-width: 160px; }
.home-hero-controls { position: absolute; bottom: 2rem; right: max(1rem, calc((100vw - 1180px) / 2)); display: flex; align-items: center; gap: .75rem; color: rgba(255,255,255,.82); }
.hero-control { width: 42px; height: 42px; min-height: 42px; min-width: 42px; border: 1px solid rgba(255,255,255,.45); border-radius: 50%; background: rgba(8,26,42,.25); color: #fff; transition: background .25s ease, border-color .25s ease; }
.hero-control:hover, .hero-control:focus-visible { background: var(--primary); border-color: var(--primary); }
.hero-counter { font-family: 'Manrope', sans-serif; font-size: .75rem; letter-spacing: .1em; }

.feature-section { background: var(--surface); }
.home-intro { padding-top: clamp(4rem, 9vw, 8rem) !important; padding-bottom: clamp(4rem, 9vw, 8rem) !important; }
.home-intro h2, .highlights-section h2, .cta-section h2 { font-size: clamp(2rem, 4vw, 3.5rem); line-height: 1.05; }
.feature-card { background: transparent; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: none; padding: 1.75rem; }
.feature-card:hover { border-color: var(--primary); box-shadow: var(--shadow-sm); transform: translateY(-4px); }
.feature-card .feature-number { color: var(--primary-dark); display: block; font-family: 'Manrope', sans-serif; font-size: .78rem; font-weight: 800; letter-spacing: .12em; margin-bottom: 3.5rem; }
.feature-card h3 { font-size: 1.15rem; }
.feature-card p { margin-bottom: 0; }
.highlights-section { background: var(--accent-deep); padding: clamp(4rem, 9vw, 7rem) 0 !important; }
.highlight-card { background: transparent; border: 0; border-top: 1px solid rgba(255,255,255,.25); border-radius: 0; padding: 1.25rem 0; text-align: left !important; }
.highlight-card:hover { background: transparent; border-color: var(--primary); transform: none; }
.highlight-icon { color: var(--primary); font-family: 'Manrope', sans-serif; font-size: 1rem; font-weight: 800; margin-bottom: 1.25rem; }
.highlight-card h4 { font-size: 1.8rem; }
.packages-section { padding: clamp(4rem, 9vw, 7rem) 0; }
.packages-section .section-title { font-size: clamp(2rem, 4vw, 3.5rem); margin-bottom: 2.5rem; }
.package-card { border: 1px solid var(--line); border-radius: var(--radius); box-shadow: none; }
.package-card::before { display: none; }
.package-card:hover { box-shadow: var(--shadow-md); transform: translateY(-6px); }
.package-image { height: 250px; background: var(--surface-soft); }
.package-image::after { display: none; }
.package-image img { width: 100%; height: 100%; object-fit: cover; }
.package-content { padding: 1.5rem; }
.package-name { font-size: 1.12rem; }
.package-price { color: var(--accent); font-size: 1.4rem; }
.package-duration { font-size: .82rem; font-weight: 500; }
.package-description { font-size: .9rem; }
.cta-section { background: var(--primary); padding: clamp(4rem, 9vw, 7rem) 0 !important; }
.cta-section p { color: rgba(255,255,255,.82); }

.packages-hero { background: var(--accent-deep); color: #fff; padding: clamp(4rem, 8vw, 7rem) 0 !important; }
.packages-hero h1 { color: #fff; font-size: clamp(2.4rem, 5vw, 5rem); line-height: 1.02; max-width: 760px; }
.packages-hero p.lead { color: rgba(255,255,255,.72); max-width: 600px; }
.packages-hero .eyebrow { color: var(--primary); }
.filters-section { border-radius: 0; box-shadow: none; margin: 0; }
.packages-grid-section { padding: clamp(4rem, 8vw, 7rem) 0 !important; }
.packages-grid-section .package-card { border-radius: var(--radius) !important; }
.package-image-container { height: 245px; }
.package-image-container img { transition: transform .5s ease; }
.package-card:hover .package-image-container img { transform: scale(1.04); }
.package-card .package-content { padding: 1.5rem !important; }
.package-card .price-panel { background: var(--surface-soft); border-radius: var(--radius-sm) !important; padding: 1rem; }
.package-card .package-actions { border-top: 1px solid var(--line); padding-top: 1rem; }

.footer { background: var(--accent-deep); padding: 4rem 0 1.5rem; }
.footer h4 { color: #fff; font-size: 1rem; margin-bottom: 1rem; }
.footer p { color: rgba(255,255,255,.68); font-size: .9rem; }
.footer .footer-kicker { color: var(--primary); font-family: 'Manrope', sans-serif; font-size: .72rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.footer li { margin-bottom: .5rem; }
.footer a { color: rgba(255,255,255,.68); font-size: .9rem; }
.footer a:hover { color: var(--primary); }

@media (max-width: 991.98px) {
    .narropil-nav .navbar-collapse { background: var(--accent-deep); margin: 1rem -1rem -1rem; padding: 1rem; }
    .home-hero { min-height: 680px; }
}
@media (max-width: 575.98px) {
    .home-hero { min-height: 650px; padding-bottom: 2rem; }
    .home-hero-image { background-position: 63% center; }
    .home-hero-slide img { object-position: 63% center; }
    .home-hero-controls { bottom: 1.25rem; right: 1rem; }
    .home-hero h1 { font-size: clamp(2.55rem, 14vw, 4rem); }
    .hero-actions .btn { width: 100%; }
    .package-image { height: 220px; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
    .home-hero-slide { transition: none; }
}

.worker-assignments-page { background: var(--bg); min-height: calc(100vh - 150px); }
.worker-assignments-page h1 { color: var(--accent-deep); font-size: clamp(2.2rem, 5vw, 4.5rem); line-height: 1; }
.worker-assignments-page .lead { color: var(--muted); max-width: 42rem; }
.worker-assignment-count { align-items: baseline; background: var(--accent-deep); border-radius: var(--radius); color: #fff; display: flex; gap: .55rem; padding: 1rem 1.25rem; }
.worker-assignment-count strong { color: var(--primary); font-family: 'Manrope', sans-serif; font-size: 2rem; line-height: 1; }
.worker-assignment-count span { color: rgba(255,255,255,.7); font-size: .82rem; }
.assignment-filter { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1rem; }
.assignment-filter .form-label { color: var(--accent-deep); font-size: .75rem; font-weight: 800; letter-spacing: .08em; margin-bottom: .4rem; text-transform: uppercase; }
.assignment-filter .form-select { min-width: 240px; }
.assignment-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-sm); display: flex; flex-direction: column; padding: 1.35rem; transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease; }
.assignment-card:hover { border-color: rgba(192,154,68,.7); box-shadow: var(--shadow-md); transform: translateY(-4px); }
.assignment-card-top, .assignment-footer, .assignment-meta { align-items: center; display: flex; flex-wrap: wrap; gap: .65rem; justify-content: space-between; }
.assignment-status { border-radius: 999px; font-size: .7rem; font-weight: 800; letter-spacing: .05em; padding: .35rem .6rem; text-transform: uppercase; }
.status-assigned { background: rgba(192,154,68,.15); color: var(--primary-dark); }
.status-confirmed { background: rgba(45,138,79,.14); color: #267442; }
.status-in_progress { background: rgba(20,58,94,.12); color: var(--accent); }
.status-completed { background: rgba(101,113,122,.14); color: var(--muted); }
.status-cancelled { background: rgba(192,61,53,.12); color: var(--danger); }
.assignment-date, .assignment-footer { color: var(--muted); font-size: .78rem; }
.assignment-card h2 { color: var(--accent-deep); font-size: 1.35rem; line-height: 1.2; margin: 1.25rem 0 .8rem; }
.assignment-dates { color: var(--accent); font-size: .88rem; font-weight: 600; }
.assignment-dates i, .assignment-meta i { color: var(--primary-dark); margin-right: .35rem; }
.assignment-meta { border-bottom: 1px solid var(--line); color: var(--muted); font-size: .8rem; justify-content: flex-start; margin: 1rem 0; padding-bottom: 1rem; }
.assignment-note { background: var(--surface-soft); border-left: 3px solid var(--primary); margin: .25rem 0 .75rem; padding: .7rem .8rem; }
.assignment-note strong { color: var(--accent-deep); display: block; font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; }
.assignment-note p { font-size: .84rem; margin: .25rem 0 0; }
.assignment-footer { border-top: 1px solid var(--line); margin-top: auto; padding-top: 1rem; }
.assignment-empty { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-sm); margin: 2rem auto; max-width: 640px; padding: 4rem 1.5rem; }
.assignment-empty-icon { color: var(--primary); font-size: 2.5rem; margin-bottom: 1.25rem; }
.assignment-empty h2 { color: var(--accent-deep); font-size: 1.5rem; }
.assignment-empty p { margin: 0 auto 1.5rem; max-width: 28rem; }

@media (hover:none){button:active,a:active{opacity:0.8}input:active,textarea:active{border-color:var(--primary)}}

.footer{padding:3.5rem 0 2rem;background:var(--accent-deep);color:rgba(255,255,255,0.88)}.footer h4,.footer a:hover{color:var(--primary);color:white;margin-bottom:1rem}.footer a{color:rgba(255,255,255,0.88)}.footer-bottom{border-top:1px solid rgba(255,255,255,0.12);padding-top:1.5rem;margin-top:2rem;color:rgba(255,255,255,0.7);font-size:0.95rem}

.hero-section{background:linear-gradient(135deg,rgba(20,58,94,0.95),rgba(13,44,73,0.92));color:white;padding:5rem 0;position:relative;overflow:hidden}.hero-section h1{font-size:clamp(2.8rem,5vw,4.2rem);font-weight:800;line-height:1.02;margin-bottom:1.5rem}.hero-section p{max-width:680px;margin-bottom:1.75rem;font-size:1.05rem;color:rgba(255,255,255,0.92)}.hero-section .btn{min-width:170px;font-weight:600}

.feature-section{background:var(--surface);padding:5rem 0}.feature-card{background:rgba(255,255,255,0.98);border-radius:var(--radius);padding:2rem;box-shadow:var(--shadow-sm);transition:transform 0.35s ease,box-shadow 0.35s ease;min-height:100%}.feature-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md)}.feature-card img{width:72px;margin-bottom:1.5rem}.feature-card h3{margin-bottom:0.85rem;color:var(--accent-deep)}.feature-card p{color:var(--muted)}

.highlights-section{background:linear-gradient(135deg,var(--accent-deep),var(--accent));color:white;padding:5rem 0}.highlights-section h2{color:white;margin-bottom:2rem;font-size:clamp(2.2rem,4vw,2.9rem)}.highlights-section .col-md-3{margin-bottom:1.5rem}.highlights-section h4{margin-bottom:1rem;color:white}.highlights-section p{color:rgba(255,255,255,0.82)}

.cta-section{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:white;text-align:center;padding:5rem 0}.cta-section h2{font-size:clamp(2.4rem,4vw,3.2rem);margin-bottom:1rem}.cta-section p{max-width:720px;margin:0 auto 2rem;color:rgba(255,255,255,0.92);font-size:1.05rem}

.form-container{max-width:540px;margin:0 auto;background:var(--surface);border-radius:var(--radius);padding:2.5rem;box-shadow:var(--shadow-md)}.form-container h1{color:var(--accent-deep);margin-bottom:0.75rem}.form-container .form-label{font-weight:600;color:var(--accent-deep)}.form-container input,.form-container textarea,.form-container select,.form-container .form-control{border:1px solid #d7dbe2;border-radius:14px;padding:0.95rem 1rem;box-shadow:none;transition:border-color var(--transition),box-shadow var(--transition)}.form-container input:focus,.form-container textarea:focus,.form-container select:focus,.form-container .form-control:focus{border-color:var(--primary);box-shadow:0 0 0 0.15rem rgba(192,154,68,0.18)}

.card{border-radius:var(--radius);border:1px solid rgba(20,58,94,0.08);background:var(--surface)}.card-header{border-radius:var(--radius) var(--radius) 0 0}.card-body{padding:2rem}.card .btn{min-width:160px}

.package-card{border:none;overflow:hidden;transition:transform 0.35s cubic-bezier(0.4,0,0.2,1),box-shadow 0.35s ease;display:flex;flex-direction:column;background:var(--surface);border-radius:var(--radius);box-shadow:0 10px 30px rgba(20,58,94,0.08);height:100%;position:relative}.package-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--primary),var(--accent));border-radius:var(--radius) var(--radius) 0 0}.package-card:hover{transform:translateY(-12px);box-shadow:0 20px 45px rgba(20,58,94,0.15)}
.package-image-container .badge-overlay{position:absolute;top:1rem;left:1rem;right:auto;z-index:3;display:flex;flex-wrap:wrap;align-items:flex-start;gap:.45rem;max-width:calc(100% - 2rem);pointer-events:none}
.package-image-container .badge-overlay .badge{display:inline-flex;align-items:center;gap:.35rem;padding:.45rem .7rem;border:1px solid rgba(255,255,255,.45);border-radius:999px;color:#fff;font-size:.72rem;font-weight:800;line-height:1.1;letter-spacing:.02em;box-shadow:0 5px 14px rgba(8,26,42,.28);text-shadow:0 1px 1px rgba(0,0,0,.2)}
.package-image-container .badge-overlay .bg-warning{background:#d6a52f !important;color:#17232d !important;text-shadow:none}
.package-image-container .badge-overlay .bg-danger{background:#b9433c !important;color:#fff !important}
.package-image-container .badge-overlay .bg-success{background:#2d8a4f !important;color:#fff !important}

.filters-section .btn-check:checked+.btn,.filters-section .btn-outline-light{background-color:rgba(255,255,255,0.12);border-color:rgba(255,255,255,0.3);color:#fff !important;font-weight:500;padding:0.85rem 1.2rem;transition:all 0.25s ease}.filters-section .btn-check:checked+.btn{background-color:var(--primary);border-color:var(--primary);color:#fff !important;box-shadow:0 8px 24px rgba(192,154,68,0.28)}.filters-section .btn-outline-light:hover{background-color:rgba(255,255,255,0.2);border-color:rgba(255,255,255,0.5);color:#fff;transform:translateY(-2px)}.filters-section .btn-group-vertical>.btn-check:not(:checked)+.btn{margin-bottom:0.5rem}.filters-section .form-select{background-color:rgba(255,255,255,0.12);border-color:rgba(255,255,255,0.3);color:#fff;padding:0.85rem 1.2rem;font-weight:500}.filters-section .form-select:focus{background-color:rgba(255,255,255,0.18);border-color:var(--primary);box-shadow:0 0 0 0.2rem rgba(192,154,68,0.25)}.filters-section .form-select option{background:#1a1a1a;color:#fff}.filters-section .form-label{color:#fff !important;font-weight:600;font-size:1.05rem;margin-bottom:1.2rem}

.package-image{width:100%;height:220px;background:linear-gradient(135deg,rgba(20,58,94,0.08),rgba(192,154,68,0.06));display:flex;align-items:center;justify-content:center;font-size:5rem;font-weight:300;position:relative;overflow:hidden}.package-image::after{content:'';position:absolute;top:-50%;right:-20%;width:300px;height:300px;background:rgba(192,154,68,0.08);border-radius:50%;animation:float 6s ease-in-out infinite}

@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-20px)}}.package-image>*{position:relative;z-index:1}

.package-content{flex:1;padding:2rem;display:flex;flex-direction:column;justify-content:space-between}.package-name{font-size:1.35rem;font-weight:800;color:var(--accent-deep);margin-bottom:0.5rem;line-height:1.3}.package-price{font-size:clamp(1.3rem,3vw,1.8rem);font-weight:800;color:var(--primary);margin:0.5rem 0}.package-duration{font-size:0.95rem;color:var(--muted);font-weight:600;margin:0.5rem 0}.package-description{font-size:0.95rem;color:var(--muted);line-height:1.6;margin:1rem 0;flex-grow:1}

.package-meta{display:flex;flex-wrap:wrap;gap:0.75rem;margin-top:1.25rem}.package-meta span{display:inline-flex;gap:0.5rem;align-items:center;color:var(--muted)}.package-meta .badge{padding:0.45rem 0.85rem;border-radius:6px;font-size:0.8rem}

.filters-section{background:linear-gradient(135deg,var(--accent-deep) 0%,var(--accent) 100%);border-radius:calc(var(--radius)+4px);box-shadow:0 28px 60px rgba(18,41,72,0.28);padding:2.5rem;border:1px solid rgba(255,255,255,0.15);position:relative;overflow:hidden}.filters-section::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at top left,rgba(255,255,255,0.1),transparent 40%),radial-gradient(circle at bottom right,rgba(192,154,68,0.1),transparent 30%);pointer-events:none}.filters-section .form-label{color:#fff;font-size:1rem;font-weight:700;margin-bottom:1rem;display:flex;align-items:center;gap:0.5rem}.filters-section .package-search-input{background-color:rgba(255,255,255,0.12) !important;border:2px solid rgba(255,255,255,0.3) !important;color:#fff !important;padding:0.75rem 1rem !important;border-radius:var(--radius-sm) !important;font-size:1rem !important;transition:all 0.25s ease !important;min-height:var(--touch-target)}.filters-section .package-search-input::placeholder{color:rgba(255,255,255,0.6) !important}.filters-section .package-search-input:focus{background-color:rgba(255,255,255,0.18) !important;border-color:var(--primary) !important;box-shadow:0 0 0 3px rgba(192,154,68,0.3) !important;color:#fff !important}

.badge-verified{background-color:#2d8a4f!important;color:white;padding:0.55rem 0.95rem;border-radius:6px;font-weight:600;font-size:0.95rem}.badge-unverified{background-color:#c57f26!important;color:white;padding:0.55rem 0.95rem;border-radius:6px;font-weight:600;font-size:0.95rem}

.profile-avatar{width:120px;height:120px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:white;background:linear-gradient(135deg,#143a5e,#0d2c49);font-size:3rem;margin-bottom:1.5rem}

.stat-card,.section-panel,.about-panel,.profile-card{background:var(--surface);border:1px solid rgba(20,58,94,0.08);border-radius:var(--radius);padding:2rem;box-shadow:var(--shadow-sm)}

.stat-card{padding:1.75rem}.section-panel,.about-panel{padding:2.5rem}

.about-hero{background:linear-gradient(135deg,#143a5e,#0d2c49);color:white;padding:3rem 2rem;border-radius:1rem;text-align:center;margin-bottom:3rem}

.table thead th{border-bottom:2px solid rgba(20,58,94,0.12)}.table tbody tr:hover{background:rgba(192,154,68,0.08)}

/* ============================================
   BOOKING PAGES - RESPONSIVE STYLES
   ============================================ */

/* Booking Main Container */
.booking-main,
.booking-detail-main {
    min-height: calc(100vh - 200px);
    padding: clamp(1.5rem, 4vw, 2.5rem) clamp(0.75rem, 2vw, 1.5rem);
    background: var(--bg);
}

/* Booking Form Styles */
.booking-main .card {
    border-radius: var(--radius);
    overflow: hidden;
}

.booking-main .form-control-lg,
.booking-detail-main .form-control-lg {
    font-size: clamp(0.95rem, 2vw, 1rem);
    padding: clamp(0.7rem, 1.5vw, 0.9rem) clamp(0.8rem, 1.5vw, 1rem);
    min-height: var(--touch-target);
}

.booking-main .form-label,
.booking-detail-main .form-label {
    font-size: clamp(0.9rem, 1.5vw, 1rem);
    margin-bottom: clamp(0.4rem, 1vw, 0.6rem);
}

/* Booking Summary Sidebar */
.booking-summary-card {
    position: sticky;
    top: 1rem;
    z-index: 10;
}

.quick-facts {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.quick-facts-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem;
    background: rgba(192, 154, 68, 0.08);
    border-radius: var(--radius-sm);
}

.quick-facts-item .label {
    color: var(--muted);
    font-size: clamp(0.85rem, 1.5vw, 0.9rem);
    font-weight: 500;
}

.quick-facts-item .value {
    color: var(--accent-deep);
    font-weight: 700;
    font-size: clamp(0.9rem, 1.5vw, 1rem);
}

.booking-price {
    font-size: clamp(1.25rem, 3vw, 1.5rem) !important;
}

.booking-deposit {
    font-size: clamp(1rem, 2vw, 1.15rem);
    font-weight: 700;
    color: var(--primary) !important;
}

/* Booking Detail Page */
.booking-detail-main .card {
    border-radius: var(--radius);
}

.booking-detail-main .badge {
    font-size: clamp(0.75rem, 1.5vw, 0.9rem);
    padding: clamp(0.4rem, 1vw, 0.55rem) clamp(0.65rem, 1.5vw, 0.85rem);
}

.booking-detail-main .table {
    font-size: clamp(0.85rem, 1.5vw, 0.95rem);
    margin-bottom: 0;
}

.booking-detail-main .table td {
    padding: clamp(0.6rem, 1.5vw, 0.85rem) clamp(0.5rem, 1vw, 0.75rem);
}

/* Booking Filters */
.booking-filters .form-select {
    min-width: clamp(120px, 25vw, 160px);
    font-size: clamp(0.85rem, 1.5vw, 0.9rem);
    padding: clamp(0.5rem, 1vw, 0.65rem) clamp(0.6rem, 1.2vw, 0.8rem);
}

.booking-filters .btn-group {
    flex-wrap: wrap;
    justify-content: flex-end;
}

.booking-filters .btn-group .btn {
    font-size: clamp(0.75rem, 1.5vw, 0.85rem);
    padding: clamp(0.4rem, 1vw, 0.5rem) clamp(0.6rem, 1.2vw, 0.75rem);
}

/* Booking Actions */
.booking-actions {
    gap: 0.25rem;
}

.booking-actions .btn {
    padding: clamp(0.35rem, 0.8vw, 0.45rem) clamp(0.5rem, 1vw, 0.65rem);
    font-size: clamp(0.8rem, 1.5vw, 0.9rem);
}

/* Booking Table Responsive */
.booking-table {
    margin: 0 calc(-1 * clamp(0.5rem, 1.5vw, 1rem));
    padding: 0 clamp(0.5rem, 1.5vw, 1rem);
}

.booking-table .table {
    min-width: 700px;
}

/* ============================================
   MOBILE RESPONSIVE ADJUSTMENTS
   ============================================ */

@media (max-width: 767px) {
    /* Booking Main */
    .booking-main,
    .booking-detail-main {
        padding: 1rem clamp(0.5rem, 2vw, 0.75rem);
    }

    /* Booking Cards */
    .booking-main .card-header,
    .booking-detail-main .card-header {
        padding: clamp(1rem, 3vw, 1.25rem) !important;
    }

    .booking-main .card-header h3,
    .booking-detail-main .card-header h5 {
        font-size: clamp(1.1rem, 3vw, 1.35rem);
    }

    .booking-main .card-body,
    .booking-detail-main .card-body {
        padding: clamp(1rem, 3vw, 1.25rem);
    }

    /* Booking Form */
    .booking-main .col-lg-8,
    .booking-detail-main .col-lg-8 {
        order: 1;
    }

    .booking-main .col-lg-4,
    .booking-detail-main .col-lg-4 {
        order: 2;
    }

    /* Booking Summary Sidebar - Stack below form on mobile */
    .booking-summary-card {
        position: static;
        margin-top: 1.5rem;
    }

    /* Booking Filters */
    .booking-filters .col-md-6:first-child {
        margin-bottom: 0.75rem;
    }

    .booking-filters .col-md-6.text-end {
        text-align: start !important;
        margin-top: 0.5rem;
    }

    .booking-filters .btn-group {
        justify-content: flex-start;
    }

    /* Booking Detail - Stack columns */
    .booking-detail-main .row .col-lg-8,
    .booking-detail-main .row .col-lg-4 {
        width: 100%;
    }

    /* Status badges side by side on mobile */
    .booking-detail-main .card-body .row > div {
        margin-bottom: 1rem;
    }

    /* Booking Table - Horizontal scroll */
    .booking-table {
        font-size: 0.8rem;
    }

    .booking-table th,
    .booking-table td {
        padding: 0.5rem 0.4rem;
        vertical-align: middle;
    }

    /* Worker Bookings Card Grid */
    .worker-bookings-grid .col-lg-6,
    .worker-bookings-grid .col-xl-4 {
        width: 100%;
    }

    /* Action buttons full width on mobile */
    .booking-main .row.g-3 .col-md-6,
    .booking-detail-main .row.g-3 .col-md-6 {
        width: 100%;
    }

    .booking-main .btn-lg,
    .booking-detail-main .btn-lg {
        padding: clamp(0.65rem, 1.5vw, 0.8rem) 1rem;
        font-size: clamp(0.95rem, 2vw, 1.05rem);
    }

    /* Breadcrumb adjustments */
    .booking-main .breadcrumb,
    .booking-detail-main .breadcrumb {
        font-size: clamp(0.75rem, 1.5vw, 0.85rem);
    }

    /* Quick facts stacked */
    .quick-facts {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    .quick-facts-item {
        flex: 1 1 calc(50% - 0.25rem);
        min-width: 140px;
        padding: 0.6rem;
    }

    .quick-facts-item .label {
        font-size: 0.8rem;
    }

    .quick-facts-item .value {
        font-size: 0.85rem;
    }
}

/* Use a directional close cue instead of an X while the mobile menu is open. */
@media (max-width: 991.98px) {
    .navbar-toggler:not(.collapsed) .navbar-toggler-icon {
        background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30' fill='none'><path stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round' d='M6 10l9 9 9-9'/></svg>") !important;
        transform: scale(1.05) !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .booking-summary-card {
        position: static;
        top: auto;
    }

    .booking-table {
        min-width: 600px;
    }
}

@media (min-width: 992px) {
    .booking-summary-card {
        position: sticky;
        top: 5.5rem;
    }
}

/* Extra small devices */
@media (max-width: 374px) {
    .booking-main .container,
    .booking-detail-main .container {
        padding: 0 0.5rem;
    }

    .booking-main .card,
    .booking-detail-main .card {
        border-radius: 12px;
    }

    .booking-filters .btn-group .btn {
        padding: 0.4rem 0.5rem;
        font-size: 0.7rem;
    }

    .quick-facts-item {
        flex: 1 1 100%;
    }
}

/* ============================================
   PAYMENT PAGES - RESPONSIVE STYLES
   ============================================ */

.payment-main {
    min-height: calc(100vh - 200px);
    padding: clamp(1.5rem, 4vw, 3rem) clamp(0.75rem, 2vw, 1rem);
    background: var(--bg);
}

.payment-main .card {
    border-radius: var(--radius);
    overflow: hidden;
}

.payment-main .card-header {
    padding: clamp(1rem, 3vw, 1.5rem);
}

.payment-main .card-header h3 {
    font-size: clamp(1.1rem, 3vw, 1.5rem);
}

.payment-main .card-body {
    padding: clamp(1.25rem, 3vw, 2rem);
}

.payment-summary-box {
    background: rgba(192, 154, 68, 0.08) !important;
    border-radius: var(--radius-sm);
    padding: clamp(0.85rem, 2vw, 1.25rem);
}

.payment-summary-box p {
    font-size: clamp(0.85rem, 1.5vw, 0.95rem);
    margin-bottom: 0.5rem;
}

.payment-summary-box p:last-child {
    margin-bottom: 0;
}

.payment-phone-input {
    font-size: clamp(0.95rem, 1.5vw, 1rem);
    padding: clamp(0.7rem, 1.5vw, 0.9rem) clamp(0.8rem, 1.5vw, 1rem);
    min-height: var(--touch-target);
}

.payment-main .form-check-label {
    font-size: clamp(0.9rem, 1.5vw, 1rem);
    line-height: 1.5;
}

.payment-main .form-text {
    font-size: clamp(0.8rem, 1.5vw, 0.9rem);
}

.payment-main .btn-lg {
    padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1.5rem, 4vw, 2.5rem);
    font-size: clamp(1rem, 2vw, 1.15rem);
}

.payment-main .alert {
    border-radius: var(--radius-sm);
    padding: clamp(0.85rem, 2vw, 1.25rem);
    font-size: clamp(0.9rem, 1.5vw, 1rem);
}

.booking-price-small {
    font-size: clamp(1.1rem, 2.5vw, 1.35rem);
    color: var(--primary);
    font-weight: 700;
}

/* Payment page mobile adjustments */
@media (max-width: 767px) {
    .payment-main {
        padding: 1rem clamp(0.5rem, 2vw, 0.75rem);
    }

    .payment-main .row.mb-4 > div {
        margin-bottom: 1.25rem;
    }

    .payment-main .row.mb-4 > div:last-child {
        margin-bottom: 0;
    }

    .payment-main .col-md-6 {
        width: 100%;
    }

    .payment-main .form-check {
        padding: 0.75rem;
        background: rgba(192, 154, 68, 0.05);
        border-radius: var(--radius-sm);
        margin-bottom: 0.75rem;
    }

    .payment-main .btn-lg {
        width: 100%;
        margin-top: 0.5rem;
    }

    .payment-main .text-center {
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
    }

    .payment-main .text-center .btn {
        width: 100%;
    }
}

@media (min-width: 768px) {
    .payment-main .row.mb-4 {
        display: flex;
        align-items: stretch;
    }

    .payment-main .row.mb-4 > div {
        display: flex;
        flex-direction: column;
    }

    .payment-summary-box {
        flex: 1;
    }
}

/* ============================================
   WORKER BOOKINGS - CARD GRID STYLES
   ============================================ */

.worker-bookings-grid .card {
    border-radius: var(--radius);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.worker-bookings-grid .card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
}

.worker-bookings-grid .card-header {
    padding: clamp(0.75rem, 2vw, 1rem);
    background: var(--surface-soft);
    border-bottom: 1px solid rgba(20, 58, 94, 0.08);
}

.worker-bookings-grid .card-header h6 {
    font-size: clamp(0.85rem, 1.5vw, 0.95rem);
}

.worker-bookings-grid .card-body {
    padding: clamp(1rem, 2.5vw, 1.5rem);
}

.worker-bookings-grid .card-body p {
    font-size: clamp(0.8rem, 1.5vw, 0.9rem);
    margin-bottom: 0.4rem;
    line-height: 1.4;
}

.worker-bookings-grid .card-body h5 {
    font-size: clamp(1rem, 2vw, 1.2rem);
    margin-bottom: 0.75rem;
}

.worker-bookings-grid .card-footer {
    padding: clamp(0.75rem, 2vw, 1rem);
    background: var(--surface-soft);
    border-top: 1px solid rgba(20, 58, 94, 0.08);
}

.worker-bookings-grid .card-footer .d-flex {
    gap: 0.5rem;
}

.worker-bookings-grid .card-footer .btn {
    font-size: clamp(0.8rem, 1.5vw, 0.9rem);
    padding: clamp(0.5rem, 1vw, 0.65rem) clamp(0.75rem, 1.5vw, 1rem);
}

.border-left-primary {
    border-left: 4px solid var(--accent) !important;
}

/* Worker bookings mobile */
@media (max-width: 767px) {
    .worker-bookings-grid {
        gap: 0 !important;
    }

    .worker-bookings-grid > div {
        margin-bottom: 1rem;
    }

    .worker-bookings-grid .card {
        margin-bottom: 0;
    }

    .worker-bookings-grid .card-footer .d-flex {
        flex-direction: column;
    }

    .worker-bookings-grid .card-footer .btn {
        width: 100%;
    }

    .worker-bookings-grid .card-footer .btn.flex-fill {
        flex: 1 1 100% !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .worker-bookings-grid > div {
        margin-bottom: 1.25rem;
    }
}

/* ============================================
   PACKAGE DETAIL PAGE - RESPONSIVE STYLES
   ============================================ */

.package-detail-main {
    background: var(--bg);
    min-height: calc(100vh - 200px);
}

.package-detail-main .container {
    padding: clamp(2rem, 4vw, 4rem) 1rem;
}

.package-hero {
    background: linear-gradient(135deg, var(--accent-deep), var(--accent));
    color: white;
    padding: clamp(2.5rem, 6vw, 4.5rem) 1rem;
    position: relative;
    overflow: hidden;
}
.package-hero::after {
    content: '';
    position: absolute;
    top: -50%;
    right: -10%;
    width: 400px;
    height: 400px;
    background: rgba(192, 154, 68, 0.1);
    border-radius: 50%;
    pointer-events: none;
}

.package-hero h1 {
    font-size: clamp(2rem, 5.5vw, 3.2rem);
    font-weight: 800;
    line-height: 1.15;
    margin-bottom: 1rem;
    letter-spacing: -0.02em;
    position: relative;
    z-index: 1;
}

.package-hero .lead {
    font-size: clamp(1rem, 2vw, 1.1rem);
    color: rgba(255, 255, 255, 0.88);
    line-height: 1.6;
    position: relative;
    z-index: 1;
}

.package-image-card {
    width: 100%;
    height: clamp(280px, 50vw, 480px);
    background: linear-gradient(135deg, rgba(20, 58, 94, 0.08), rgba(192, 154, 68, 0.06));
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 12px 40px rgba(20, 58, 94, 0.15);
    overflow: hidden;
}

.package-image-card img {
    object-fit: cover;
    min-height: 100%;
}

.package-empty-icon {
    font-size: clamp(4rem, 12vw, 8rem);
    opacity: 0.6;
}

.package-detail-main .card {
    border-radius: var(--radius);
}

.package-detail-main .card h4 {
    font-size: clamp(1.1rem, 1.6vw, 1.3rem);
    font-weight: 700;
    color: var(--accent-deep);
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
    line-height: 1.2;
    margin: 0.35rem 0 0;
}

.package-detail-main .card h4 small {
    display: block;
    font-size: 0.85rem;
    font-weight: 600;
    color: rgba(32, 110, 231, 0.92);
    opacity: 0.95;
    line-height: 1.3;
    margin-top: 0.25rem;
}

.package-detail-main .row.g-2 > .col-md-3 .card {
    min-height: 150px;
    border-radius: 1.25rem;
    border: 1px solid rgba(20, 58, 94, 0.06);
    background: white;
    transition: all 0.3s ease;
}
.package-detail-main .row.g-2 > .col-md-3 .card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(20, 58, 94, 0.12);
    border-color: rgba(192, 154, 68, 0.3);
}

.package-detail-main .row.g-2 > .col-md-3 .card-body {
    padding: 1.5rem 1.25rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0.5rem;
    min-height: 150px;
}

.package-detail-main .row.g-2 > .col-md-3 .card-body h6 {
    font-size: 0.7rem;
    letter-spacing: 0.2em;
    margin-bottom: 0;
    color: #64748b;
    font-weight: 700;
    text-transform: uppercase;
}

.package-detail-main .row.g-2 > .col-md-3 .card-body h4 {
    font-size: clamp(1.1rem, 1.6vw, 1.25rem);
    line-height: 1.25;
    margin: 0;
    text-align: center;
    hyphens: auto;
    font-weight: 800;
}

.package-detail-main .row.g-2 > .col-md-3 .card-body h4 small {
    font-size: 0.8rem;
    color: #64748b;
    opacity: 0.85;
    margin-top: 0.3rem;
    display: block;
    font-weight: 500;
}

.package-detail-main .card h6 {
    font-size: clamp(0.75rem, 1.5vw, 0.85rem);
    letter-spacing: 0.05em;
}

.package-detail-main .card h5 {
    font-size: clamp(1rem, 2vw, 1.15rem);
}

.package-detail-main .card h2 {
    font-size: clamp(1.35rem, 3vw, 1.75rem);
    font-weight: 700;
    color: var(--accent-deep);
}

.package-detail-main .card h3,
.package-detail-main section > h2.h3 {
    font-size: clamp(1.25rem, 2.8vw, 1.55rem);
    font-weight: 800;
    color: var(--accent-deep);
    margin-bottom: 1rem;
    letter-spacing: -0.01em;
}

.package-detail-main .lead {
    font-size: clamp(0.95rem, 2vw, 1.1rem);
    line-height: 1.75;
    color: var(--muted);
    font-weight: 400;
}

.package-detail-main .alert {
    border-radius: var(--radius-sm);
    padding: clamp(1.25rem, 2.5vw, 1.75rem);
    background: rgba(45, 138, 79, 0.05);
    border: 1px solid rgba(45, 138, 79, 0.2);
}

.package-detail-main .alert h5 {
    font-size: clamp(0.95rem, 2vw, 1.1rem);
    margin-bottom: 0.75rem;
    font-weight: 700;
}

.package-detail-main .list-unstyled li {
    font-size: clamp(0.9rem, 1.5vw, 0.95rem);
    line-height: 1.7;
    color: #334155;
    padding: 0.35rem 0;
}
.package-detail-main .list-unstyled li i {
    min-width: 20px;
}

/* Package detail mobile */
@media (max-width: 767px) {
    .package-hero {
        padding: 2rem clamp(0.5rem, 2vw, 1rem);
    }

    .package-hero .col-lg-8,
    .package-hero .col-lg-4 {
        text-align: center !important;
        width: 100%;
    }

    .package-hero .col-lg-4 {
        margin-top: 1rem;
    }

    .package-hero .text-end {
        text-align: center !important;
    }

    .package-detail-main .row.g-2 {
        gap: 0.5rem !important;
    }
    
    .package-detail-main .row.g-3 {
        gap: 0.75rem !important;
    }

    .package-detail-main .col-md-3 {
        width: calc(50% - 0.375rem);
    }

    .package-detail-main .col-md-6 {
        width: 100%;
    }

    .package-detail-main .section,
    .package-detail-main section {
        margin-bottom: 2rem;
    }

    .package-detail-main .card-body {
        padding: clamp(1rem, 3vw, 1.5rem);
    }
}

@media (max-width: 479px) {
    .package-detail-main .col-md-3 {
        width: 100%;
    }

    .package-image-card {
        height: clamp(200px, 45vw, 280px);
    }
}

/* Package Detail Sidebar Improvements */
.package-detail-main .col-lg-4 .sticky-top-card {
    background: var(--surface);
    border-radius: var(--radius);
    border: 1px solid rgba(20, 58, 94, 0.1);
    box-shadow: 0 12px 40px rgba(20, 58, 94, 0.12);
    transition: box-shadow 0.3s ease;
}

.package-detail-main .col-lg-4 .sticky-top-card:hover {
    box-shadow: 0 16px 50px rgba(20, 58, 94, 0.18);
}

.package-detail-main .col-lg-4 .card-body {
    padding: clamp(1.5rem, 3vw, 2rem);
}

.package-detail-main .col-lg-4 .card-body h2 {
    font-size: clamp(1.5rem, 3vw, 1.75rem);
    font-weight: 800;
}

.package-detail-main .col-lg-4 .card-body h6 {
    font-size: clamp(0.75rem, 1.5vw, 0.85rem);
    font-weight: 700;
    letter-spacing: 0.1em;
}

.package-detail-main .col-lg-4 .btn {
    border-radius: var(--radius-sm);
    font-weight: 600;
    padding: clamp(0.65rem, 1.5vw, 0.85rem) clamp(1rem, 2vw, 1.25rem);
    font-size: clamp(0.9rem, 1.5vw, 0.95rem);
    transition: all 0.3s ease;
}

.package-detail-main .col-lg-4 .btn-success {
    background: linear-gradient(135deg, #2d8a4f, #1e6138);
    border: none;
    box-shadow: 0 8px 24px rgba(45, 138, 79, 0.25);
}

.package-detail-main .col-lg-4 .btn-success:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 32px rgba(45, 138, 79, 0.35);
}

@media (max-width: 992px) {
    .package-detail-main .col-lg-4 .sticky-top-card {
        margin-top: 2rem;
    }
}

.breadcrumb{background:transparent;padding:0;margin-bottom:0}.breadcrumb .breadcrumb-item+.breadcrumb-item::before{color:rgba(0,0,0,0.35)}

@media (max-width:992px){.sticky-top-card,.sticky-top-custom{position:static;top:auto}.filters-section{padding:1.75rem 1rem}}

@media (max-width:768px){.hero-section,.feature-section,.highlights-section,.cta-section{padding:3rem 0}.hero-section h1,.highlights-section h2,.cta-section h2{text-align:center}.package-image-card{min-height:280px}}

/* Homepage statistics motion: quiet on entry, responsive on interaction. */
.highlights-section.has-stat-motion [data-stat-card] {
    --stat-delay: 0ms;
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 520ms ease var(--stat-delay), transform 520ms ease var(--stat-delay), box-shadow 300ms ease, border-color 300ms ease, background-color 300ms ease;
}
.highlights-section.has-stat-motion [data-stat-card].is-visible {
    opacity: 1;
    transform: translateY(0);
}
.highlights-section .highlight-value {
    display: inline-block;
    min-width: 2ch;
    font-variant-numeric: tabular-nums;
}
.highlights-section .highlight-icon {
    display: inline-block;
    transition: transform 350ms ease, filter 350ms ease;
}
@media (hover: hover) and (pointer: fine) {
    .highlights-section [data-stat-card].is-visible:hover,
    .highlights-section [data-stat-card].is-visible:focus-within {
        transform: translateY(-3px);
        box-shadow: 0 14px 28px rgba(5, 21, 36, 0.18);
    }
    .highlights-section [data-stat-card].is-visible:hover .highlight-icon,
    .highlights-section [data-stat-card].is-visible:focus-within .highlight-icon {
        transform: translateY(-2px) scale(1.04);
        filter: brightness(1.08);
    }
}
@media (max-width: 576px) {
    .highlights-section [data-stat-card] {
        transform: translateY(6px);
        transition-duration: 420ms;
    }
    .highlights-section [data-stat-card].is-visible:active .highlight-icon {
        transform: scale(1.02);
    }
}
@media (prefers-reduced-motion: reduce) {
    .highlights-section [data-stat-card],
    .highlights-section .highlight-icon {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
        filter: none !important;
    }
}

/* ============================================
   BOOKING PAGES STYLES - Responsive Fixes
   ============================================ */

/* Booking Main Container */
.booking-main,.booking-detail-main,.payment-main{background:var(--bg);min-height:calc(100vh - 200px)}.booking-main .container,.booking-detail-main .container,.payment-main .container{padding:clamp(1.5rem,4vw,3rem) clamp(1rem,3vw,1.5rem);max-width:clamp(320px,95vw,1200px)}

/* Booking Header Section */
.booking-main .bg-light,.booking-detail-main .bg-light,.payment-main .bg-light{background:var(--surface-soft) !important;border-bottom:1px solid var(--line) !important;padding:clamp(1.25rem,3vw,2rem) 0 !important}.booking-main .bg-light h1,.booking-detail-main .bg-light h1,.payment-main .bg-light h1{font-size:clamp(1.5rem,4vw,2rem);font-weight:700;color:var(--accent-deep);margin:0}

/* Booking Form Card */
.booking-main .card,.booking-detail-main .card,.payment-main .card{border-radius:var(--radius);border:1px solid rgba(20,58,94,0.08);box-shadow:var(--shadow-sm);background:var(--surface)}.booking-main .card-header,.booking-detail-main .card-header,.payment-main .card-header{background:var(--surface-soft) !important;border-bottom:1px solid var(--line) !important;padding:clamp(1rem,2.5vw,1.5rem) !important}.booking-main .card-header h3,.booking-detail-main .card-header h5,.payment-main .card-header h3{color:var(--accent-deep);font-size:clamp(1.1rem,2.5vw,1.35rem);font-weight:700;margin:0}.booking-main .card-body,.booking-detail-main .card-body,.payment-main .card-body{padding:clamp(1.25rem,3vw,2rem) !important}

/* Booking Form Elements */
.booking-main .form-label,.payment-main .form-label{font-weight:600;color:var(--accent-deep);font-size:clamp(0.9rem,1.5vw,1rem);margin-bottom:0.5rem;display:block}.booking-main .form-control,.payment-main .form-control{border:1px solid #d7dbe2;border-radius:var(--radius-sm);padding:clamp(0.7rem,1.5vw,0.9rem) clamp(0.75rem,1.5vw,1rem);font-size:clamp(0.9rem,1.5vw,1rem);min-height:var(--touch-target);transition:border-color var(--transition),box-shadow var(--transition)}.booking-main .form-control:focus,.payment-main .form-control:focus{border-color:var(--primary);box-shadow:0 0 0 0.15rem rgba(192,154,68,0.18);outline:none}.booking-main .form-control-lg,.payment-main .form-control-lg{padding:clamp(0.8rem,2vw,1rem) clamp(0.85rem,2vw,1.1rem);font-size:clamp(0.95rem,1.5vw,1.05rem)}.booking-main textarea.form-control,.payment-main textarea.form-control{min-height:clamp(80px,15vw,120px);resize:vertical}

/* Booking Section Headers */
.booking-main section h5,.payment-main section h5{font-size:clamp(1rem,2.5vw,1.2rem);font-weight:700;color:var(--accent-deep);margin-bottom:clamp(1rem,2.5vw,1.5rem);display:flex;align-items:center;gap:0.5rem}.booking-main section hr,.payment-main section hr{border-top:1px solid var(--line);margin:clamp(1.5rem,3vw,2rem) 0}

/* Booking Sidebar Cards */
.booking-main .sticky-top-card,.booking-detail-main .sticky-top-card{position:sticky;top:1.5rem;z-index:100}.booking-main .col-lg-4 .card,.booking-detail-main .col-lg-4 .card{border-radius:var(--radius);box-shadow:var(--shadow-sm)}.booking-main .col-lg-4 .card-header,.booking-detail-main .col-lg-4 .card-header{background:var(--surface-soft) !important;border-bottom:1px solid var(--line) !important;padding:clamp(0.85rem,2vw,1.25rem) !important}.booking-main .col-lg-4 .card-header h5,.booking-detail-main .col-lg-4 .card-header h5{font-size:clamp(0.95rem,2vw,1.1rem);font-weight:700;color:var(--accent-deep);margin:0}.booking-main .col-lg-4 .card-body,.booking-detail-main .col-lg-4 .card-body{padding:clamp(1rem,2.5vw,1.5rem) !important}

/* Booking Summary Sidebar */
.booking-summary-card{background:var(--surface);border-radius:var(--radius);border:1px solid rgba(20,58,94,0.08);box-shadow:var(--shadow-sm)}.booking-summary-card .quick-facts{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(0.5rem,1.5vw,0.75rem)}.booking-summary-card .quick-facts-item{background:var(--surface-soft);padding:clamp(0.5rem,1.5vw,0.75rem);border-radius:var(--radius-sm);text-align:center}.booking-summary-card .quick-facts-item .label{font-size:clamp(0.7rem,1.2vw,0.8rem);color:var(--muted);display:block}.booking-summary-card .quick-facts-item .value{font-size:clamp(0.85rem,1.5vw,1rem);font-weight:700;color:var(--accent-deep)}

/* Booking Price Display */
.booking-price{font-size:clamp(1.5rem,4vw,2rem);font-weight:800;color:var(--primary)}.booking-price-small{font-size:clamp(1.1rem,2.5vw,1.4rem);font-weight:700;color:var(--primary)}.booking-deposit{font-size:clamp(1rem,2vw,1.2rem);font-weight:700;color:var(--warning)}

/* Booking Badges */
.booking-main .badge,.booking-detail-main .badge,.payment-main .badge{padding:clamp(0.35rem,1vw,0.5rem) clamp(0.6rem,1.5vw,0.85rem);font-size:clamp(0.75rem,1.2vw,0.85rem);font-weight:600;border-radius:6px}

/* Booking Action Buttons */
.booking-main .btn-lg,.booking-detail-main .btn-lg,.payment-main .btn-lg{padding:clamp(0.75rem,2vw,1rem) clamp(1.25rem,3vw,1.75rem);font-size:clamp(0.95rem,1.5vw,1.1rem);min-height:var(--touch-target)}.booking-main .btn-group,.booking-detail-main .btn-group{display:flex;flex-wrap:wrap;gap:0.5rem}.booking-main .btn-group .btn,.booking-detail-main .btn-group .btn{flex:1 1 auto;min-width:clamp(70px,15vw,100px)}

/* Booking Status Cards */
.status-card{background:var(--surface);border-radius:var(--radius);padding:clamp(1rem,2.5vw,1.5rem);margin-bottom:clamp(1rem,2.5vw,1.5rem)}.status-card .status-item{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:0.5rem}.status-card .status-label{font-size:clamp(0.8rem,1.5vw,0.9rem);color:var(--muted);text-transform:uppercase;letter-spacing:0.5px}.status-card .status-value{font-weight:600}

/* Booking Detail Page Specific */
.booking-detail-main .card-body .row{gap:clamp(1rem,2.5vw,1.5rem) !important}.booking-detail-main .card-body .col-md-6{padding:0}.booking-detail-main h6.text-uppercase{font-size:clamp(0.7rem,1.2vw,0.8rem);letter-spacing:0.5px;margin-bottom:0.25rem}.booking-detail-main .h5,.booking-detail-main .h4{font-size:clamp(1rem,2.5vw,1.25rem);font-weight:700}

/* Booking Table in Detail Page */
.booking-detail-main .table{font-size:clamp(0.85rem,1.5vw,0.95rem);margin:0}.booking-detail-main .table td{padding:clamp(0.5rem,1.5vw,0.75rem) 0;vertical-align:middle}.booking-detail-main .table .text-end{text-align:right !important}

/* Booking Sidebar Summary */
.booking-sidebar{position:sticky;top:1.5rem}.booking-sidebar .summary-row{display:flex;justify-content:space-between;padding:clamp(0.5rem,1.5vw,0.75rem) 0;border-bottom:1px solid var(--line)}.booking-sidebar .summary-row:last-child{border-bottom:none}.booking-sidebar .summary-label{color:var(--muted);font-size:clamp(0.85rem,1.5vw,0.95rem)}.booking-sidebar .summary-value{font-weight:600;color:var(--ink);font-size:clamp(0.85rem,1.5vw,0.95rem)}.booking-sidebar .summary-total{font-size:clamp(1.1rem,2.5vw,1.35rem);font-weight:800;color:var(--primary)}

/* Payment Page Styles */
.payment-main .payment-summary{background:var(--surface-soft);border-radius:var(--radius-sm);padding:clamp(1rem,2.5vw,1.5rem);margin-bottom:clamp(1.5rem,3vw,2rem)}.payment-main .payment-option{border:2px solid var(--line);border-radius:var(--radius-sm);padding:clamp(1rem,2.5vw,1.5rem);margin-bottom:clamp(0.75rem,1.5vw,1rem);cursor:pointer;transition:all var(--transition)}.payment-main .payment-option:hover{border-color:var(--primary);background:rgba(192,154,68,0.05)}.payment-main .payment-option.selected{border-color:var(--primary);background:rgba(192,154,68,0.1)}.payment-main .form-check-input{width:1.25rem;height:1.25rem;margin-top:0.1rem}.payment-main .form-check-label{cursor:pointer}

/* Manage Bookings Page */
.manage-bookings-main{background:var(--bg);min-height:calc(100vh - 200px);padding:clamp(1.5rem,4vw,3rem) 0}.manage-bookings-main .card{border-radius:var(--radius);border:none;box-shadow:var(--shadow-sm)}.manage-bookings-main .card-header{background:var(--surface-soft) !important;border-bottom:1px solid var(--line) !important;padding:clamp(1rem,2.5vw,1.5rem) !important}.manage-bookings-main .card-header h3{font-size:clamp(1.1rem,2.5vw,1.35rem);font-weight:700;color:var(--accent-deep);margin:0}.manage-bookings-main .card-body{padding:clamp(1rem,2.5vw,1.5rem) !important}

/* Manage Bookings Filters */
.manage-bookings-main .filters-row{display:flex;flex-wrap:wrap;gap:clamp(0.5rem,1.5vw,1rem);margin-bottom:clamp(1rem,2.5vw,1.5rem)}.manage-bookings-main .form-select{min-height:var(--touch-target);padding:clamp(0.5rem,1.5vw,0.75rem) clamp(0.75rem,1.5vw,1rem);font-size:clamp(0.85rem,1.5vw,0.95rem);border-radius:var(--radius-sm);border:1px solid var(--line)}.manage-bookings-main .btn-group{flex-wrap:wrap}.manage-bookings-main .btn-sm{padding:clamp(0.4rem,1vw,0.5rem) clamp(0.6rem,1.5vw,0.75rem);font-size:clamp(0.75rem,1.2vw,0.85rem);min-height:auto}

/* Manage Bookings Table */
.manage-bookings-main .table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch}.manage-bookings-main .table{font-size:clamp(0.8rem,1.5vw,0.9rem);min-width:800px}.manage-bookings-main .table th{background:var(--surface-soft);font-weight:600;color:var(--accent-deep);padding:clamp(0.75rem,1.5vw,1rem) !important;white-space:nowrap}.manage-bookings-main .table td{padding:clamp(0.6rem,1.5vw,0.85rem) !important;vertical-align:middle}.manage-bookings-main .table .btn-group{display:flex;gap:0.25rem}

/* Worker Bookings Page */
.worker-bookings-main{background:var(--bg);min-height:calc(100vh - 200px);padding:clamp(1.5rem,4vw,3rem) 0}.worker-bookings-main .booking-card{background:var(--surface);border-radius:var(--radius);border:1px solid rgba(20,58,94,0.08);margin-bottom:clamp(1rem,2.5vw,1.5rem);overflow:hidden}.worker-bookings-main .booking-card-header{background:var(--surface-soft);padding:clamp(0.85rem,2vw,1.25rem);border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:0.5rem}.worker-bookings-main .booking-card-body{padding:clamp(1rem,2.5vw,1.5rem)}.worker-bookings-main .booking-info{display:grid;grid-template-columns:repeat(auto-fit,minmax(clamp(120px,25vw,180px),1fr));gap:clamp(0.75rem,2vw,1rem)}.worker-bookings-main .booking-info-item{background:var(--surface-soft);padding:clamp(0.5rem,1.5vw,0.75rem);border-radius:var(--radius-sm)}.worker-bookings-main .booking-info-item .label{font-size:clamp(0.7rem,1.2vw,0.8rem);color:var(--muted);display:block}.worker-bookings-main .booking-info-item .value{font-size:clamp(0.85rem,1.5vw,1rem);font-weight:600;color:var(--accent-deep)}

/* ============================================
   RESPONSIVE BREAKPOINTS FOR BOOKING PAGES
   ============================================ */
@media (max-width:991px){
    .booking-main .col-lg-4,.booking-detail-main .col-lg-4,.payment-main .col-lg-4{margin-top:clamp(1.5rem,3vw,2rem)}
    .booking-main .sticky-top-card,.booking-detail-main .sticky-top-card,.booking-sidebar{position:static;top:auto}
    .manage-bookings-main .btn-group{width:100%;justify-content:flex-start}
}

@media (max-width:767px){
    .booking-main .container,.booking-detail-main .container,.payment-main .container{padding:clamp(1rem,3vw,1.5rem) clamp(0.75rem,2vw,1rem)}
    .booking-main .card-body,.booking-detail-main .card-body,.payment-main .card-body{padding:clamp(1rem,2.5vw,1.25rem) !important}
    .booking-main .row.g-4,.booking-detail-main .row.g-4{--bs-gutter-x:1rem;--bs-gutter-y:1rem}
    .booking-main .col-lg-8,.booking-detail-main .col-lg-8{width:100%}
    .booking-main .btn-group .btn,.booking-detail-main .btn-group .btn{flex:1 1 45%}
    .status-card .status-item{flex-direction:column;align-items:flex-start;gap:0.25rem}
    .manage-bookings-main .filters-row{flex-direction:column}
    .manage-bookings-main .filters-row .form-select,.manage-bookings-main .filters-row .btn-group{width:100%}
}

@media (max-width:575px){
    .booking-main h1,.booking-detail-main h1{font-size:clamp(1.25rem,4vw,1.5rem)}
    .booking-main section h5,.payment-main section h5{font-size:clamp(0.95rem,2.5vw,1.1rem)}
    .booking-main .form-label,.payment-main .form-label{font-size:clamp(0.85rem,1.5vw,0.95rem)}
    .booking-main .btn-lg,.booking-detail-main .btn-lg{width:100%;margin-bottom:0.5rem}
    .booking-main .row.g-3,.payment-main .row.g-3{--bs-gutter-x:0.75rem;--bs-gutter-y:0.75rem}
    .booking-summary-card .quick-facts{grid-template-columns:1fr}
    .booking-detail-main .table{font-size:0.8rem}
    .worker-bookings-main .booking-info{grid-template-columns:1fr}
}

@media (max-width:374px){
    .booking-main .container,.booking-detail-main .container,.payment-main .container{padding:0.75rem}
    .booking-main .card,.booking-detail-main .card,.payment-main .card{border-radius:12px}
    .booking-main .badge,.booking-detail-main .badge,.payment-main .badge{padding:0.25rem 0.5rem;font-size:0.7rem}
}

/* Final responsive layer: keeps the existing Bootstrap structure usable on narrow screens. */
:root {
    --page-gutter: clamp(0.9rem, 4vw, 2rem);
    --section-space: clamp(3rem, 8vw, 7rem);
}

html,
body {
    max-width: 100%;
}

body {
    font-size: clamp(0.9375rem, 1.6vw, 1rem);
}

.site-main > *:first-child {
    margin-top: 0;
}

.container,
.container-fluid.container-lg {
    width: 100%;
    max-width: 1180px;
    padding-right: var(--page-gutter);
    padding-left: var(--page-gutter);
}

.row > *,
.card,
.package-card,
.feature-card,
.highlight-card {
    min-width: 0;
}

.narropil-nav {
    padding: 0.75rem 0;
}

.narropil-nav .container {
    align-items: center;
}

.narropil-nav .navbar-brand {
    min-width: 0;
    max-width: calc(100% - 4.5rem);
    font-size: clamp(0.82rem, 3.5vw, 1rem);
}

.narropil-nav .navbar-brand img {
    flex: 0 0 auto;
    width: clamp(29px, 8vw, 34px);
    height: clamp(29px, 8vw, 34px);
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: 50%;
    background: #fff;
    padding: 2px;
}

.narropil-nav .navbar-brand span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.narropil-nav .navbar-collapse {
    min-width: 0;
}

.narropil-nav .navbar-nav {
    min-width: 0;
}

.narropil-nav .nav-book-button {
    width: 100%;
    white-space: normal;
}

.home-hero {
    min-height: clamp(570px, calc(100svh - 60px), 720px);
    padding-bottom: clamp(4.5rem, 10vw, 5rem);
}

.home-hero .container {
    align-items: center;
}

.home-hero .container > .row {
    width: 100%;
    min-height: 0;
    align-items: center !important;
    padding-block: clamp(4.5rem, 12vw, 7rem) 3rem;
}

.home-hero h1 {
    max-width: 12ch;
    font-size: clamp(2.35rem, 9vw, 6.25rem);
    line-height: 1.02;
    overflow-wrap: anywhere;
}

.home-hero .hero-copy {
    max-width: 36rem;
    font-size: clamp(0.98rem, 2vw, 1.2rem);
}

.hero-actions {
    align-items: stretch;
}

.hero-actions .btn {
    min-width: 0;
    max-width: 100%;
}

.home-hero-controls {
    bottom: 1.25rem;
    right: var(--page-gutter);
}

.feature-section,
.highlights-section,
.packages-section,
.cta-section,
.packages-grid-section {
    padding-top: var(--section-space) !important;
    padding-bottom: var(--section-space) !important;
}

.home-intro h2,
.highlights-section h2,
.cta-section h2,
.packages-section .section-title {
    font-size: clamp(1.9rem, 7vw, 3.5rem);
    line-height: 1.08;
}

.section-lead,
.feature-card p,
.highlight-card p,
.cta-section p {
    font-size: clamp(0.95rem, 1.8vw, 1.1rem);
    line-height: 1.65;
}

.feature-card,
.highlight-card {
    padding: clamp(1.25rem, 4vw, 1.75rem);
}

.package-image,
.package-image-container {
    height: clamp(180px, 52vw, 250px);
}

.package-image-container .badge-overlay {
    top: clamp(0.65rem, 2vw, 1rem);
    left: clamp(0.65rem, 2vw, 1rem);
    max-width: calc(100% - 1.3rem);
}

.package-image-container .badge-overlay .badge {
    max-width: 100%;
    overflow-wrap: anywhere;
}

.package-content {
    padding: clamp(1.1rem, 4vw, 1.5rem) !important;
}

.package-name,
.package-card .card-title {
    overflow-wrap: anywhere;
    line-height: 1.25;
}

.package-description,
.package-summary,
.package-meta-grid .meta-item,
.package-card .text-muted {
    overflow-wrap: anywhere;
}

.package-meta-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.packages-hero {
    padding-top: clamp(2.75rem, 9vw, 7rem) !important;
    padding-bottom: clamp(2.75rem, 9vw, 7rem) !important;
}

.packages-hero h1,
.package-hero h1 {
    font-size: clamp(2.1rem, 8vw, 5rem);
    line-height: 1.05;
    overflow-wrap: anywhere;
}

.packages-hero p.lead,
.package-hero p.lead {
    font-size: clamp(0.98rem, 2vw, 1.25rem);
    line-height: 1.6;
}

.filters-section {
    padding: clamp(2rem, 6vw, 3rem) 0 !important;
}

.filters-section h2 {
    font-size: clamp(1.4rem, 5vw, 2rem);
    line-height: 1.2;
}

.filters-section .form-label {
    font-size: clamp(0.9rem, 1.8vw, 1.05rem);
    line-height: 1.35;
}

.filters-section .btn-outline-light,
.filters-section .form-select,
.filters-section .package-search-input {
    min-width: 0;
    width: 100%;
    font-size: clamp(0.86rem, 1.8vw, 1rem);
}

.filters-section .btn-outline-light {
    white-space: normal;
    text-align: left;
}

.package-detail-main .package-hero {
    padding-top: clamp(2.5rem, 7vw, 5rem) !important;
    padding-bottom: clamp(2.5rem, 7vw, 5rem) !important;
}

.package-image-card {
    aspect-ratio: 16 / 10;
    background: var(--surface-soft);
    min-height: 0;
}

.package-image-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.package-detail-main .card-body,
.booking-main .card-body,
.booking-detail-main .card-body,
.payment-main .card-body {
    overflow-wrap: anywhere;
}

.package-detail-main .card-title,
.package-detail-main h2,
.package-detail-main h3,
.booking-main h1,
.booking-main h3,
.booking-detail-main h1,
.payment-main h1 {
    overflow-wrap: anywhere;
}

.package-detail-main .sticky-top-card {
    min-width: 0;
}

.booking-main,
.booking-detail-main,
.payment-main {
    padding-top: clamp(1.25rem, 4vw, 2.5rem);
    padding-bottom: clamp(2rem, 6vw, 4rem);
}

.booking-main input,
.booking-main select,
.booking-main textarea,
.payment-main input,
.payment-main select,
.payment-main textarea {
    max-width: 100%;
}

.quick-facts-item .value,
.booking-summary-card,
.payment-summary-box,
.booking-main .form-check-label {
    overflow-wrap: anywhere;
}

.booking-table {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.footer {
    padding-top: clamp(2.25rem, 5vw, 3rem);
    padding-bottom: 1rem;
}

.footer h4 {
    font-size: clamp(0.98rem, 2vw, 1.1rem);
}

.footer p,
.footer a,
.footer-bottom {
    font-size: clamp(0.82rem, 1.6vw, 0.9rem);
    line-height: 1.45;
}

.footer .row {
    --bs-gutter-y: 1.25rem;
}

.footer h4 {
    margin-bottom: 0.65rem;
}

.footer li {
    margin-bottom: 0.3rem;
}

.footer-bottom {
    padding-top: 0.9rem;
    margin-top: 1.25rem;
}

.footer-content-panel {
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.03);
}

.footer-content-panel > .row > [class*="col-"] {
    min-width: 0;
    padding: 1.25rem 1.35rem;
    border-right: 1px solid rgba(255, 255, 255, 0.14);
}

.footer-content-panel > .row > [class*="col-"]:last-child {
    border-right: 0;
}

.footer-content-panel .footer-kicker,
.footer-content-panel h4 {
    margin-top: 0;
}

@media (max-width: 767.98px) {
    .footer-content-panel > .row {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .footer-content-panel > .row > [class*="col-"] {
        width: 100%;
        padding: 1rem;
        border-right: 1px solid rgba(255, 255, 255, 0.14);
        border-bottom: 1px solid rgba(255, 255, 255, 0.14);
    }

    .footer-content-panel > .row > [class*="col-"]:nth-child(even) {
        border-right: 0;
    }

    .footer-content-panel > .row > [class*="col-"]:last-child {
        border-bottom: 0;
    }

    .footer-content-panel > .row > .col-md-4:first-child {
        grid-column: 1 / -1;
        padding: 0.9rem 1rem;
    }

    .footer-content-panel > .row > .col-md-4:first-child .footer-kicker {
        margin-bottom: 0.35rem;
        font-size: 0.65rem;
    }

    .footer-content-panel > .row > .col-md-4:first-child h4 {
        margin-bottom: 0.35rem;
        font-size: 0.95rem;
        line-height: 1.25;
    }

    .footer-content-panel > .row > .col-md-4:first-child p:last-child {
        margin-bottom: 0;
        font-size: 0.78rem;
        line-height: 1.4;
    }

    .packages-section .package-image,
    .packages-grid-section .package-image-container,
    .recommended-package-card .package-image-container {
        height: clamp(145px, 36vw, 180px);
    }

    .packages-section .package-content,
    .packages-grid-section .package-content,
    .recommended-package-card .package-content {
        padding: 0.85rem !important;
    }

    .packages-section .package-description,
    .packages-grid-section .package-description,
    .recommended-package-card .package-description {
        margin: 0.45rem 0;
        line-height: 1.45;
    }

    .packages-section .package-meta,
    .packages-grid-section .package-meta,
    .recommended-package-card .package-meta {
        gap: 0.45rem;
        margin-top: 0.65rem;
    }

    .packages-section .package-description,
    .packages-grid-section .package-description,
    .recommended-package-card .package-description {
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        line-clamp: 2;
    }
}

.inclusions-grid .inclusion-card {
    height: 100%;
}

.inclusions-grid .card-body {
    padding: 1.25rem;
}

.inclusions-grid .card-title {
    font-size: 1rem;
    line-height: 1.3;
}

.inclusions-grid li {
    font-size: 0.86rem;
    line-height: 1.4;
}

@media (max-width: 767.98px) {
    .inclusions-grid {
        --bs-gutter-x: 0.75rem;
        --bs-gutter-y: 0.75rem;
    }

    .inclusions-grid .card-body {
        padding: 0.9rem;
    }

    .inclusions-grid .card-title {
        margin-bottom: 0.75rem !important;
        font-size: 0.84rem;
    }

    .inclusions-grid li {
        margin-bottom: 0.4rem !important;
        font-size: 0.75rem;
        line-height: 1.3;
    }
}

@media (max-width: 767.98px) {
    .narropil-nav .navbar-collapse {
        margin-right: 0;
        margin-left: 0;
        padding-right: 0;
        padding-left: 0;
    }

    .narropil-nav .navbar-nav {
        align-items: stretch !important;
    }

    .narropil-nav .nav-link {
        padding-block: 0.7rem;
    }

    .home-hero .hero-actions,
    .cta-section .btn {
        width: 100%;
    }

    .hero-actions .btn {
        width: min(100%, 20rem);
    }

    .home-hero-controls {
        left: var(--page-gutter);
        justify-content: space-between;
    }

    .package-detail-main .col-lg-4,
    .booking-main .col-lg-4,
    .booking-detail-main .col-lg-4,
    .payment-main .col-lg-4 {
        width: 100%;
    }

    .package-detail-main .row.g-2 > [class*="col-"] {
        width: 50%;
    }

    .package-detail-main .card-body {
        padding: clamp(0.85rem, 3vw, 1.25rem);
    }

    .package-detail-main .card-body h4 {
        font-size: clamp(1rem, 4vw, 1.35rem);
    }

    .booking-main .row.g-3 > [class*="col-md-6"],
    .booking-main .row.g-3 > [class*="col-lg-"],
    .booking-detail-main .row.g-3 > [class*="col-md-6"] {
        width: 100%;
    }

    .booking-main .btn-lg,
    .booking-detail-main .btn-lg,
    .payment-main .btn-lg {
        width: 100%;
        white-space: normal;
    }

    .footer .row > [class*="col-"] {
        margin-bottom: 1.75rem;
    }

    .footer .row > [class*="col-"]:last-child {
        margin-bottom: 0;
    }
}

/* Compact layout pass: keep the existing hierarchy while removing excess air. */
body {
    line-height: 1.55;
}

.feature-section,
.highlights-section,
.packages-section,
.cta-section,
.packages-grid-section {
    padding-top: clamp(2.5rem, 5vw, 3.5rem) !important;
    padding-bottom: clamp(2.5rem, 5vw, 3.5rem) !important;
}

.home-intro {
    padding-top: clamp(2.75rem, 5vw, 4rem) !important;
    padding-bottom: clamp(2.75rem, 5vw, 4rem) !important;
}

.section-heading {
    margin-bottom: 2rem !important;
}

.feature-card {
    padding: 1.25rem 1.35rem;
}

.feature-card .feature-number {
    margin-bottom: 1.5rem;
}

.feature-card h3,
.highlight-card h4 {
    margin-bottom: 0.6rem;
}

.feature-card p,
.highlight-card p,
.cta-section p {
    line-height: 1.5;
}

.highlights-section .highlight-card {
    padding: 1rem 0;
}

.highlights-section .highlight-icon {
    margin-bottom: 0.75rem;
}

.packages-section .section-title {
    margin-bottom: 1.5rem;
}

.packages-section .text-center.mt-5 {
    margin-top: 2rem !important;
}

.package-card .package-content {
    padding: 1.15rem !important;
}

.package-card .package-description {
    line-height: 1.45;
    margin: 0.5rem 0;
}

@media (max-width: 767.98px) {
    .feature-section,
    .highlights-section,
    .packages-section,
    .cta-section,
    .packages-grid-section {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }

    .home-intro {
        padding-top: 2.5rem !important;
        padding-bottom: 2.5rem !important;
    }

    .section-heading {
        margin-bottom: 1.5rem !important;
    }

    .feature-card {
        padding: 1rem 1.1rem;
    }

    .feature-card .feature-number {
        margin-bottom: 1.1rem;
    }

    .package-card .package-content {
        padding: 0.95rem !important;
    }
}

/* Keep the search icon clear of the destination placeholder and entered text. */
.filters-section .package-search-input {
    padding-left: 3rem !important;
    padding-right: 1rem !important;
}

@media (max-width: 479.98px) {
    .container,
    .container-fluid.container-lg {
        padding-right: 0.9rem;
        padding-left: 0.9rem;
    }

    .home-hero {
        min-height: 610px;
    }

    .home-hero .container > .row {
        padding-top: 4rem;
    }

    .home-hero h1 {
        max-width: 11ch;
    }

    .package-meta-grid {
        grid-template-columns: 1fr;
    }

    .package-image-container .badge-overlay .badge {
        font-size: 0.67rem;
        padding: 0.38rem 0.55rem;
    }

    .filters-section .filter-stats .badge {
        max-width: 100%;
        white-space: normal;
    }

    .package-detail-main .row.g-2 > [class*="col-"] {
        width: 100%;
    }
}

@media (min-width: 768px) {
    .narropil-nav .nav-book-button {
        width: auto;
    }

    .home-hero .container > .row {
        min-height: min(75vh, 620px);
    }
}

/* Mobile refinement: Bootstrap owns navbar state; this layer only controls sizing. */
@media (max-width: 991.98px) {
    .narropil-nav .navbar-collapse {
        animation: none;
        max-height: none;
        overflow: hidden;
        transition: height 0.25s ease, opacity 0.25s ease;
    }

    .narropil-nav .navbar-collapse.show {
        overflow: visible;
    }

    .narropil-nav .navbar-toggler:focus-visible {
        outline: 3px solid rgba(255, 255, 255, 0.85);
        outline-offset: 3px;
    }
}

@media (max-width: 767.98px) {
    :root {
        --section-space: clamp(2.5rem, 7vw, 4.5rem);
    }

    body {
        font-size: clamp(0.9rem, 1.8vw, 0.96rem);
        line-height: 1.55;
    }

    .home-hero h1,
    .packages-hero h1,
    .package-hero h1 {
        font-size: clamp(2rem, 8.5vw, 3.4rem);
        line-height: 1.05;
    }

    .home-hero .hero-copy,
    .packages-hero p.lead,
    .package-hero p.lead {
        font-size: clamp(0.9rem, 2.2vw, 1rem);
        line-height: 1.5;
    }

    .home-intro h2,
    .highlights-section h2,
    .cta-section h2,
    .packages-section .section-title {
        font-size: clamp(1.65rem, 6.5vw, 2.5rem);
    }

    .feature-card,
    .highlight-card {
        padding: clamp(1rem, 3.5vw, 1.35rem);
    }

    .feature-card .feature-number {
        margin-bottom: 1.75rem;
    }

    .feature-card h3,
    .highlight-card h4 {
        font-size: clamp(1rem, 4.5vw, 1.35rem);
    }

    .feature-card p,
    .highlight-card p,
    .cta-section p {
        font-size: clamp(0.86rem, 1.8vw, 0.96rem);
    }

    .package-image,
    .package-image-container {
        height: clamp(155px, 45vw, 210px);
    }

    .package-content,
    .package-card .package-content {
        padding: clamp(0.9rem, 3.5vw, 1.2rem) !important;
    }

    .package-name,
    .package-card .card-title {
        font-size: clamp(1rem, 4.5vw, 1.18rem);
    }

    .package-description,
    .package-summary {
        font-size: clamp(0.82rem, 1.8vw, 0.9rem);
        line-height: 1.45;
    }

    .package-card .btn,
    .package-actions .btn {
        font-size: clamp(0.82rem, 1.8vw, 0.9rem);
        padding: 0.55rem 0.75rem;
    }

    .card-body,
    .form-container {
        padding: clamp(0.9rem, 3.5vw, 1.25rem);
    }

    .footer {
        padding-bottom: 1.25rem;
    }
}

@media (max-width: 479.98px) {
    .home-hero {
        min-height: 540px;
    }

    .home-hero .container > .row {
        padding-top: 3.25rem;
        padding-bottom: 2.5rem;
    }

    .home-hero h1 {
        max-width: 12ch;
    }

    .hero-actions .btn {
        width: 100%;
    }

    .packages-hero,
    .package-detail-main .package-hero {
        padding-top: 2.25rem !important;
        padding-bottom: 2.25rem !important;
    }

    .filters-section {
        padding-top: 1.75rem !important;
        padding-bottom: 1.75rem !important;
    }

    .filters-section h2 {
        font-size: clamp(1.25rem, 5.5vw, 1.7rem);
    }

    .package-image,
    .package-image-container {
        height: clamp(145px, 43vw, 180px);
    }

    .package-meta-grid {
        gap: 0.35rem;
        margin-bottom: 1.25rem !important;
    }

    .booking-main .card-header,
    .booking-detail-main .card-header,
    .payment-main .card-header {
        padding: 0.9rem 1rem !important;
    }

    .booking-main section,
    .booking-detail-main section {
        margin-bottom: 2rem !important;
    }
}

.whatsapp-float {
    position: fixed;
    right: max(1rem, env(safe-area-inset-right));
    bottom: max(1rem, env(safe-area-inset-bottom));
    z-index: 1050;
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    min-height: 3.25rem;
    max-width: calc(100vw - 2rem);
    padding: 0.75rem 1.05rem;
    border: 2px solid rgba(255, 255, 255, 0.9);
    border-radius: 999px;
    background: #19b957;
    box-shadow: 0 0.75rem 1.75rem rgba(8, 91, 46, 0.3), 0 0 0 0.3rem rgba(25, 185, 87, 0.16);
    color: #fff;
    font-size: clamp(0.82rem, 1.8vw, 0.95rem);
    font-weight: 800;
    line-height: 1.2;
    text-decoration: none;
    transform-origin: 20% 80%;
    animation: whatsapp-shake 4.5s ease-in-out infinite;
    transition: background-color var(--transition), box-shadow var(--transition), transform var(--transition);
}

.whatsapp-float i {
    flex: 0 0 auto;
    font-size: 1.55rem;
}

.whatsapp-float:hover,
.whatsapp-float:focus-visible {
    background: #0d9f48;
    box-shadow: 0 0.9rem 2rem rgba(8, 91, 46, 0.38), 0 0 0 0.35rem rgba(25, 185, 87, 0.22);
    color: #fff;
    transform: translateY(-0.2rem) scale(1.03);
}

.whatsapp-float:focus-visible {
    outline: 3px solid #fff;
    outline-offset: 3px;
}

@keyframes whatsapp-shake {
    0%, 70%, 100% { transform: rotate(0deg) translateX(0); }
    72% { transform: rotate(-10deg) translateX(-1px); }
    74% { transform: rotate(10deg) translateX(1px); }
    76% { transform: rotate(-8deg) translateX(-2px); }
    78% { transform: rotate(8deg) translateX(2px); }
    80% { transform: rotate(-5deg) translateX(-1px); }
    82% { transform: rotate(5deg) translateX(1px); }
    84% { transform: rotate(0deg) translateX(0); }
}

@media (max-width: 479.98px) {
    .whatsapp-float {
        right: max(0.75rem, env(safe-area-inset-right));
        bottom: max(0.75rem, env(safe-area-inset-bottom));
        min-height: 3rem;
        padding: 0.65rem 0.85rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .whatsapp-float {
        animation: none;
        transition: none;
    }
}

/* Action feedback: lift on hover, press on activation, and never move layout. */
@media (hover: hover) and (pointer: fine) {
    .btn:not(:disabled):not(.disabled):hover {
        transform: translateY(-2px);
    }
}

.btn:not(:disabled):not(.disabled):active {
    transform: translateY(1px) scale(0.98);
}

.cta-section .btn:not(:disabled):not(.disabled) {
    animation: cta-action-nudge 4.2s ease-in-out infinite;
}

.cta-section .btn:not(:disabled):not(.disabled):hover,
.cta-section .btn:not(:disabled):not(.disabled):focus-visible,
.cta-section .btn:not(:disabled):not(.disabled):active {
    animation-play-state: paused;
}

@keyframes cta-action-nudge {
    0%, 82%, 100% { transform: translateY(0); }
    84% { transform: translateY(-3px) rotate(-1deg); }
    86% { transform: translateY(0) rotate(1deg); }
    88% { transform: translateY(-2px) rotate(0); }
}

.btn:focus-visible {
    position: relative;
    z-index: 1;
}

@media (max-width: 767.98px) {
    .whatsapp-float {
        right: max(0.9rem, env(safe-area-inset-right));
        bottom: max(0.9rem, env(safe-area-inset-bottom));
        min-height: 3rem;
        padding: 0.65rem 0.9rem;
        border-radius: 999px;
        clip-path: none;
        width: auto;
        height: auto;
        min-width: 0;
        max-width: calc(100vw - 2rem);
        justify-content: center;
        box-shadow: 0 0.7rem 1.5rem rgba(8, 91, 46, 0.28), 0 0 0 0.28rem rgba(25, 185, 87, 0.14);
        animation: whatsapp-shake 4.5s ease-in-out infinite;
    }

    .whatsapp-float i {
        font-size: 1.45rem;
    }

    .whatsapp-float span {
        display: inline;
    }

    .whatsapp-float:active {
        animation-play-state: paused;
        transform: scale(0.98);
    }
}

@media (min-width: 768px) {
    .whatsapp-float {
        width: auto;
        height: auto;
        min-width: 0;
        min-height: 3.25rem;
        padding: 0.75rem 1.05rem;
        border-radius: 999px;
        clip-path: none;
        animation: whatsapp-shake 4.5s ease-in-out infinite;
    }
}

@media (prefers-reduced-motion: reduce) {
    .btn:not(:disabled):not(.disabled),
    .whatsapp-float,
    .cta-section .btn:not(:disabled):not(.disabled) {
        animation: none;
        transition: none;
    }
}

/* Use one clear WhatsApp pill on every viewport. */
.whatsapp-float {
    width: auto;
    height: auto;
    min-width: 0;
    min-height: 3.25rem;
    padding: 0.75rem 1.05rem;
    border-radius: 999px;
    clip-path: none;
    animation: whatsapp-shake 4.5s ease-in-out infinite;
}

@media (max-width: 767.98px) {
    .whatsapp-float {
        width: auto;
        height: auto;
        min-width: 3.25rem;
        min-height: 3.25rem;
        padding: 0.65rem 0.9rem;
        border-radius: 999px;
    }

    .whatsapp-float span {
        display: inline;
    }
}

/* Compact mobile surfaces: preserve touch targets while reducing wasted vertical space. */
@media (max-width: 767.98px) {
    .feature-section,
    .highlights-section,
    .packages-section,
    .cta-section,
    .packages-grid-section {
        padding-top: clamp(2rem, 6vw, 3.5rem) !important;
        padding-bottom: clamp(2rem, 6vw, 3.5rem) !important;
    }

    .filters-section {
        padding-top: 1.25rem !important;
        padding-bottom: 1.25rem !important;
    }

    .filters-section .text-center.mb-lg-5 {
        margin-bottom: 1.25rem !important;
    }

    .filters-section .filter-hero-icon {
        margin-bottom: 0.65rem !important;
        font-size: 1.35rem;
    }

    .filters-section h2 {
        margin-bottom: 0.65rem !important;
    }

    .filters-section .text-center > .lead {
        font-size: 0.84rem;
        line-height: 1.4;
    }

    .filters-section .filter-stats {
        margin-top: 0.75rem !important;
        gap: 0.35rem !important;
    }

    .filters-section .filter-stats .badge {
        padding: 0.3rem 0.5rem;
        font-size: 0.68rem;
        line-height: 1.2;
    }

    .filters-section form {
        margin-top: 1rem !important;
    }

    .filters-section form .row {
        --bs-gutter-y: 0.7rem;
    }

    .filters-section form .form-label {
        margin-bottom: 0.4rem !important;
        font-size: 0.84rem;
    }

    .filters-section .package-search-input,
    .filters-section .form-select {
        min-height: 40px;
        padding: 0.5rem 0.7rem !important;
        font-size: 0.84rem;
    }

    .filters-section .btn-outline-light,
    .filters-section .btn-reset {
        min-height: 38px;
        padding: 0.45rem 0.65rem;
        font-size: 0.8rem;
        line-height: 1.2;
    }

    .filters-section .btn-group-vertical > .btn.btn-outline-light {
        min-height: 36px !important;
        margin-bottom: 0 !important;
        padding: 0.35rem 0.55rem !important;
        font-size: 0.76rem;
        line-height: 1.15;
    }

    .filters-section .active-filters {
        margin-top: 1rem;
        padding-top: 0.85rem;
    }

    .packages-grid-section .row,
    .packages-section .row {
        --bs-gutter-y: 1rem;
    }

    .packages-grid-section .package-card,
    .packages-section .package-card,
    .feature-card,
    .highlight-card,
    .package-detail-main .card,
    .booking-main .card,
    .booking-detail-main .card,
    .payment-main .card,
    .profile-card,
    .form-container {
        border-radius: 8px;
    }

    .packages-grid-section .package-image-container,
    .packages-section .package-image {
        height: clamp(135px, 38vw, 175px);
    }

    .packages-grid-section .package-content,
    .packages-section .package-content {
        padding: 0.8rem !important;
    }

    .packages-grid-section .package-content > div:first-child,
    .packages-section .package-content > div:first-child {
        min-height: 0;
    }

    .packages-grid-section .package-summary,
    .packages-grid-section .package-description {
        margin-bottom: 0.6rem !important;
    }

    .packages-grid-section .package-meta-grid {
        gap: 0.3rem 0.5rem;
        margin-top: 0.45rem;
        margin-bottom: 0.8rem !important;
    }

    .packages-grid-section .package-meta-grid .meta-item {
        font-size: 0.74rem;
    }

    .packages-grid-section .price-section,
    .packages-grid-section .price-panel {
        margin-bottom: 0.75rem !important;
        padding: 0.65rem !important;
    }

    .packages-grid-section .package-bottom {
        margin-top: 0.5rem;
    }

    .packages-grid-section .package-content .mb-4,
    .packages-section .package-content .mb-4 {
        margin-bottom: 0.75rem !important;
    }

    .packages-grid-section .package-content .mb-3,
    .packages-section .package-content .mb-3 {
        margin-bottom: 0.55rem !important;
    }

    .packages-grid-section .package-content .mt-3,
    .packages-section .package-content .mt-3 {
        margin-top: 0.65rem !important;
    }

    .package-detail-main > .container,
    .booking-main > .container,
    .booking-detail-main > .container,
    .payment-main > .container {
        padding-top: 1.25rem !important;
        padding-bottom: 1.5rem !important;
    }

    .package-detail-main .package-image-card {
        aspect-ratio: 16 / 9;
        margin-bottom: 1.5rem !important;
    }

    .package-detail-main .card-body,
    .booking-main .card-body,
    .booking-detail-main .card-body,
    .payment-main .card-body {
        padding: 0.85rem;
    }

    .booking-main section,
    .booking-detail-main section {
        margin-bottom: 1.5rem !important;
    }

    .booking-main hr,
    .booking-detail-main hr,
    .payment-main hr {
        margin: 1rem 0;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .filters-section {
        padding-top: 1.5rem !important;
        padding-bottom: 1.5rem !important;
    }

    .filters-section .btn-group-vertical > .btn.btn-outline-light {
        min-height: 40px;
        padding: 0.45rem 0.65rem;
        font-size: 0.82rem;
        line-height: 1.2;
    }

    .filters-section form .form-label {
        margin-bottom: 0.5rem !important;
        font-size: 0.88rem;
    }

    .packages-grid-section .package-image-container,
    .packages-section .package-image {
        height: 200px;
    }

    .packages-grid-section .package-content,
    .packages-section .package-content {
        padding: 1rem !important;
    }
}

@media (max-width: 479.98px) {
    .filters-section form .row > [class*="col-md-3"] {
        width: 50%;
    }

    .filters-section .filter-hero-icon,
    .filters-section .text-center > .lead,
    .filters-section .filter-stats {
        display: none;
    }

    .filters-section .text-center.mb-lg-5 {
        margin-bottom: 0.75rem !important;
    }

    .filters-section .col-12,
    .filters-section [class*="col-sm-6"],
    .filters-section [class*="col-md-"] {
        margin-bottom: 0 !important;
    }

    .filters-section .btn-group-vertical {
        gap: 0.25rem;
    }

    .filters-section .btn-group-vertical > .btn-outline-light {
        border-radius: 5px !important;
    }

    .packages-grid-section .package-image-container,
    .packages-section .package-image {
        height: 135px;
    }

    .packages-grid-section .package-name,
    .packages-section .package-name {
        font-size: 1rem;
    }

    .packages-grid-section .package-card .btn,
    .packages-section .package-card .btn {
        min-height: 38px;
        padding: 0.45rem 0.6rem;
    }
}

/* Final mobile polish: preserve the desktop composition while restoring comfortable reading and tap space. */
@media (max-width: 767.98px) {
    :root {
        --page-gutter: 1rem;
    }

    body {
        line-height: 1.65;
        overflow-x: hidden;
    }

    .container,
    .container-fluid.container-lg {
        width: 100%;
        max-width: none;
        padding-right: var(--page-gutter);
        padding-left: var(--page-gutter);
    }

    .site-main {
        padding-bottom: 2rem;
    }

    .narropil-nav {
        padding-top: 0.65rem;
        padding-bottom: 0.65rem;
    }

    .narropil-nav .navbar-collapse {
        margin-top: 0.75rem;
        padding-top: 0.75rem;
        border-top: 1px solid rgba(255, 255, 255, 0.14);
    }

    .narropil-nav .navbar-nav {
        gap: 0.15rem;
    }

    .narropil-nav .nav-link,
    .narropil-nav .nav-book-button {
        min-height: 44px;
        display: flex;
        align-items: center;
    }

    .narropil-nav .nav-book-button {
        justify-content: center;
        margin-top: 0.5rem;
    }

    .home-hero {
        min-height: 600px;
    }

    .home-hero .container > .row {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }

    .home-hero h1 {
        font-size: clamp(2.5rem, 12vw, 4rem);
        line-height: 1.04;
        margin-bottom: 1.25rem;
    }

    .home-hero .hero-copy,
    .section-lead,
    .feature-card p,
    .highlight-card p,
    .cta-section p {
        line-height: 1.7;
    }

    .hero-actions {
        gap: 0.75rem !important;
    }

    .hero-actions .btn,
    .cta-section .btn,
    .booking-main .btn-lg,
    .booking-detail-main .btn-lg,
    .payment-main .btn-lg {
        min-height: 48px;
    }

    .feature-section,
    .highlights-section,
    .packages-section,
    .cta-section,
    .packages-grid-section {
        padding-top: clamp(2.75rem, 9vw, 4rem) !important;
        padding-bottom: clamp(2.75rem, 9vw, 4rem) !important;
    }

    .home-intro {
        padding-top: 3rem !important;
        padding-bottom: 3rem !important;
    }

    .section-heading {
        margin-bottom: 1.75rem !important;
    }

    .feature-card,
    .highlight-card,
    .stat-card,
    .section-panel,
    .about-panel,
    .profile-card,
    .form-container {
        padding: 1.35rem;
    }

    .feature-card .feature-number {
        margin-bottom: 1.5rem;
    }

    .packages-hero,
    .package-detail-main .package-hero {
        padding-top: 3rem !important;
        padding-bottom: 3rem !important;
    }

    .filters-section {
        padding: 1.5rem var(--page-gutter) !important;
    }

    .filters-section form .row {
        --bs-gutter-x: 1rem;
        --bs-gutter-y: 1.25rem;
    }

    .filters-section form .form-label {
        margin-bottom: 0.55rem !important;
        line-height: 1.4;
    }

    .filters-section .package-search-input,
    .filters-section .form-select,
    .form-container input,
    .form-container textarea,
    .form-container select,
    .form-container .form-control {
        min-height: 46px;
        font-size: 1rem;
    }

    .filters-section .btn-group-vertical > .btn.btn-outline-light {
        min-height: 44px !important;
        padding: 0.55rem 0.7rem !important;
        font-size: 0.84rem;
        line-height: 1.3;
    }

    .filters-section .btn-reset {
        min-height: 46px;
    }

    .packages-grid-section .row,
    .packages-section .row,
    .highlights-section .row,
    .feature-section .row {
        --bs-gutter-y: 1.5rem;
    }

    .packages-grid-section .package-card,
    .packages-section .package-card {
        min-height: 100%;
    }

    .packages-grid-section .package-image-container,
    .packages-section .package-image {
        height: clamp(180px, 50vw, 230px);
    }

    .packages-grid-section .package-content,
    .packages-section .package-content {
        padding: 1.15rem !important;
    }

    .packages-grid-section .package-description,
    .packages-section .package-description {
        line-height: 1.6;
    }

    .package-detail-main .card-body,
    .booking-main .card-body,
    .booking-detail-main .card-body,
    .payment-main .card-body {
        padding: 1.15rem;
    }

    .table-responsive {
        margin-right: calc(var(--page-gutter) * -1);
        margin-left: calc(var(--page-gutter) * -1);
        padding-right: var(--page-gutter);
        padding-left: var(--page-gutter);
    }

    .table-responsive .table {
        min-width: 620px;
    }

    .alert-custom {
        align-items: flex-start;
        padding: 0.9rem 1rem 1.25rem;
        line-height: 1.5;
    }

    .footer {
        padding-top: 2rem;
    }

    .footer .row > [class*="col-"] {
        margin-bottom: 1rem;
    }
}

@media (max-width: 479.98px) {
    :root {
        --page-gutter: 0.9rem;
    }

    .home-hero {
        min-height: 570px;
    }

    .home-hero .container > .row {
        padding-top: 3.5rem;
        padding-bottom: 3.5rem;
    }

    .feature-card,
    .highlight-card,
    .stat-card,
    .section-panel,
    .about-panel,
    .profile-card,
    .form-container {
        padding: 1.15rem;
    }

    .filters-section form .row > [class*="col-"] {
        width: 100%;
    }

    .filters-section .btn-group-vertical > .btn.btn-outline-light {
        min-height: 46px !important;
    }

    .packages-grid-section .package-image-container,
    .packages-section .package-image {
        height: 190px;
    }

    .packages-grid-section .package-content,
    .packages-section .package-content {
        padding: 1.1rem !important;
    }

    .whatsapp-float span {
        display: none;
    }

    .whatsapp-float {
        width: 3.25rem;
        justify-content: center;
        padding: 0.65rem;
    }
}

/* Keep package facts readable without letting each mobile card dominate the page. */
@media (max-width: 767.98px) {
    .package-detail-main .row.g-2 {
        row-gap: 0.75rem !important;
        margin-bottom: 1.5rem !important;
    }

    .package-detail-main .row.g-2 > .col-md-3 .card {
        min-height: 0;
    }

    .package-detail-main .row.g-2 > .col-md-3 .card-body {
        min-height: 148px;
        padding: 1.25rem 1rem;
    }

    .package-detail-main section > h2.h3 {
        margin-bottom: 0.9rem;
    }
}

@media (max-width: 479.98px) {
    .package-detail-main .row.g-2 > .col-md-3 .card-body {
        min-height: 132px;
        padding: 1.1rem 0.85rem;
    }
}

/* Package media gallery: uses the existing Narropil surfaces, accents, radius, and shadows. */
.package-gallery {
    min-width: 0;
}

.package-gallery-stage {
    position: relative;
    overflow: hidden;
    aspect-ratio: 16 / 9;
    min-height: 280px;
    border-radius: var(--radius);
    background: var(--surface-soft);
    box-shadow: var(--shadow-sm);
}

.package-gallery-slide {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    opacity: 0;
    transition: opacity 0.3s ease;
    background: var(--surface-soft);
}

.package-gallery-slide.is-active {
    z-index: 1;
    opacity: 1;
}

.package-gallery-media-trigger,
.package-gallery-video {
    width: 100%;
    height: 100%;
    border: 0;
    background: transparent;
}

.package-gallery-media-trigger {
    display: block;
    padding: 0;
    cursor: zoom-in;
}

.package-gallery-media-trigger img,
.package-gallery-video {
    width: 100%;
    height: 100%;
}

.package-gallery-media-trigger img {
    object-fit: cover;
}

.package-gallery-video {
    object-fit: contain;
    background: var(--accent-deep);
}

.package-gallery-caption {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
    margin: 0;
    padding: 0.75rem 1rem;
    background: linear-gradient(transparent, rgba(13, 44, 73, 0.86));
    color: #fff;
    font-size: 0.88rem;
    line-height: 1.4;
}

.gallery-control,
.gallery-lightbox-close {
    display: grid;
    place-items: center;
    width: 2.75rem;
    height: 2.75rem;
    min-width: 2.75rem;
    min-height: 2.75rem;
    border: 1px solid rgba(255, 255, 255, 0.55);
    border-radius: 50%;
    background: rgba(13, 44, 73, 0.72);
    color: #fff;
    transition: background-color var(--transition), transform var(--transition);
}

.gallery-control:hover,
.gallery-control:focus-visible,
.gallery-lightbox-close:hover,
.gallery-lightbox-close:focus-visible {
    background: var(--primary);
    color: #fff;
    transform: scale(1.04);
}

.package-gallery-stage > .gallery-control {
    position: absolute;
    top: 50%;
    z-index: 3;
    transform: translateY(-50%);
}

.package-gallery-stage > .gallery-control:hover,
.package-gallery-stage > .gallery-control:focus-visible {
    transform: translateY(-50%) scale(1.04);
}

.gallery-control-prev { left: 1rem; }
.gallery-control-next { right: 1rem; }

.package-gallery-thumbnails {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(64px, 1fr));
    gap: 0.65rem;
    margin-top: 0.75rem;
}

.gallery-thumbnail {
    position: relative;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    padding: 0;
    border: 2px solid transparent;
    border-radius: var(--radius-sm);
    background: var(--surface-soft);
}

.gallery-thumbnail.is-active {
    border-color: var(--primary);
    box-shadow: 0 0 0 2px rgba(192, 154, 68, 0.18);
}

.gallery-thumbnail img,
.gallery-thumbnail-video {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    object-fit: cover;
}

.gallery-thumbnail-video {
    background: var(--accent-deep);
    color: #fff;
}

.gallery-counter {
    margin: 0.65rem 0 0;
    color: var(--muted);
    font-size: 0.8rem;
    text-align: right;
}

.gallery-lightbox {
    position: fixed;
    inset: 0;
    z-index: 1060;
    display: grid;
    grid-template-columns: 3.5rem minmax(0, 1fr) 3.5rem;
    align-items: center;
    gap: 1rem;
    padding: 3rem clamp(1rem, 4vw, 4rem);
    background: rgba(13, 44, 73, 0.94);
}

.gallery-lightbox[hidden] { display: none; }

.gallery-lightbox-close {
    position: absolute;
    top: 1rem;
    right: 1rem;
}

.gallery-lightbox-content {
    display: grid;
    width: 100%;
    max-width: 1100px;
    max-height: calc(100vh - 6rem);
    margin: auto;
    place-items: center;
}

.gallery-lightbox-content img,
.gallery-lightbox-content video {
    display: block;
    width: auto;
    max-width: 100%;
    max-height: calc(100vh - 6rem);
    object-fit: contain;
}

.package-book-cta {
    animation: package-cta-shake 2.4s ease-in-out infinite;
    transform-origin: center;
}

.package-book-cta:hover,
.package-book-cta:focus-visible {
    animation-play-state: paused;
}

@keyframes package-cta-shake {
    0%, 52%, 100% { transform: translateX(0) rotate(0); }
    54% { transform: translateX(-4px) rotate(-1.5deg); }
    56% { transform: translateX(5px) rotate(1.5deg); }
    58% { transform: translateX(-6px) rotate(-2deg); }
    60% { transform: translateX(6px) rotate(2deg); }
    62% { transform: translateX(-5px) rotate(-1.5deg); }
    64% { transform: translateX(4px) rotate(1.5deg); }
    66% { transform: translateX(-2px) rotate(-0.75deg); }
    68% { transform: translateX(2px) rotate(0.75deg); }
    70% { transform: translateX(0) rotate(0); }
}

@media (max-width: 767.98px) {
    .package-gallery-stage {
        min-height: 220px;
        aspect-ratio: 4 / 3;
    }

    .package-gallery-thumbnails {
        grid-template-columns: repeat(auto-fit, minmax(58px, 1fr));
        gap: 0.45rem;
    }

    .gallery-control {
        width: 2.65rem;
        height: 2.65rem;
        min-width: 2.65rem;
        min-height: 2.65rem;
    }

    .gallery-lightbox {
        grid-template-columns: 2.75rem minmax(0, 1fr) 2.75rem;
        gap: 0.5rem;
        padding: 3.5rem 0.65rem 1.5rem;
    }

    .package-book-cta {
        animation-duration: 2.1s;
    }
}

/* Package detail storytelling layer: improves hierarchy for populated package data. */
.package-hero-kicker {
    margin-bottom: 0.9rem;
    color: var(--primary);
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.package-hero-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem 1.25rem;
    margin-top: 1.5rem;
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.82rem;
}

.package-hero-meta span {
    display: inline-flex;
    align-items: center;
}

.package-hero-meta i {
    color: var(--primary);
}

.package-section-heading {
    margin-bottom: 1.25rem;
}

.package-highlight-list,
.package-destination-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
}

.package-highlight,
.package-destination-list span {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    min-height: 2.5rem;
    padding: 0.65rem 0.85rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--surface);
    color: var(--ink);
    font-size: 0.88rem;
    line-height: 1.35;
}

.package-highlight i,
.package-destination-list i {
    color: var(--primary-dark);
}

.package-itinerary {
    border-left: 2px solid var(--line);
    padding-left: 1.25rem;
}

.package-itinerary-item {
    position: relative;
    padding: 0.2rem 0 1.35rem;
}

.package-itinerary-item::before {
    content: '';
    position: absolute;
    top: 0.55rem;
    left: -1.7rem;
    width: 0.75rem;
    height: 0.75rem;
    border: 2px solid var(--surface);
    border-radius: 50%;
    background: var(--primary);
    box-shadow: 0 0 0 1px var(--primary);
}

.package-itinerary-day {
    display: block;
    margin-bottom: 0.3rem;
    color: var(--accent-deep);
    font-family: 'Manrope', sans-serif;
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.package-itinerary-item p {
    margin: 0;
    line-height: 1.65;
}

.package-savings {
    margin-top: 0.8rem;
    color: var(--success);
    font-size: 0.82rem;
    font-weight: 700;
}

.home-feature-panel {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: var(--shadow-sm);
}

.home-feature-panel .feature-card {
    height: 100%;
    border: 0;
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    border-radius: 0;
    box-shadow: none;
}

.home-feature-panel .row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.home-feature-panel .row > [class*="col-"] {
    width: 100%;
}

.home-feature-panel .row > .col-12:nth-child(2n) .feature-card {
    border-right: 0;
}

.home-feature-panel .row > .col-12:last-child .feature-card {
    border-bottom: 0;
}

.home-stats-panel {
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: var(--radius);
    background: rgba(255, 255, 255, 0.04);
}

.home-stats-panel .highlight-card {
    height: 100%;
    border-top: 0;
    border-right: 1px solid rgba(255, 255, 255, 0.2);
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    padding: 1.1rem 1rem;
}

.home-stats-panel .row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.home-stats-panel .row > [class*="col-"] {
    width: 100%;
}

.home-stats-panel .row > .col-12:nth-child(2n) .highlight-card {
    border-right: 0;
}

.home-stats-panel .row > .col-12:nth-last-child(-n+2) .highlight-card {
    border-bottom: 0;
}

.home-stats-panel .highlight-icon {
    margin-bottom: 0.55rem;
    font-size: 1.45rem;
}

.home-stats-panel .highlight-card h4 {
    margin-bottom: 0.35rem;
    font-size: 1.35rem;
    line-height: 1.15;
}

.home-stats-panel .highlight-card p {
    margin-bottom: 0;
    font-size: 0.82rem;
    line-height: 1.35;
}

.package-facts-card {
    border: 1px solid var(--line) !important;
    box-shadow: var(--shadow-sm);
}

.package-facts-title {
    margin-bottom: 1.25rem;
    color: var(--accent-deep);
    font-size: 1.2rem;
}

.package-facts-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.package-fact {
    min-width: 0;
    padding: 0.35rem 1rem;
    border-left: 1px solid var(--line);
}

.package-fact:first-child {
    padding-left: 0;
    border-left: 0;
}

.package-fact h6 {
    margin-bottom: 0.45rem;
    color: var(--muted);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.package-fact strong {
    display: block;
    color: var(--accent);
    font-family: 'Manrope', sans-serif;
    font-size: clamp(1rem, 1.8vw, 1.25rem);
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.package-fact strong small {
    color: var(--muted);
    font-family: 'DM Sans', sans-serif;
    font-size: 0.72em;
    font-weight: 600;
}

.recommended-packages {
    scroll-margin-top: 5rem;
}

.recommended-packages-heading {
    margin-bottom: 1.5rem;
}

.recommended-package-card {
    color: var(--ink);
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
    transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
}

.recommended-package-card:hover,
.recommended-package-card:focus-visible {
    color: var(--ink);
    border-color: rgba(192, 154, 68, 0.55);
    box-shadow: var(--shadow-md);
    transform: translateY(-5px);
}

.recommended-package-card:focus-visible {
    outline: 3px solid rgba(192, 154, 68, 0.45);
    outline-offset: 3px;
}

.recommended-package-card .package-image-container {
    position: relative;
    flex: 0 0 auto;
    height: 190px;
    overflow: hidden;
    background: var(--accent-deep);
}

.recommended-package-image > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.45s ease;
}

.recommended-package-card:hover .recommended-package-image > img {
    transform: scale(1.045);
}

.recommended-package-placeholder {
    display: grid;
    width: 100%;
    height: 100%;
    align-content: center;
    justify-items: center;
    gap: 0.65rem;
    padding: 1rem;
    color: #fff;
    text-align: center;
    background: linear-gradient(145deg, var(--accent-deep), #286044 72%, #9f7f35);
}

.recommended-package-placeholder i {
    color: #f0d58d;
    font-size: 2rem;
}

.recommended-package-placeholder span {
    max-width: 100%;
    font-family: 'Manrope', sans-serif;
    font-size: 0.88rem;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.recommended-package-ribbon {
    position: absolute;
    top: 0.85rem;
    left: 0.85rem;
    padding: 0.3rem 0.65rem;
    border-radius: 999px;
    color: var(--accent-deep);
    background: #fff;
    font-size: 0.7rem;
    font-weight: 800;
    line-height: 1.2;
}

.recommended-package-card .package-content {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    justify-content: space-between;
    gap: 1.15rem;
    padding: 1.15rem !important;
}

.recommended-package-location {
    display: flex;
    align-items: flex-start;
    gap: 0.4rem;
    margin-bottom: 0.55rem;
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 700;
    line-height: 1.35;
}

.recommended-package-location i {
    flex: 0 0 auto;
    margin-top: 0.15rem;
    color: var(--success);
}

.recommended-package-card .package-name {
    margin: 0;
    color: var(--accent-deep);
    font-family: 'Manrope', sans-serif;
    font-size: 1.08rem;
    font-weight: 800;
    line-height: 1.3;
}

.recommended-package-card .package-description {
    display: -webkit-box;
    min-height: 4.35em;
    margin: 0.55rem 0 0;
    overflow: hidden;
    color: var(--muted);
    font-size: 0.88rem;
    line-height: 1.45;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.recommended-package-footer {
    display: grid;
    gap: 0.75rem;
    padding-top: 0.85rem;
    border-top: 1px solid var(--line);
}

.recommended-package-facts {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.65rem 1rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 700;
}

.recommended-package-facts span {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.recommended-package-facts .fa-star {
    color: var(--warning);
}

.recommended-package-price-row {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.25rem 0.5rem;
}

.recommended-package-price-label {
    color: var(--muted);
    font-size: 0.74rem;
}

.recommended-package-price-row strong {
    color: var(--success);
    font-family: 'Manrope', sans-serif;
    font-size: 1.15rem;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.recommended-package-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    color: var(--accent);
    font-size: 0.84rem;
    font-weight: 800;
}

.recommended-package-link i {
    color: var(--primary-dark);
    transition: transform var(--transition);
}

.recommended-package-card:hover .recommended-package-link i {
    transform: translateX(4px);
}

@media (max-width: 767.98px) {
    .package-hero-kicker {
        font-size: 0.7rem;
    }

    .package-hero-meta {
        gap: 0.55rem 0.9rem;
        margin-top: 1.25rem;
        font-size: 0.78rem;
    }

    .package-highlight,
    .package-destination-list span {
        width: 100%;
    }

    .recommended-package-card .package-image-container {
        height: 200px;
    }

    .package-facts-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1rem 0;
    }

    .package-fact:nth-child(odd) {
        padding-left: 0;
        border-left: 0;
    }

    .package-fact:nth-child(even) {
        padding-right: 0;
    }

    .home-feature-panel .feature-card {
        padding: 1.1rem;
    }

    .home-stats-panel .highlight-card {
        padding: 0.85rem 1rem;
    }

    .package-detail-main > .container {
        padding-top: 1rem !important;
        padding-bottom: 1.25rem !important;
    }

    .package-detail-main .package-gallery {
        margin-bottom: 1.5rem !important;
    }

    .package-facts-card {
        margin-bottom: 1.5rem !important;
    }

    .package-facts-card .card-body {
        padding: 1rem;
    }

    .package-facts-title {
        margin-bottom: 1rem;
        font-size: 1.1rem;
    }

    .package-fact {
        padding-top: 0.2rem;
        padding-bottom: 0.2rem;
    }

    .package-detail-main .col-lg-8 > section {
        margin-bottom: 1.5rem !important;
    }

    .package-detail-main .col-lg-8 > section > h2.h3 {
        margin-bottom: 0.85rem !important;
    }

    .package-detail-main .col-lg-4 .sticky-top-card {
        margin-top: 1rem;
    }

    .package-detail-main .col-lg-4 .sticky-top-card .card-body {
        padding: 1.1rem;
    }

    .package-detail-main .col-lg-4 .d-grid {
        gap: 0.65rem !important;
    }

    .package-detail-main .col-lg-4 .package-book-cta,
    .package-detail-main .col-lg-4 a.btn-outline-secondary {
        display: flex;
        width: 100%;
        min-height: 48px;
        align-items: center;
        justify-content: center;
        margin: 0;
        padding: 0.75rem 1rem;
        line-height: 1.25;
        text-align: center;
    }

    .package-detail-main .col-lg-4 .package-book-cta {
        margin-bottom: 0.25rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .package-gallery-slide,
    .gallery-control,
    .gallery-lightbox-close {
        transition: none;
    }
}

/* Compact package filters: keep the existing controls available without making mobile results hard to reach. */
.filters-panel {
    margin-top: 1.25rem;
}

.filters-toggle {
    display: none;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 46px;
    padding: 0.7rem 0.9rem;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: var(--radius-sm);
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    font-size: 0.9rem;
    font-weight: 700;
    text-align: left;
}

.filters-toggle-icon {
    transition: transform var(--transition);
}

.filters-toggle[aria-expanded="true"] .filters-toggle-icon {
    transform: rotate(180deg);
}

@media (max-width: 767.98px) {
    .filters-toggle {
        display: flex;
    }

    .filters-panel {
        margin-top: 0;
    }

    .filters-panel:not(.is-open) {
        display: none;
    }

    .filters-panel.is-open form {
        margin-top: 1rem !important;
    }

    .filters-panel .active-filters {
        margin-top: 0.9rem;
        padding-top: 0.8rem;
    }
}

.form-container .form-group > label {
    display: block;
    margin-bottom: 0.45rem;
    color: var(--accent-deep);
    font-size: 0.9rem;
    font-weight: 700;
}

.form-container .form-check {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
    min-width: 0;
}

.form-container .form-check-input {
    float: none;
    flex: 0 0 auto;
    margin: 0.2rem 0 0;
}

.form-container .form-check-label {
    line-height: 1.45;
}

/* Shared responsive quality layer: preserve the theme while preventing common layout failures. */
html {
    scroll-padding-top: 5rem;
}

body {
    overflow-x: hidden;
}

:where(a, button, input, select, textarea, summary):focus-visible {
    outline: 3px solid rgba(192, 154, 68, 0.55);
    outline-offset: 3px;
}

:where(input, select, textarea, button) {
    max-width: 100%;
}

:where(.row, .d-flex, .card, .card-body, .form-group) {
    min-width: 0;
}

textarea {
    resize: vertical;
}

@media (max-width: 767.98px) {
    :where(.row, .row > [class*="col-"]) {
        min-width: 0;
    }

    :where(.row > [class*="col-"]) {
        max-width: 100%;
    }

    :where(.card-header, .card-body, .card-footer) {
        overflow-wrap: anywhere;
    }

    :where(.btn, button, input, select, textarea) {
        -webkit-tap-highlight-color: transparent;
    }

    .table-responsive {
        max-width: 100%;
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        -webkit-overflow-scrolling: touch;
    }

    .table-responsive > .table {
        margin-bottom: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }
}

/* Keep the floating WhatsApp action readable and rectangular on small screens. */
.whatsapp-float {
    width: max-content;
    height: auto;
    min-width: 0;
    min-height: 3.1rem;
    max-width: calc(100vw - 1.5rem);
    padding: 0.7rem 1rem;
    gap: 0.55rem;
    border-radius: 0.85rem;
    background: #18b85a;
    white-space: nowrap;
    animation: whatsapp-vibrant-shake 3.6s ease-in-out infinite;
}

.whatsapp-float span {
    display: inline;
}

.whatsapp-float:hover,
.whatsapp-float:focus-visible,
.whatsapp-float:active {
    animation-play-state: paused;
}

@keyframes whatsapp-vibrant-shake {
    0%, 70%, 100% {
        transform: rotate(0) translateX(0) scale(1);
        box-shadow: 0 0.75rem 1.75rem rgba(8, 91, 46, 0.3), 0 0 0 0.3rem rgba(25, 185, 87, 0.16);
    }
    72% {
        transform: rotate(-7deg) translateX(-2px) scale(1.04);
        box-shadow: 0 0.85rem 1.9rem rgba(8, 91, 46, 0.4), 0 0 0 0.55rem rgba(25, 185, 87, 0.25);
    }
    75% { transform: rotate(8deg) translateX(2px) scale(1.04); }
    78% { transform: rotate(-6deg) translateX(-2px) scale(1.03); }
    81% { transform: rotate(6deg) translateX(2px) scale(1.03); }
    84% {
        transform: rotate(0) translateX(0) scale(1);
        box-shadow: 0 0.75rem 1.75rem rgba(8, 91, 46, 0.3), 0 0 0 0.3rem rgba(25, 185, 87, 0.16);
    }
}