.line-clamp-1 { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
.line-clamp-2 { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.input { width:100%; border:1px solid rgb(203 213 225); border-radius:1rem; padding:.75rem 1rem; background:white; transition:border-color .18s ease, box-shadow .18s ease, background-color .18s ease; }
.input:focus { outline:2px solid rgb(14 165 233 / .25); border-color:rgb(14 165 233); }
.label { display:block; margin-bottom:.4rem; font-size:.875rem; font-weight:700; color:rgb(51 65 85); }
.btn { display:inline-flex; align-items:center; justify-content:center; border-radius:999px; padding:.75rem 1.1rem; font-weight:800; transition:transform .18s ease, box-shadow .18s ease, background-color .18s ease, color .18s ease, border-color .18s ease; }
.btn:hover { transform: translateY(-1px); }
.btn-primary { background:linear-gradient(135deg, rgb(2 132 199), rgb(14 165 233)); color:white; box-shadow:0 12px 24px rgb(2 132 199 / .22); }
.btn-primary:hover { background:rgb(3 105 161); }
.btn-dark { background:rgb(15 23 42); color:white; }
.btn-light { background:white; color:rgb(15 23 42); border:1px solid rgb(203 213 225); }
.card { border:1px solid rgb(226 232 240); border-radius:1.5rem; background:white; box-shadow:0 1px 2px rgb(15 23 42 / .05); }
.file-drop { min-height: 12rem; }
.file-drop input:focus-visible + span { outline: 2px solid rgb(14 165 233 / .35); }

[x-cloak] { display: none !important; }

/* Phase 31 mobile/PWA polish */
.safe-bottom { padding-bottom: env(safe-area-inset-bottom); }
.mobile-sticky-action { position: sticky; bottom: 0; z-index: 30; padding: .75rem; padding-bottom: calc(.75rem + env(safe-area-inset-bottom)); background: rgb(255 255 255 / .92); backdrop-filter: blur(12px); border-top: 1px solid rgb(226 232 240); }
.touch-target { min-height: 44px; min-width: 44px; }
@media (max-width: 640px) {
  .btn { min-height: 44px; padding: .75rem 1rem; }
  .card { border-radius: 1.25rem; }
  input, select, textarea { font-size: 16px; }
  table.mobile-stack, table.mobile-stack thead, table.mobile-stack tbody, table.mobile-stack th, table.mobile-stack td, table.mobile-stack tr { display:block; }
  table.mobile-stack thead { display:none; }
  table.mobile-stack tr { border-bottom:1px solid rgb(226 232 240); padding:.75rem; }
  table.mobile-stack td { padding:.35rem 0; }
}


/* Phase A public UI polish */
.public-shell { background: radial-gradient(circle at top left, rgb(224 242 254 / .65), transparent 34rem), linear-gradient(180deg, #ffffff 0%, rgb(248 250 252) 100%); }
.public-section { padding-block: 4rem; }
.eyebrow { display:inline-flex; align-items:center; gap:.45rem; border-radius:999px; background:rgb(224 242 254); color:rgb(3 105 161); padding:.35rem .8rem; font-size:.75rem; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.premium-card { position:relative; overflow:hidden; border:1px solid rgb(226 232 240); border-radius:1.75rem; background:linear-gradient(180deg,#fff, rgb(248 250 252)); box-shadow:0 18px 45px rgb(15 23 42 / .07); transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease; }
.premium-card:hover { transform:translateY(-3px); border-color:rgb(125 211 252); box-shadow:0 24px 60px rgb(15 23 42 / .12); }
.soft-badge { display:inline-flex; align-items:center; gap:.4rem; border-radius:999px; background:rgb(248 250 252 / .92); color:rgb(15 23 42); padding:.35rem .7rem; font-size:.75rem; font-weight:900; box-shadow:0 10px 24px rgb(15 23 42 / .12); }
.trust-pill { display:flex; align-items:flex-start; gap:.75rem; border-radius:1.25rem; border:1px solid rgb(226 232 240); background:rgb(255 255 255 / .9); padding:1rem; box-shadow:0 10px 30px rgb(15 23 42 / .06); }
.card-arrow { display:inline-flex; align-items:center; justify-content:center; height:2.25rem; width:2.25rem; border-radius:999px; background:rgb(224 242 254); color:rgb(3 105 161); font-weight:900; transition:transform .2s ease, background-color .2s ease; }
.premium-card:hover .card-arrow { transform:translateX(2px); background:rgb(14 165 233); color:white; }
.empty-state { border:1px dashed rgb(203 213 225); border-radius:1.75rem; background:linear-gradient(180deg, #fff, rgb(248 250 252)); padding:2rem; color:rgb(71 85 105); }
.form-panel { border:1px solid rgb(226 232 240); border-radius:2rem; background:linear-gradient(180deg,#fff, rgb(248 250 252)); box-shadow:0 24px 70px rgb(15 23 42 / .09); }
.form-section-title { display:flex; align-items:center; gap:.65rem; font-size:.85rem; font-weight:900; color:rgb(15 23 42); text-transform:uppercase; letter-spacing:.06em; }

/* Phase B boat listing and search UX polish */
.boats-hero { box-shadow: inset 0 -1px 0 rgb(255 255 255 / .08); }
.filter-panel { border:1px solid rgb(226 232 240); border-radius:1.75rem; background:linear-gradient(180deg,#fff, rgb(248 250 252)); box-shadow:0 18px 50px rgb(15 23 42 / .08); overflow:hidden; }
.filter-summary { display:flex; align-items:center; justify-content:space-between; gap:1rem; cursor:pointer; padding:1rem 1.25rem; font-weight:900; color:rgb(15 23 42); background:white; border-bottom:1px solid rgb(226 232 240); list-style:none; }
.filter-summary::-webkit-details-marker { display:none; }
.filter-summary span { border-radius:999px; background:rgb(224 242 254); color:rgb(3 105 161); padding:.25rem .65rem; font-size:.75rem; font-weight:900; }
.filter-chip { display:inline-flex; align-items:center; gap:.45rem; border-radius:999px; background:rgb(224 242 254); color:rgb(3 105 161); padding:.45rem .8rem; font-size:.8rem; font-weight:900; box-shadow:0 8px 18px rgb(2 132 199 / .10); }
.filter-chip span { display:inline-flex; align-items:center; justify-content:center; height:1.15rem; width:1.15rem; border-radius:999px; background:rgb(255 255 255 / .75); }
.pagination-pill { display:inline-flex; align-items:center; justify-content:center; border-radius:999px; border:1px solid rgb(226 232 240); background:white; padding:.65rem 1rem; font-size:.875rem; font-weight:900; color:rgb(15 23 42); box-shadow:0 8px 18px rgb(15 23 42 / .05); }
.pagination-pill:hover { border-color:rgb(125 211 252); color:rgb(3 105 161); }
@media (min-width: 1024px) {
  .filter-panel summary { cursor:default; }
}

/* Phase C boat detail conversion polish */
.boat-detail-hero { background: radial-gradient(circle at top left, rgb(224 242 254 / .55), transparent 32rem); }
.detail-badge { display:inline-flex; align-items:center; gap:.35rem; border-radius:999px; background:rgb(248 250 252); color:rgb(15 23 42); padding:.45rem .8rem; font-size:.78rem; font-weight:900; border:1px solid rgb(226 232 240); box-shadow:0 8px 20px rgb(15 23 42 / .05); }
.detail-badge-gold { background:rgb(254 243 199); color:rgb(146 64 14); border-color:rgb(253 230 138); }
.boat-gallery-grid { display:grid; gap:1rem; }
.boat-gallery-main { position:relative; min-height:26rem; overflow:hidden; border-radius:2rem; background:rgb(226 232 240); box-shadow:0 24px 70px rgb(15 23 42 / .14); }
.boat-gallery-thumbs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.boat-thumb { height:8.5rem; overflow:hidden; border-radius:1.5rem; background:rgb(226 232 240); border:1px solid rgb(226 232 240); transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.boat-thumb:hover { transform:translateY(-2px); border-color:rgb(125 211 252); box-shadow:0 18px 38px rgb(15 23 42 / .12); }
.detail-stat-grid { display:grid; gap:1rem; grid-template-columns:repeat(2,minmax(0,1fr)); }
.detail-stat { border:1px solid rgb(226 232 240); border-radius:1.5rem; background:linear-gradient(180deg,#fff,rgb(248 250 252)); padding:1.1rem; box-shadow:0 14px 35px rgb(15 23 42 / .06); }
.detail-stat span { display:block; color:rgb(100 116 139); font-size:.85rem; font-weight:800; }
.detail-stat strong { display:block; margin-top:.3rem; color:rgb(15 23 42); font-size:1.05rem; font-weight:950; }
.amenity-pill { display:flex; align-items:center; gap:.65rem; border-radius:1.25rem; background:rgb(248 250 252); color:rgb(51 65 85); padding:.85rem 1rem; font-weight:800; border:1px solid rgb(226 232 240); }
.amenity-pill span { display:inline-flex; align-items:center; justify-content:center; width:1.45rem; height:1.45rem; border-radius:999px; background:rgb(220 252 231); color:rgb(4 120 87); font-weight:900; }
.detail-info-panel { border:1px solid rgb(226 232 240); border-radius:1.5rem; background:rgb(248 250 252); padding:1.1rem; }
.booking-summary-card, .booking-panel { border:1px solid rgb(226 232 240); border-radius:1.75rem; background:linear-gradient(180deg,#fff,rgb(248 250 252)); box-shadow:0 24px 70px rgb(15 23 42 / .10); }
.booking-summary-card { padding:1.5rem; }
.booking-panel { overflow:hidden; }
.booking-panel .btn-primary { box-shadow:0 16px 34px rgb(2 132 199 / .24); }
@media (min-width: 1024px) {
  .boat-gallery-grid { grid-template-columns:minmax(0,1fr) 20rem; }
  .boat-gallery-thumbs { grid-template-columns:1fr; }
  .detail-stat-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media (max-width: 640px) {
  .boat-gallery-main { min-height:20rem; border-radius:1.5rem; }
  .boat-thumb { height:6.5rem; border-radius:1.1rem; }
  .detail-stat-grid { grid-template-columns:1fr; }
}

/* Phase G trust and conversion improvements */
.trust-conversion-strip { border:1px solid rgb(186 230 253); border-radius:2rem; background:linear-gradient(135deg, rgb(240 249 255), #fff 55%, rgb(248 250 252)); box-shadow:0 22px 60px rgb(14 165 233 / .10); overflow:hidden; }
.trust-conversion-item { display:flex; gap:.9rem; align-items:flex-start; padding:1rem; border-radius:1.25rem; background:rgb(255 255 255 / .74); border:1px solid rgb(226 232 240); }
.trust-conversion-icon { display:inline-flex; align-items:center; justify-content:center; width:2.55rem; height:2.55rem; border-radius:999px; background:rgb(224 242 254); color:rgb(3 105 161); font-weight:950; flex:0 0 auto; }
.how-it-works-card { position:relative; border:1px solid rgb(226 232 240); border-radius:1.75rem; background:linear-gradient(180deg,#fff,rgb(248 250 252)); padding:1.5rem; box-shadow:0 18px 45px rgb(15 23 42 / .07); }
.how-step-number { display:inline-flex; align-items:center; justify-content:center; width:2.3rem; height:2.3rem; border-radius:999px; background:rgb(15 23 42); color:white; font-weight:950; }
.booking-confidence-note { border:1px solid rgb(186 230 253); border-radius:1.5rem; background:rgb(240 249 255); color:rgb(12 74 110); padding:1rem; font-size:.9rem; line-height:1.6; }
.trust-faq-card { border:1px solid rgb(226 232 240); border-radius:1.5rem; background:white; padding:1rem; box-shadow:0 12px 30px rgb(15 23 42 / .05); }
.trust-faq-card summary { cursor:pointer; font-weight:950; color:rgb(15 23 42); list-style:none; display:flex; justify-content:space-between; gap:1rem; }
.trust-faq-card summary::-webkit-details-marker { display:none; }
.trust-faq-card summary::after { content:'+'; color:rgb(3 105 161); font-weight:950; }
.trust-faq-card[open] summary::after { content:'–'; }
.footer-trust-note { border:1px solid rgb(255 255 255 / .10); border-radius:1.25rem; background:rgb(255 255 255 / .06); padding:1rem; }
.owner-confidence-list { display:grid; gap:.75rem; }
.owner-confidence-list li { display:flex; gap:.75rem; align-items:flex-start; border-radius:1.25rem; background:rgb(248 250 252); border:1px solid rgb(226 232 240); padding:.95rem; }
.owner-confidence-list li span { display:inline-flex; align-items:center; justify-content:center; width:1.6rem; height:1.6rem; border-radius:999px; background:rgb(220 252 231); color:rgb(4 120 87); font-weight:950; flex:0 0 auto; }
