@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&display=swap');
:root{--navy:#061b2f;--navy2:#0a2f4a;--aqua:#24d0c3;--gold:#e8b968;--sky:#e8f7f6;--ink:#10283a;--muted:#6a7b87;--line:#dfe8ec;--white:#fff;--shadow:0 18px 50px rgba(6,27,47,.13);--r:20px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:"DM Sans",sans-serif;background:#fff;font-size:16px}button,input,select,textarea{font:inherit}button,a{transition:.2s ease}a{color:inherit;text-decoration:none}button{cursor:pointer}.header{height:84px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,5vw,74px);position:sticky;top:0;z-index:30;background:rgba(255,255,255,.96);backdrop-filter:blur(14px);border-bottom:1px solid rgba(6,27,47,.08)}.brand{display:flex;align-items:center;gap:11px;font-family:Manrope,sans-serif;font-size:23px;color:var(--navy)}.brand svg{width:43px;height:43px}.mark-bg{fill:var(--navy)}.mark-wave{fill:var(--aqua)}.mark-sail{fill:#fff}.brand b{font-weight:800}.brand small{display:block;font:700 8px Manrope;letter-spacing:3px;color:#4d6b7e}.header nav{display:flex;gap:34px;font-weight:600;font-size:15px}.header nav a:hover{color:#008e88}.header-actions{display:flex;align-items:center;gap:10px;position:relative}.icon-btn,.account-btn,.menu-btn{border:1px solid var(--line);background:white;border-radius:999px;height:43px;padding:0 14px;color:var(--ink)}.icon-btn span{color:#008e88;font-weight:700}.avatar{display:inline-grid;place-items:center;background:var(--navy);color:white;border-radius:50%;width:31px;height:31px;margin-left:6px;font-size:12px}.account-menu{display:none;position:absolute;right:0;top:54px;background:#fff;border:1px solid var(--line);border-radius:15px;box-shadow:var(--shadow);width:210px;padding:8px}.account-menu.open{display:grid}.account-menu a{padding:11px;border-radius:9px}.account-menu a:hover{background:var(--sky)}.menu-btn{display:none}.hero{min-height:650px;margin:18px clamp(14px,2.8vw,44px) 0;border-radius:28px;position:relative;overflow:hidden;display:flex;align-items:center;background:linear-gradient(90deg,rgba(3,20,34,.92) 0%,rgba(3,20,34,.60) 39%,rgba(3,20,34,.02) 72%),url("./hero-airbnboat.png") center/cover}.hero-content{width:min(670px,88%);margin-left:clamp(24px,6vw,86px);color:white;padding:60px 0}.eyebrow{display:flex;align-items:center;gap:10px;text-transform:uppercase;letter-spacing:2.5px;font-size:12px;font-weight:700;color:var(--aqua)}.eyebrow:before{content:"";width:34px;height:1px;background:currentColor}.hero h1{font:800 clamp(42px,5.7vw,78px)/.98 Manrope;margin:22px 0 20px;letter-spacing:-3px}.hero h1 em{font-style:normal;color:var(--aqua)}.hero p{font-size:19px;line-height:1.6;max-width:560px;color:#dbe7ec}.search-box{background:white;color:var(--ink);display:grid;grid-template-columns:1.4fr 1fr 1fr auto;gap:0;border-radius:16px;padding:8px;box-shadow:var(--shadow);margin-top:34px}.search-field{padding:9px 18px;border-right:1px solid var(--line)}.search-field label{display:block;font-size:11px;text-transform:uppercase;letter-spacing:1px;font-weight:700;color:#628}.search-field input,.search-field select{width:100%;border:0;outline:0;margin-top:5px;color:var(--ink);background:transparent}.search-btn,.btn-primary{border:0;background:var(--aqua);color:var(--navy);border-radius:12px;padding:0 25px;font-weight:800}.search-btn:hover,.btn-primary:hover{background:#58e3da;transform:translateY(-1px)}.trust-strip{display:flex;gap:25px;margin-top:28px;font-size:13px;color:#e4eff3}.trust-strip span:before{content:"✓";color:var(--aqua);margin-right:7px;font-weight:800}.section{padding:88px clamp(20px,6vw,92px)}.section.soft{background:#f3f8fa}.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:32px}.section-head h2,.page-hero h1{font:800 clamp(30px,4vw,48px)/1.08 Manrope;margin:8px 0;letter-spacing:-1.5px;color:var(--navy)}.section-head p{color:var(--muted);max-width:560px}.text-link{font-weight:700;color:#007f7a}.card-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}.listing-card{position:relative}.card-image{height:238px;border-radius:18px;overflow:hidden;background:#dbe7ea;position:relative}.card-image img{width:100%;height:100%;object-fit:cover;transition:.45s}.listing-card:hover img{transform:scale(1.05)}.badge{position:absolute;left:13px;top:13px;background:rgba(255,255,255,.92);padding:7px 10px;border-radius:999px;font-size:11px;font-weight:700}.heart{position:absolute;right:13px;top:13px;border:0;background:rgba(5,25,40,.42);color:white;width:37px;height:37px;border-radius:50%;font-size:21px;backdrop-filter:blur(6px)}.heart.active{background:#fff;color:#ef4a61}.listing-card h3{font:700 17px Manrope;margin:13px 0 4px}.meta{color:var(--muted);font-size:14px}.price{display:flex;align-items:center;justify-content:space-between;margin-top:9px}.price strong{font:800 17px Manrope;color:var(--navy)}.rating{font-size:13px}.rating b{color:#e7a72e}.category-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.category{height:330px;border-radius:24px;overflow:hidden;position:relative;color:white;padding:34px;display:flex;align-items:end;background-size:cover;background-position:center}.category.boat{background-image:linear-gradient(0deg,rgba(3,22,38,.85),transparent 70%),url('https://images.unsplash.com/photo-1567899378494-47b22a2ae96a?auto=format&fit=crop&w=1400&q=85')}.category.tour{background-image:linear-gradient(0deg,rgba(3,22,38,.85),transparent 70%),url('https://images.unsplash.com/photo-1540946485063-a40da27545f8?auto=format&fit=crop&w=1400&q=85')}.category h3{font:800 28px Manrope;margin:0}.category span{color:#dce9ee}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:36px}.step{padding:30px;border-top:2px solid var(--aqua)}.step i{display:grid;place-items:center;background:var(--sky);border-radius:14px;width:52px;height:52px;font-style:normal;font-size:25px}.step h3{font:700 20px Manrope}.host-banner{margin:0 clamp(20px,6vw,92px) 88px;background:var(--navy);color:white;border-radius:28px;padding:60px;display:flex;align-items:center;justify-content:space-between;gap:35px;overflow:hidden;position:relative}.host-banner:after{content:"";position:absolute;width:300px;height:300px;border:60px solid rgba(36,208,195,.11);border-radius:50%;right:-70px}.host-banner h2{font:800 clamp(30px,4vw,48px) Manrope;margin:0 0 14px;position:relative;z-index:2}.btn-primary{display:inline-flex;padding:15px 23px;position:relative;z-index:2}.page-hero{padding:62px clamp(20px,6vw,92px) 34px;background:linear-gradient(130deg,#e8f7f6,#f8fbfc)}.filterbar{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}.filterbar button,.filterbar select{border:1px solid var(--line);background:#fff;border-radius:999px;padding:11px 16px}.filterbar .active{background:var(--navy);color:white}.explore-layout{display:grid;grid-template-columns:1fr 330px;gap:34px;padding:36px clamp(20px,6vw,92px) 80px}.explore-layout .card-grid{grid-template-columns:repeat(3,1fr)}.map-box{position:sticky;top:110px;height:520px;border-radius:22px;background:linear-gradient(135deg,#a8dfdc,#dceceb);overflow:hidden}.map-box:before{content:"";position:absolute;inset:0;background-image:radial-gradient(#fff 1px,transparent 1px);background-size:28px 28px;opacity:.65}.map-box .pin{position:absolute;background:var(--navy);color:white;border-radius:999px;padding:8px 11px;font-size:12px;font-weight:700;box-shadow:var(--shadow)}.detail{padding:42px clamp(20px,6vw,92px) 90px}.detail-top{display:flex;justify-content:space-between;align-items:end}.detail-gallery{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:220px 220px;gap:10px;margin:28px 0}.detail-gallery img{width:100%;height:100%;object-fit:cover}.detail-gallery img:first-child{grid-row:1/3;border-radius:22px 0 0 22px}.detail-gallery img:nth-child(3){border-radius:0 22px 0 0}.detail-gallery img:nth-child(5){border-radius:0 0 22px 0}.detail-layout{display:grid;grid-template-columns:1fr 370px;gap:65px}.amenities{display:grid;grid-template-columns:1fr 1fr;gap:12px}.booking-box{box-shadow:var(--shadow);border:1px solid var(--line);padding:24px;border-radius:20px;height:max-content;position:sticky;top:110px}.booking-box input{width:100%;padding:12px;border:1px solid var(--line);border-radius:10px;margin:8px 0}.booking-box .btn-primary{width:100%;justify-content:center;margin-top:12px}.dashboard{display:grid;grid-template-columns:240px 1fr;min-height:680px}.sidebar{background:var(--navy);color:white;padding:32px 22px}.sidebar h3{font:700 18px Manrope;margin:20px 10px 30px}.sidebar a{display:block;padding:12px;border-radius:10px;margin:5px 0;color:#c4d4dc}.sidebar a.active,.sidebar a:hover{background:rgba(36,208,195,.15);color:var(--aqua)}.dash-main{padding:44px;background:#f5f8fa}.dash-head{display:flex;justify-content:space-between;align-items:center}.dash-head h1{font:800 32px Manrope;margin:0}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin:28px 0}.stat{background:#fff;border:1px solid var(--line);border-radius:16px;padding:21px}.stat small{color:var(--muted)}.stat strong{display:block;font:800 28px Manrope;margin-top:9px}.panel{background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px;margin-top:20px;overflow:auto}.panel h2{font:700 20px Manrope;margin-top:0}.data-table{width:100%;border-collapse:collapse;min-width:680px}.data-table th,.data-table td{text-align:left;padding:14px;border-bottom:1px solid var(--line);font-size:14px}.status{padding:6px 9px;border-radius:999px;font-size:12px;font-weight:700;background:#e8f7f6;color:#06756f}.status.warn{background:#fff1da;color:#a86700}.chart{display:flex;align-items:end;height:170px;gap:14px;padding-top:25px}.bar{flex:1;background:linear-gradient(var(--aqua),#159c96);border-radius:7px 7px 0 0;position:relative;min-width:20px}.bar small{position:absolute;bottom:-22px;width:100%;text-align:center;color:var(--muted)}.login-wrap{min-height:650px;display:grid;place-items:center;background:linear-gradient(135deg,#e7f7f5,#f8fbfc)}.auth-card{background:#fff;border-radius:24px;box-shadow:var(--shadow);padding:38px;width:min(470px,92vw)}.auth-card h1{font:800 32px Manrope;margin:0 0 8px}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;margin:25px 0;border-bottom:1px solid var(--line)}.auth-tabs button{border:0;background:none;padding:12px;font-weight:700}.auth-tabs .active{border-bottom:3px solid var(--aqua)}.field{margin:14px 0}.field label{display:block;font-size:13px;font-weight:700;margin-bottom:6px}.field input,.field select,.field textarea{width:100%;padding:13px;border:1px solid var(--line);border-radius:10px}.role-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px}.role-card{border:1px solid var(--line);padding:15px;border-radius:12px;text-align:center}.role-card.selected{border-color:var(--aqua);background:var(--sky)}dialog{border:0;border-radius:20px;padding:0;box-shadow:var(--shadow);width:min(520px,92vw)}dialog::backdrop{background:rgba(1,14,25,.7);backdrop-filter:blur(3px)}.dialog-body{padding:30px}.dialog-head{display:flex;justify-content:space-between}.close{border:0;background:none;font-size:25px}#toast{position:fixed;bottom:85px;left:50%;transform:translate(-50%,30px);background:var(--navy);color:#fff;padding:13px 20px;border-radius:999px;opacity:0;pointer-events:none;z-index:80;transition:.25s}#toast.show{opacity:1;transform:translate(-50%,0)}.whatsapp{position:fixed;right:24px;bottom:24px;z-index:50;background:#20bd64;color:white;border-radius:999px;padding:15px 19px;font-weight:700;box-shadow:0 12px 34px rgba(32,189,100,.35)}.whatsapp span{margin-left:6px}footer{background:#041625;color:#b9cbd4;padding:62px clamp(20px,6vw,92px) 25px;display:grid;grid-template-columns:2fr 1fr 1fr 1.5fr;gap:45px}footer .brand{color:white}footer .mark-bg{fill:#fff}footer .mark-sail{fill:var(--navy)}footer div>a,footer div>span{display:block;margin:11px 0;font-size:14px}footer h4{color:white}.footer-brand p{max-width:350px;line-height:1.6}.copyright{grid-column:1/-1;border-top:1px solid #16364b;padding-top:20px;font-size:13px}
@media(max-width:1100px){.header nav{display:none}.menu-btn{display:block}.card-grid{grid-template-columns:repeat(2,1fr)}.explore-layout{grid-template-columns:1fr}.explore-layout .card-grid{grid-template-columns:repeat(3,1fr)}.map-box{display:none}.stat-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){.header{height:70px;padding:0 16px}.brand{font-size:19px}.brand svg{width:37px}.icon-btn{display:none}.hero{min-height:680px;margin:8px;border-radius:20px;align-items:flex-end;background:linear-gradient(0deg,rgba(3,20,34,.96),rgba(3,20,34,.08) 90%),url("./hero-airbnboat.png") 65% center/cover}.hero-content{margin:0;padding:48px 22px;width:100%}.hero h1{font-size:43px;letter-spacing:-2px}.hero p{font-size:16px}.search-box{grid-template-columns:1fr}.search-field{border-right:0;border-bottom:1px solid var(--line)}.search-btn{height:50px}.trust-strip{flex-wrap:wrap;gap:8px 15px}.section{padding:62px 18px}.section-head{align-items:start;flex-direction:column}.card-grid,.explore-layout .card-grid,.category-grid,.steps{grid-template-columns:1fr}.card-image{height:260px}.category{height:280px}.host-banner{margin:0 18px 62px;padding:35px 26px;display:block}.host-banner .btn-primary{margin-top:18px}.explore-layout{padding:26px 18px 60px}.detail{padding:28px 16px 60px}.detail-top{display:block}.detail-gallery{grid-template-columns:1fr 1fr;grid-template-rows:250px 130px}.detail-gallery img:first-child{grid-column:1/3;grid-row:auto;border-radius:18px 18px 0 0}.detail-gallery img:nth-child(4),.detail-gallery img:nth-child(5){display:none}.detail-gallery img:nth-child(3){border-radius:0 0 18px 0}.detail-layout{grid-template-columns:1fr;gap:25px}.booking-box{position:static}.dashboard{grid-template-columns:1fr}.sidebar{display:flex;overflow:auto;padding:10px}.sidebar h3{display:none}.sidebar a{white-space:nowrap}.dash-main{padding:25px 16px}.stat-grid{grid-template-columns:1fr 1fr}.stat strong{font-size:22px}footer{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}.whatsapp span{display:none}.whatsapp{padding:15px 18px}.role-cards{grid-template-columns:1fr}}