/* styles.css — boat.mt v4 — Single source of truth for nav + shared styles */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,wght@0,300;0,500;0,700;1,300&family=DM+Sans:wght@300;400;500;600&display=swap');

:root {
  --navy:#0a1628; --deep:#0d2045; --ocean:#1a4a7a; --blue:#2271b3;
  --sky:#4a9fd4; --aqua:#00c2cb; --sand:#f5e6c8; --cream:#faf8f3;
  --white:#fff; --gray:#6b7b8d; --light:#e8eef5; --text:#1a2535;
  --red:#e53e3e; --green:#38a169; --yellow:#d69e2e; --nav-h:64px;
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
body { font-family:'DM Sans',sans-serif; background:var(--cream); color:var(--text); overflow-x:hidden; }

/* ═══════════════════════════════════════════════ */


.page-wrap { padding-top:var(--nav-h); min-height:100vh; }

/* =====================================================
   LAYOUT
   ===================================================== */
.section { padding:4rem 5%; }
.section-sm { padding:2.5rem 5%; }
.section-white { background:var(--white); }
.section-navy { background:var(--navy); color:white; }
.section-cream { background:var(--cream); }
.container { max-width:1200px; margin:0 auto; }
.container-sm { max-width:800px; margin:0 auto; }

/* =====================================================
   TYPOGRAPHY
   ===================================================== */
.section-label { font-size:0.72rem; font-weight:600; letter-spacing:0.12em; text-transform:uppercase; color:var(--aqua); margin-bottom:0.5rem; }
h1.display { font-family:'Fraunces',serif; font-size:clamp(2.4rem,5vw,4rem); font-weight:700; line-height:1.05; letter-spacing:-0.03em; }
h2.section-title { font-family:'Fraunces',serif; font-size:clamp(1.6rem,3vw,2.4rem); font-weight:700; line-height:1.15; letter-spacing:-0.02em; color:var(--navy); }
h3.card-title { font-family:'Fraunces',serif; font-size:1.05rem; font-weight:700; color:var(--navy); line-height:1.2; }

/* =====================================================
   BUTTONS
   ===================================================== */
.btn { display:inline-flex; align-items:center; gap:0.4rem; padding:0.65rem 1.3rem; border-radius:10px; border:none; font-family:'DM Sans',sans-serif; font-size:0.88rem; font-weight:500; cursor:pointer; text-decoration:none; transition:all 0.15s; }
.btn-navy { background:var(--navy); color:white; }
.btn-navy:hover { background:var(--ocean); transform:translateY(-1px); }
.btn-aqua { background:var(--aqua); color:var(--navy); font-weight:600; }
.btn-aqua:hover { opacity:0.9; transform:translateY(-1px); }
.btn-outline { background:transparent; color:var(--navy); border:1.5px solid var(--light); }
.btn-outline:hover { border-color:var(--navy); background:var(--navy); color:white; }
.btn-red { background:var(--red); color:white; }
.btn-green { background:var(--green); color:white; }
.btn-ghost { background:rgba(255,255,255,0.1); color:white; border:1px solid rgba(255,255,255,0.15); }
.btn-ghost:hover { background:rgba(255,255,255,0.2); }
.btn-lg { padding:0.85rem 1.75rem; font-size:1rem; border-radius:12px; }
.btn-sm { padding:0.35rem 0.8rem; font-size:0.78rem; border-radius:7px; }
.btn-block { width:100%; justify-content:center; }
.btn:disabled { opacity:0.5; cursor:not-allowed; transform:none !important; }

/* =====================================================
   CARDS
   ===================================================== */
.card { background:white; border-radius:16px; border:1.5px solid var(--light); overflow:hidden; transition:all 0.25s; text-decoration:none; color:var(--text); display:flex; flex-direction:column; }
.card:hover { border-color:var(--sky); transform:translateY(-3px); box-shadow:0 12px 32px rgba(10,22,40,0.1); }
.card.featured { border-color:var(--aqua); }
.card-image { position:relative; overflow:hidden; background:var(--light); }
.card-image img { width:100%; height:100%; object-fit:cover; transition:transform 0.4s; display:block; }
.card:hover .card-image img { transform:scale(1.04); }
.card-body { padding:1.25rem; flex:1; display:flex; flex-direction:column; }
.card-footer { padding:1rem 1.25rem; border-top:1px solid var(--light); display:flex; justify-content:space-between; align-items:center; }

/* =====================================================
   BADGES
   ===================================================== */
.badge { display:inline-flex; align-items:center; padding:0.25rem 0.65rem; border-radius:100px; font-size:0.72rem; font-weight:600; }
.badge-aqua { background:rgba(0,194,203,0.12); color:var(--aqua); }
.badge-navy { background:var(--navy); color:white; }
.badge-green { background:rgba(56,161,105,0.12); color:var(--green); }
.badge-red { background:rgba(229,62,62,0.12); color:var(--red); }
.badge-yellow { background:rgba(214,158,46,0.12); color:var(--yellow); }
.badge-gray { background:var(--light); color:var(--gray); }
.badge-featured { background:var(--aqua); color:var(--navy); position:absolute; top:0.75rem; left:0.75rem; }

/* =====================================================
   FORMS
   ===================================================== */
.form-group { margin-bottom:1.25rem; }
.form-group label { display:block; font-size:0.8rem; font-weight:500; color:var(--gray); margin-bottom:0.35rem; }
.form-control { width:100%; padding:0.7rem 1rem; border:1.5px solid var(--light); border-radius:10px; font-family:'DM Sans',sans-serif; font-size:0.9rem; color:var(--text); outline:none; transition:border-color 0.2s; background:white; }
.form-control:focus { border-color:var(--aqua); }
.form-control::placeholder { color:rgba(107,123,141,0.6); }
textarea.form-control { resize:vertical; min-height:100px; }
select.form-control { cursor:pointer; }
.form-grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.form-grid-3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:1rem; }
.form-error { color:var(--red); font-size:0.8rem; margin-top:0.3rem; }
.form-hint { color:var(--gray); font-size:0.78rem; margin-top:0.3rem; }

