/* ── Startpage Styles ── */
.sp-hero{position:relative;min-height:85vh;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#0c4a6e}
.sp-hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.sp-hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,47,73,.7) 0%,rgba(12,74,110,.5) 40%,rgba(3,105,161,.4) 100%);z-index:1}
.sp-hero-content{position:relative;z-index:2;text-align:center;padding:0 1.5rem;max-width:820px}
.sp-hero h1{font-size:clamp(2.2rem,5vw,3.8rem);font-weight:700;color:#fff;line-height:1.15;margin:0 0 1.25rem}
.sp-hero-desc{font-size:1.05rem;color:rgba(255,255,255,.75);line-height:1.7;margin-bottom:2rem}
.sp-hero-chat{margin-bottom:3rem;max-width:560px;margin-left:auto;margin-right:auto}
.sp-chat-input-wrap{display:flex;align-items:center;background:rgba(255,255,255,.12);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.25);border-radius:9999px;padding:.375rem .375rem .375rem 1.25rem;transition:all .3s ease}
.sp-chat-input-wrap:focus-within{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.5);box-shadow:0 0 30px rgba(14,165,233,.2)}
.sp-chat-icon{color:rgba(255,255,255,.5);flex-shrink:0;margin-right:.75rem}
.sp-chat-field{flex:1;background:transparent;border:none;outline:none;color:#fff;font-size:1rem;font-family:inherit;padding:.625rem 0}
.sp-chat-field::placeholder{color:rgba(255,255,255,.5)}
.sp-chat-send{width:42px;height:42px;border-radius:50%;background:#0ea5e9;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#fff;transition:all .2s;flex-shrink:0}
.sp-chat-send:hover{background:#0284c7;transform:scale(1.05)}
.sp-chat-chips{display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap;margin-top:1rem}
.sp-chip{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.8);padding:.375rem 1rem;border-radius:9999px;font-size:.8rem;font-family:inherit;cursor:pointer;transition:all .2s;white-space:nowrap}
.sp-chip:hover{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.4);color:#fff}
.sp-stats{display:flex;gap:3rem;justify-content:center;flex-wrap:wrap}
.sp-stat-num{display:block;font-size:2.2rem;font-weight:700;color:#fff}
.sp-stat-lbl{font-size:.85rem;color:#bae6fd;letter-spacing:.5px}

/* ── Section Common ── */
.sp-section{padding:5rem 0}
.sp-container{max-width:1200px;margin:0 auto;padding:0 1.5rem}
.sp-section-hdr{text-align:center;max-width:680px;margin:0 auto 3.5rem}
.sp-tag{display:inline-block;font-size:13px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:#0ea5e9;background:#f0f9ff;padding:6px 16px;border-radius:9999px;margin-bottom:.75rem}
.sp-section-title{font-size:clamp(1.8rem,3.5vw,2.5rem);font-weight:700;color:#0f172a;line-height:1.2;margin-bottom:1rem}
.sp-section-desc{font-size:1rem;color:#64748b;line-height:1.7}

/* ── Fleet Grid ── */
.sp-fleet{background:#fff}
.sp-fleet-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.sp-yacht{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,.08);border:1px solid #f1f5f9;transition:all .3s ease}
.sp-yacht:hover{transform:translateY(-6px);box-shadow:0 10px 40px rgba(0,0,0,.1)}
.sp-yacht-img{position:relative;height:220px;overflow:hidden}
.sp-yacht-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.sp-yacht:hover .sp-yacht-img img{transform:scale(1.08)}
.sp-yacht-info{padding:1.25rem}
.sp-yacht-info h3{font-size:1.1rem;font-weight:600;margin:0 0 .625rem;color:#1e293b}
.sp-yacht-specs{display:flex;gap:1rem;margin-bottom:.875rem;flex-wrap:wrap}
.sp-yacht-specs span{font-size:.8rem;color:#64748b;display:flex;align-items:center;gap:4px}
.sp-yacht-specs svg{width:14px;height:14px;color:#38bdf8;flex-shrink:0}
.sp-yacht-ft{display:flex;justify-content:space-between;align-items:center;padding-top:.875rem;border-top:1px solid #f1f5f9}
.sp-yacht-price{font-weight:600;color:#0284c7;font-size:.95rem}
.sp-yacht-pax{font-size:.8rem;color:#94a3b8}
.sp-filter-bar{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center;margin-bottom:2rem}
.sp-filter-btn{padding:.5rem 1.25rem;border-radius:9999px;border:2px solid #e2e8f0;background:#fff;font-size:.85rem;font-weight:500;cursor:pointer;transition:all .2s;color:#475569;font-family:inherit}
.sp-filter-btn:hover{border-color:#0ea5e9;color:#0ea5e9}
.sp-filter-btn.active{background:#0ea5e9;color:#fff;border-color:#0ea5e9}
.sp-yacht.hidden{display:none}
.sp-btn-fleet{background:#0f172a;color:#fff;box-shadow:0 4px 15px rgba(0,0,0,.15)}
.sp-btn-fleet:hover{background:#1e293b;transform:translateY(-2px)}

/* ── Itinerary Map ── */
.sp-itin{background:#f8fafc}
.sp-itin-layout{display:grid;grid-template-columns:360px 1fr;gap:2rem;min-height:520px}
.sp-itin-sidebar{display:flex;flex-direction:column;gap:.875rem;overflow-y:auto;max-height:520px;padding-right:6px}
.sp-itin-sidebar::-webkit-scrollbar{width:4px}
.sp-itin-sidebar::-webkit-scrollbar-track{background:transparent}
.sp-itin-sidebar::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px}
.sp-itin-card{background:#fff;border-radius:12px;padding:1.125rem;cursor:pointer;transition:all .2s;border:2px solid transparent;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.sp-itin-card:hover{border-color:#bae6fd;box-shadow:0 4px 12px rgba(0,0,0,.08)}
.sp-itin-card.active{border-color:#0ea5e9;background:#f0f9ff;box-shadow:0 4px 20px rgba(14,165,233,.15)}
.sp-itin-hdr{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}
.sp-itin-dur{font-size:.75rem;font-weight:600;color:#0284c7;background:#e0f2fe;padding:3px 10px;border-radius:9999px}
.sp-itin-badge{font-size:.7rem;font-weight:600;color:#c9a84c;letter-spacing:.5px;text-transform:uppercase}
.sp-itin-card h3{font-size:1.05rem;font-weight:600;margin:0 0 4px;color:#1e293b}
.sp-itin-card p{font-size:.82rem;color:#64748b;line-height:1.5;margin:0 0 .625rem}
.sp-itin-tags{display:flex;gap:.75rem;flex-wrap:wrap}
.sp-itin-tags span{font-size:.75rem;color:#64748b;display:flex;align-items:center;gap:4px}
.sp-itin-tags svg{color:#38bdf8;flex-shrink:0}
.sp-itin-map-wrap{position:relative;border-radius:16px;overflow:hidden;box-shadow:0 4px 20px rgba(0,0,0,.1)}
.sp-itin-map{height:100%;min-height:520px;border-radius:16px}
.sp-map-legend{position:absolute;bottom:1rem;left:1rem;z-index:500;background:rgba(255,255,255,.95);backdrop-filter:blur(10px);padding:.75rem 1rem;border-radius:10px;box-shadow:0 2px 10px rgba(0,0,0,.1);display:flex;flex-direction:column;gap:5px}
.sp-legend-item{display:flex;align-items:center;gap:.5rem;font-size:.75rem;color:#475569}
.sp-legend-line{width:20px;height:3px;border-radius:2px;flex-shrink:0}

/* ── Destinations ── */
.sp-dest{background:#0c4a6e;color:#fff}
.sp-dest .sp-tag{background:rgba(14,165,233,.2);color:#7dd3fc}
.sp-dest .sp-section-title{color:#fff}
.sp-dest .sp-section-desc{color:#bae6fd}
.sp-dest-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:280px;gap:1.25rem}
.sp-dest-large{grid-row:span 2}
.sp-dest-card{position:relative;border-radius:16px;overflow:hidden;cursor:default}
.sp-dest-card img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.sp-dest-card:hover img{transform:scale(1.1)}
.sp-dest-ov{position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.7) 0%,transparent 60%);padding:1.5rem;display:flex;flex-direction:column;justify-content:flex-end}
.sp-dest-prov{font-size:.75rem;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:#7dd3fc;margin-bottom:.375rem}
.sp-dest-ov h3{font-size:1.3rem;font-weight:700;margin:0 0 .375rem}
.sp-dest-ov p{font-size:.85rem;color:rgba(255,255,255,.8);line-height:1.5;max-height:0;overflow:hidden;transition:max-height .4s ease}
.sp-dest-card:hover .sp-dest-ov p{max-height:100px}

/* ── Contact ── */
.sp-contact{background:#f8fafc}
.sp-contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.sp-contact-info .sp-section-title{text-align:left}
.sp-contact-info>p{color:#64748b;line-height:1.7;margin-bottom:2rem}
.sp-contact-items{display:flex;flex-direction:column;gap:1.5rem;margin-bottom:2rem}
.sp-contact-item{display:flex;gap:1rem;align-items:flex-start}
.sp-contact-item svg{width:24px;height:24px;color:#0ea5e9;flex-shrink:0;margin-top:2px}
.sp-contact-item h4{font-size:.9rem;font-weight:600;margin:0 0 2px}
.sp-contact-item p{font-size:.88rem;color:#64748b;line-height:1.5;margin:0}
.sp-contact-img{border-radius:16px;overflow:hidden;box-shadow:0 10px 40px rgba(0,0,0,.1)}
.sp-contact-img img{width:100%;height:auto;display:block}
.sp-wa-btn{display:inline-flex;align-items:center;gap:.5rem;background:#25d366;color:#fff;padding:.875rem 2rem;border-radius:9999px;font-weight:600;font-size:1rem;transition:all .3s ease;text-decoration:none}
.sp-wa-btn:hover{background:#20bd5a;transform:translateY(-2px);box-shadow:0 4px 15px rgba(37,211,102,.3)}

/* ── Chat Window ── */
.sp-chatwin{position:fixed;bottom:1.5rem;right:1.5rem;width:400px;max-width:calc(100vw - 2rem);height:560px;max-height:calc(100vh - 3rem);background:#fff;border-radius:16px;box-shadow:0 10px 50px rgba(0,0,0,.2);display:flex;flex-direction:column;z-index:9999;transform:translateY(20px) scale(.95);opacity:0;pointer-events:none;transition:all .3s cubic-bezier(.4,0,.2,1)}
.sp-chatwin.open{transform:translateY(0) scale(1);opacity:1;pointer-events:auto}
.sp-chatwin-hdr{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;background:#0c4a6e;color:#fff;border-radius:16px 16px 0 0;flex-shrink:0}
.sp-chatwin-title{display:flex;align-items:center;gap:.5rem;font-weight:600;font-size:.95rem}
.sp-chatwin-close{background:none;border:none;color:rgba(255,255,255,.7);font-size:1.5rem;cursor:pointer;padding:0;line-height:1;transition:color .2s}
.sp-chatwin-close:hover{color:#fff}
.sp-chatwin-msgs{flex:1;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:.75rem}
.sp-chatwin-msgs::-webkit-scrollbar{width:4px}
.sp-chatwin-msgs::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px}
.sp-cmsg{max-width:85%;padding:.75rem 1rem;border-radius:12px;font-size:.9rem;line-height:1.5;word-wrap:break-word;white-space:pre-wrap}
.sp-cmsg-user{align-self:flex-end;background:#0ea5e9;color:#fff;border-bottom-right-radius:4px}
.sp-cmsg-assistant{align-self:flex-start;background:#f1f5f9;color:#1e293b;border-bottom-left-radius:4px}
.sp-typing span{display:inline-block;width:8px;height:8px;background:#94a3b8;border-radius:50%;margin:0 2px;animation:sp-bounce .6s infinite alternate}
.sp-typing span:nth-child(2){animation-delay:.2s}
.sp-typing span:nth-child(3){animation-delay:.4s}
@keyframes sp-bounce{0%{transform:translateY(0)}100%{transform:translateY(-6px)}}
.sp-chatwin-input{display:flex;gap:.5rem;padding:.75rem 1rem;border-top:1px solid #f1f5f9;flex-shrink:0}
.sp-chatwin-input input{flex:1;border:1px solid #e2e8f0;border-radius:9999px;padding:.625rem 1rem;font-size:.9rem;font-family:inherit;outline:none;transition:border-color .2s}
.sp-chatwin-input input:focus{border-color:#0ea5e9}
.sp-chatwin-input button{width:38px;height:38px;border-radius:50%;background:#0ea5e9;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#fff;transition:background .2s;flex-shrink:0}
.sp-chatwin-input button:hover{background:#0284c7}

/* Chat message buttons */
.sp-cmsg-btns{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.75rem}
.sp-cmsg-btn{background:#fff;color:#0c4a6e;border:1.5px solid #0ea5e9;border-radius:9999px;padding:.4rem 1rem;font-size:.85rem;font-family:inherit;font-weight:500;cursor:pointer;transition:all .2s}
.sp-cmsg-btn:hover{background:#0ea5e9;color:#fff}
.sp-cmsg-btn.picked{background:#0ea5e9;color:#fff;border-color:#0ea5e9}
.sp-cmsg-btn.used{opacity:.5;cursor:default;pointer-events:none}

/* Chat FAB */
.sp-chat-fab{position:fixed;bottom:1.5rem;right:1.5rem;width:56px;height:56px;border-radius:50%;background:#0ea5e9;color:#fff;border:none;cursor:pointer;box-shadow:0 4px 20px rgba(14,165,233,.4);display:flex;align-items:center;justify-content:center;z-index:9998;transition:all .3s}
.sp-chat-fab:hover{background:#0284c7;transform:scale(1.08)}
.sp-chat-fab.hidden{opacity:0;pointer-events:none;transform:scale(.5)}

/* ── Responsive ── */
@media(max-width:1024px){
.sp-fleet-grid{grid-template-columns:repeat(2,1fr)}
.sp-dest-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:220px}
.sp-dest-large{grid-column:span 2}
.sp-contact-grid{gap:2.5rem}
.sp-itin-layout{grid-template-columns:1fr}
.sp-itin-sidebar{flex-direction:row;overflow-x:auto;overflow-y:visible;max-height:none;padding-right:0;padding-bottom:6px}
.sp-itin-card{min-width:280px;flex-shrink:0}
.sp-itin-map{min-height:450px}
}
@media(max-width:768px){
/* Sections */
.sp-section{padding:2.5rem 0}
.sp-container{padding:0 1rem}
.sp-section-hdr{margin-bottom:2rem}
.sp-section-title{font-size:1.5rem;margin-bottom:.625rem}
.sp-section-desc{font-size:.9rem}
.sp-tag{font-size:11px;padding:4px 12px;letter-spacing:1.5px}

/* Hero */
.sp-hero{min-height:75vh;min-height:75svh}
.sp-hero-content{padding:0 1rem}
.sp-hero h1{font-size:1.75rem;margin-bottom:1rem}
.sp-hero-desc{font-size:.9rem;margin-bottom:1.5rem;line-height:1.6}
.sp-hero-chat{margin-bottom:2rem}
.sp-chat-input-wrap{padding:.25rem .25rem .25rem 1rem}
.sp-chat-field{font-size:.9rem}
.sp-chat-send{width:38px;height:38px}
.sp-chat-chips{gap:.375rem;margin-top:.75rem}
.sp-chip{font-size:.75rem;padding:.3rem .75rem}
.sp-stats{gap:1.5rem}
.sp-stat-num{font-size:1.75rem}
.sp-stat-lbl{font-size:.75rem}

/* Fleet */
.sp-fleet-grid{grid-template-columns:1fr;gap:1rem}
.sp-yacht-img{height:200px}
.sp-yacht-info{padding:1rem}
.sp-yacht-info h3{font-size:1rem}
.sp-yacht-specs{gap:.625rem;margin-bottom:.625rem}
.sp-filter-bar{gap:.375rem;margin-bottom:1.25rem}
.sp-filter-btn{padding:.4375rem 1rem;font-size:.8rem}

/* Destinations */
.sp-dest-grid{grid-template-columns:1fr;grid-auto-rows:180px}
.sp-dest-large{grid-column:span 1;grid-row:span 1}
.sp-dest-ov{padding:1rem}
.sp-dest-ov h3{font-size:1.1rem}
.sp-dest-prov{font-size:.7rem}

/* Itinerary */
.sp-itin-sidebar{gap:.625rem;padding-bottom:8px;-webkit-overflow-scrolling:touch}
.sp-itin-card{min-width:260px;padding:.875rem}
.sp-itin-card h3{font-size:.95rem}
.sp-itin-card p{font-size:.8rem}
.sp-itin-map{min-height:300px}
.sp-map-legend{bottom:.5rem;left:.5rem;padding:.5rem .75rem}

/* Contact */
.sp-contact-grid{grid-template-columns:1fr;gap:1.5rem}
.sp-contact-info .sp-section-title{text-align:center;font-size:1.4rem}
.sp-contact-info>p{text-align:center;font-size:.9rem;margin-bottom:1.25rem}
.sp-contact-items{gap:1rem;margin-bottom:1.25rem}
.sp-wa-btn{width:100%;justify-content:center;padding:.75rem 1.5rem;font-size:.95rem}

/* Chat Window mobile */
.sp-chatwin{bottom:0;right:0;width:100%;max-width:100%;height:100%;max-height:100%;border-radius:0}
.sp-chatwin-hdr{border-radius:0}
.sp-chat-fab{bottom:1rem;right:1rem;width:50px;height:50px}
}

/* Small phones */
@media(max-width:380px){
.sp-hero h1{font-size:1.5rem}
.sp-hero-desc{font-size:.85rem}
.sp-stat-num{font-size:1.5rem}
.sp-yacht-img{height:180px}
.sp-itin-card{min-width:240px}
}