/* =====================================================
   TOGGLE SWITCH
   ===================================================== */
.toggle-wrap { display:flex; align-items:center; gap:0.75rem; }
.toggle { position:relative; width:44px; height:24px; flex-shrink:0; }
.toggle input { opacity:0; width:0; height:0; }
.toggle-slider { position:absolute; inset:0; background:var(--light); border-radius:24px; cursor:pointer; transition:background 0.2s; }
.toggle-slider::before { content:''; position:absolute; width:18px; height:18px; left:3px; bottom:3px; background:white; border-radius:50%; transition:transform 0.2s; box-shadow:0 1px 4px rgba(0,0,0,0.2); }
.toggle input:checked + .toggle-slider { background:var(--aqua); }
.toggle input:checked + .toggle-slider::before { transform:translateX(20px); }

/* =====================================================
   FAV BUTTON
   ===================================================== */
.fav-btn { position:absolute; top:0.75rem; right:0.75rem; width:36px; height:36px; border-radius:50%; background:rgba(255,255,255,0.9); border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:1rem; transition:all 0.2s; z-index:2; }
.fav-btn:hover { transform:scale(1.1); background:white; }
.fav-btn.active { color:var(--red); }

/* =====================================================
   TOAST
   ===================================================== */
.toast { position:fixed; bottom:1.5rem; right:1.5rem; background:var(--navy); color:white; padding:0.75rem 1.25rem; border-radius:10px; font-size:0.88rem; z-index:9999; opacity:0; transform:translateY(8px); transition:all 0.3s; pointer-events:none; }
.toast.show { opacity:1; transform:translateY(0); }
.toast.success { background:var(--green); }
.toast.error { background:var(--red); }

/* =====================================================
   LOADING SKELETON
   ===================================================== */
.skeleton { background:linear-gradient(90deg,var(--light) 0%,#d5dee8 50%,var(--light) 100%); background-size:200% 100%; animation:shimmer 1.5s infinite; border-radius:8px; }
@keyframes shimmer { 0%{background-position:200% 0} 100%{background-position:-200% 0} }

/* =====================================================
   EMPTY STATE
   ===================================================== */
.empty-state { text-align:center; padding:4rem 2rem; }
.empty-state .icon { font-size:3rem; margin-bottom:1rem; }
.empty-state h3 { font-family:'Fraunces',serif; color:var(--navy); margin-bottom:0.5rem; }
.empty-state p { color:var(--gray); font-size:0.9rem; margin-bottom:1.5rem; }

/* =====================================================
   GRID LAYOUTS
   ===================================================== */
.grid-3 { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:1.5rem; }
.grid-4 { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:1.25rem; }
.grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }

/* =====================================================
   FOOTER
   ===================================================== */
footer { background:var(--navy); color:rgba(255,255,255,0.6); }
.footer-grid { display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:2rem; margin-bottom:2rem; }
.footer-brand p { font-size:0.85rem; line-height:1.6; margin-top:0.75rem; }
.footer-col h4 { color:white; font-size:0.78rem; font-weight:600; letter-spacing:0.08em; text-transform:uppercase; margin-bottom:1rem; }
.footer-col a { display:block; color:rgba(255,255,255,0.5); text-decoration:none; font-size:0.85rem; margin-bottom:0.5rem; transition:color 0.2s; }
.footer-col a:hover { color:var(--aqua); }
.footer-bottom { border-top:1px solid rgba(255,255,255,0.08); padding-top:1.5rem; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:0.5rem; font-size:0.8rem; }
.footer-bottom a { color:var(--aqua); text-decoration:none; }

/* =====================================================
   RESPONSIVE
   ===================================================== */
@media (max-width:900px) {
  .nav-links { display:none; }
  
  .form-grid-2, .form-grid-3 { grid-template-columns:1fr; }
  .grid-2 { grid-template-columns:1fr; }
}
@media (max-width:480px) {
  .section { padding:3rem 4%; }
  .footer-grid { grid-template-columns:1fr; }
}

/* =====================================================
   UTILS
   ===================================================== */
.text-center { text-align:center; }
.text-gray { color:var(--gray); }
.text-aqua { color:var(--aqua); }
.text-navy { color:var(--navy); }
.mt-1{margin-top:0.5rem}.mt-2{margin-top:1rem}.mt-3{margin-top:1.5rem}.mt-4{margin-top:2rem}
.mb-1{margin-bottom:0.5rem}.mb-2{margin-bottom:1rem}.mb-3{margin-bottom:1.5rem}.mb-4{margin-bottom:2rem}
.gap-1{gap:0.5rem}.gap-2{gap:1rem}
.flex{display:flex}.flex-center{display:flex;align-items:center;justify-content:center}
.flex-between{display:flex;align-items:center;justify-content:space-between}
.flex-wrap{flex-wrap:wrap}
.stars{color:#f6c90e;letter-spacing:0.05em}
.stars-empty{color:var(--light)}/* ═══ NAV ════════════════════════════════════════════════════════════════ */
html { overflow-x: hidden; }
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 9000;
  background: rgba(10,22,40,0.97); backdrop-filter: blur(12px);
  padding: 0 5%; display: flex; align-items: center; justify-content: space-between;
  height: 64px; border-bottom: 1px solid rgba(255,255,255,0.07);
}
.nav-logo { font-family:'Fraunces',serif; font-size:1.5rem; font-weight:700; color:#fff; text-decoration:none; letter-spacing:-0.02em; flex-shrink:0; }
.nav-logo span { color:#00c2cb; }
.nav-links { display:flex; gap:0; list-style:none; align-items:center; }
.nav-links > li { position:relative; }
.nav-links > li > a,
.nav-links > li > .nav-drop-trigger {
  color:rgba(255,255,255,0.75); text-decoration:none; font-size:0.85rem; font-weight:400;
  transition:color 0.2s; padding:0 0.85rem; height:64px;
  display:flex; align-items:center; gap:0.25rem;
  cursor:pointer; border:none; background:none; font-family:'DM Sans',sans-serif;
}
.nav-links > li > a:hover,
.nav-links > li > .nav-drop-trigger:hover { color:#00c2cb; }
.nav-links > li > a.active { color:#00c2cb; }
.nav-dropdown { position:relative; }
.nav-drop-trigger::after { content:'▾'; font-size:0.65rem; opacity:0.6; }
.nav-drop-menu {
  position:absolute; top:64px; left:0;
  background:#0a1628; border:1px solid rgba(255,255,255,0.1);
  border-radius:12px; padding:0.5rem; min-width:200px;
  box-shadow:0 12px 40px rgba(0,0,0,0.4);
  opacity:0; visibility:hidden; pointer-events:none;
  transform:translateY(-6px);
  transition:opacity 0.15s, visibility 0.15s, transform 0.15s;
  z-index:9100;
}
.nav-dropdown:hover .nav-drop-menu { opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0); }
.nav-drop-menu a { display:flex; align-items:center; gap:0.6rem; padding:0.6rem 0.85rem; border-radius:8px; color:rgba(255,255,255,0.7) !important; text-decoration:none; font-size:0.83rem; transition:all 0.12s; white-space:nowrap; }
.nav-drop-menu a:hover { background:rgba(255,255,255,0.08); color:white !important; }
.nav-drop-menu .drop-divider { height:1px; background:rgba(255,255,255,0.08); margin:0.4rem 0.5rem; }
.nav-drop-menu .drop-label { font-size:0.65rem; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; color:rgba(255,255,255,0.3); padding:0.4rem 0.85rem 0.2rem; }
.nav-cta { background:#00c2cb !important; color:#0a1628 !important; padding:0.4rem 1rem !important; border-radius:8px !important; font-weight:600 !important; height:auto !important; margin-left:0.5rem; }
.nav-avatar { width:34px; height:34px; border-radius:50%; background:#1a4a7a; color:white; border:2px solid rgba(255,255,255,0.2); display:flex; align-items:center; justify-content:center; font-size:0.8rem; font-weight:600; cursor:pointer; margin-left:0.5rem; }
.nav-mobile-btn { display:none; background:none; border:none; color:white; font-size:1.5rem; cursor:pointer; padding:0.4rem; line-height:1; }
@media (max-width:900px) { .nav-links { display:none; } .nav-mobile-btn { display:block; } }
.page-wrap { padding-top:64px; min-height:100vh; }
/* ═══ END NAV ══════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,wght@0,300;0,500;0,700;1,300&family=DM+Sans:wght@300;400;500;600&display=swap');

:root {
  --navy:#0a1628; --deep:#0d2045; --ocean:#1a4a7a; --blue:#2271b3;
  --sky:#4a9fd4; --aqua:#00c2cb; --sand:#f5e6c8; --cream:#faf8f3;
  --white:#fff; --gray:#6b7b8d; --light:#e8eef5; --text:#1a2535;
  --red:#e53e3e; --green:#38a169; --yellow:#d69e2e; --nav-h:64px;
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
body { font-family:'DM Sans',sans-serif; background:var(--cream); color:var(--text); overflow-x:hidden; }

.page-wrap { padding-top:var(--nav-h); min-height:100vh; }

/* =====================================================
   LAYOUT
   ===================================================== */
.section { padding:4rem 5%; }
.section-sm { padding:2.5rem 5%; }
.section-white { background:var(--white); }
.section-navy { background:var(--navy); color:white; }
.section-cream { background:var(--cream); }
.container { max-width:1200px; margin:0 auto; }
.container-sm { max-width:800px; margin:0 auto; }

/* =====================================================
   TYPOGRAPHY
   ===================================================== */
.section-label { font-size:0.72rem; font-weight:600; letter-spacing:0.12em; text-transform:uppercase; color:var(--aqua); margin-bottom:0.5rem; }
h1.display { font-family:'Fraunces',serif; font-size:clamp(2.4rem,5vw,4rem); font-weight:700; line-height:1.05; letter-spacing:-0.03em; }
h2.section-title { font-family:'Fraunces',serif; font-size:clamp(1.6rem,3vw,2.4rem); font-weight:700; line-height:1.15; letter-spacing:-0.02em; color:var(--navy); }
h3.card-title { font-family:'Fraunces',serif; font-size:1.05rem; font-weight:700; color:var(--navy); line-height:1.2; }

/* =====================================================
   BUTTONS
   ===================================================== */
.btn { display:inline-flex; align-items:center; gap:0.4rem; padding:0.65rem 1.3rem; border-radius:10px; border:none; font-family:'DM Sans',sans-serif; font-size:0.88rem; font-weight:500; cursor:pointer; text-decoration:none; transition:all 0.15s; }
.btn-navy { background:var(--navy); color:white; }
.btn-navy:hover { background:var(--ocean); transform:translateY(-1px); }
.btn-aqua { background:var(--aqua); color:var(--navy); font-weight:600; }
.btn-aqua:hover { opacity:0.9; transform:translateY(-1px); }
.btn-outline { background:transparent; color:var(--navy); border:1.5px solid var(--light); }
.btn-outline:hover { border-color:var(--navy); background:var(--navy); color:white; }
.btn-red { background:var(--red); color:white; }
.btn-green { background:var(--green); color:white; }
.btn-ghost { background:rgba(255,255,255,0.1); color:white; border:1px solid rgba(255,255,255,0.15); }
.btn-ghost:hover { background:rgba(255,255,255,0.2); }
.btn-lg { padding:0.85rem 1.75rem; font-size:1rem; border-radius:12px; }
.btn-sm { padding:0.35rem 0.8rem; font-size:0.78rem; border-radius:7px; }
.btn-block { width:100%; justify-content:center; }
.btn:disabled { opacity:0.5; cursor:not-allowed; transform:none !important; }

/* =====================================================
   CARDS
   ===================================================== */
.card { background:white; border-radius:16px; border:1.5px solid var(--light); overflow:hidden; transition:all 0.25s; text-decoration:none; color:var(--text); display:flex; flex-direction:column; }
.card:hover { border-color:var(--sky); transform:translateY(-3px); box-shadow:0 12px 32px rgba(10,22,40,0.1); }
.card.featured { border-color:var(--aqua); }
.card-image { position:relative; overflow:hidden; background:var(--light); }
.card-image img { width:100%; height:100%; object-fit:cover; transition:transform 0.4s; display:block; }
.card:hover .card-image img { transform:scale(1.04); }
.card-body { padding:1.25rem; flex:1; display:flex; flex-direction:column; }
.card-footer { padding:1rem 1.25rem; border-top:1px solid var(--light); display:flex; justify-content:space-between; align-items:center; }

/* =====================================================
   BADGES
   ===================================================== */
.badge { display:inline-flex; align-items:center; padding:0.25rem 0.65rem; border-radius:100px; font-size:0.72rem; font-weight:600; }
.badge-aqua { background:rgba(0,194,203,0.12); color:var(--aqua); }
.badge-navy { background:var(--navy); color:white; }
.badge-green { background:rgba(56,161,105,0.12); color:var(--green); }
.badge-red { background:rgba(229,62,62,0.12); color:var(--red); }
.badge-yellow { background:rgba(214,158,46,0.12); color:var(--yellow); }
.badge-gray { background:var(--light); color:var(--gray); }
.badge-featured { background:var(--aqua); color:var(--navy); position:absolute; top:0.75rem; left:0.75rem; }

/* =====================================================
   FORMS
   ===================================================== */
.form-group { margin-bottom:1.25rem; }
.form-group label { display:block; font-size:0.8rem; font-weight:500; color:var(--gray); margin-bottom:0.35rem; }
.form-control { width:100%; padding:0.7rem 1rem; border:1.5px solid var(--light); border-radius:10px; font-family:'DM Sans',sans-serif; font-size:0.9rem; color:var(--text); outline:none; transition:border-color 0.2s; background:white; }
.form-control:focus { border-color:var(--aqua); }
.form-control::placeholder { color:rgba(107,123,141,0.6); }
textarea.form-control { resize:vertical; min-height:100px; }
select.form-control { cursor:pointer; }
.form-grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.form-grid-3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:1rem; }
.form-error { color:var(--red); font-size:0.8rem; margin-top:0.3rem; }
.form-hint { color:var(--gray); font-size:0.78rem; margin-top:0.3rem; }

/* =====================================================
   TOGGLE SWITCH
   ===================================================== */
.toggle-wrap { display:flex; align-items:center; gap:0.75rem; }
.toggle { position:relative; width:44px; height:24px; flex-shrink:0; }
.toggle input { opacity:0; width:0; height:0; }
.toggle-slider { position:absolute; inset:0; background:var(--light); border-radius:24px; cursor:pointer; transition:background 0.2s; }
.toggle-slider::before { content:''; position:absolute; width:18px; height:18px; left:3px; bottom:3px; background:white; border-radius:50%; transition:transform 0.2s; box-shadow:0 1px 4px rgba(0,0,0,0.2); }
.toggle input:checked + .toggle-slider { background:var(--aqua); }
.toggle input:checked + .toggle-slider::before { transform:translateX(20px); }

/* =====================================================
   FAV BUTTON
   ===================================================== */
.fav-btn { position:absolute; top:0.75rem; right:0.75rem; width:36px; height:36px; border-radius:50%; background:rgba(255,255,255,0.9); border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:1rem; transition:all 0.2s; z-index:2; }
.fav-btn:hover { transform:scale(1.1); background:white; }
.fav-btn.active { color:var(--red); }

/* =====================================================
   TOAST
   ===================================================== */
.toast { position:fixed; bottom:1.5rem; right:1.5rem; background:var(--navy); color:white; padding:0.75rem 1.25rem; border-radius:10px; font-size:0.88rem; z-index:9999; opacity:0; transform:translateY(8px); transition:all 0.3s; pointer-events:none; }
.toast.show { opacity:1; transform:translateY(0); }
.toast.success { background:var(--green); }
.toast.error { background:var(--red); }

/* =====================================================
   LOADING SKELETON
   ===================================================== */
.skeleton { background:linear-gradient(90deg,var(--light) 0%,#d5dee8 50%,var(--light) 100%); background-size:200% 100%; animation:shimmer 1.5s infinite; border-radius:8px; }
@keyframes shimmer { 0%{background-position:200% 0} 100%{background-position:-200% 0} }

/* =====================================================
   EMPTY STATE
   ===================================================== */
.empty-state { text-align:center; padding:4rem 2rem; }
.empty-state .icon { font-size:3rem; margin-bottom:1rem; }
.empty-state h3 { font-family:'Fraunces',serif; color:var(--navy); margin-bottom:0.5rem; }
.empty-state p { color:var(--gray); font-size:0.9rem; margin-bottom:1.5rem; }

/* =====================================================
   GRID LAYOUTS
   ===================================================== */
.grid-3 { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:1.5rem; }
.grid-4 { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:1.25rem; }
.grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }

/* =====================================================
   FOOTER
   ===================================================== */
footer { background:var(--navy); color:rgba(255,255,255,0.6); }
.footer-grid { display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:2rem; margin-bottom:2rem; }
.footer-brand p { font-size:0.85rem; line-height:1.6; margin-top:0.75rem; }
.footer-col h4 { color:white; font-size:0.78rem; font-weight:600; letter-spacing:0.08em; text-transform:uppercase; margin-bottom:1rem; }
.footer-col a { display:block; color:rgba(255,255,255,0.5); text-decoration:none; font-size:0.85rem; margin-bottom:0.5rem; transition:color 0.2s; }
.footer-col a:hover { color:var(--aqua); }
.footer-bottom { border-top:1px solid rgba(255,255,255,0.08); padding-top:1.5rem; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:0.5rem; font-size:0.8rem; }
.footer-bottom a { color:var(--aqua); text-decoration:none; }

/* =====================================================
   RESPONSIVE
   ===================================================== */
@media (max-width:900px) {
  .nav-links { display:none; }
  
  .form-grid-2, .form-grid-3 { grid-template-columns:1fr; }
  .grid-2 { grid-template-columns:1fr; }
}
@media (max-width:480px) {
  .section { padding:3rem 4%; }
  .footer-grid { grid-template-columns:1fr; }
}

/* =====================================================
   UTILS
   ===================================================== */
.text-center { text-align:center; }
.text-gray { color:var(--gray); }
.text-aqua { color:var(--aqua); }
.text-navy { color:var(--navy); }
.mt-1{margin-top:0.5rem}.mt-2{margin-top:1rem}.mt-3{margin-top:1.5rem}.mt-4{margin-top:2rem}
.mb-1{margin-bottom:0.5rem}.mb-2{margin-bottom:1rem}.mb-3{margin-bottom:1.5rem}.mb-4{margin-bottom:2rem}
.gap-1{gap:0.5rem}.gap-2{gap:1rem}
.flex{display:flex}.flex-center{display:flex;align-items:center;justify-content:center}
.flex-between{display:flex;align-items:center;justify-content:space-between}
.flex-wrap{flex-wrap:wrap}
.stars{color:#f6c90e;letter-spacing:0.05em}
.stars-empty{color:var(--light)}