/* ============ Aqua Trip – Reviews section ============ */
.aq-rev,.aq-modal{
  --deep:#0C3A42;--lagoon:#1A9AA0;--shallow:#CFEEEA;--foam:#F3FAF9;--sun:#F5C451;--ink:#1D2B2E;--muted:#5B6D70;
}
.aq-rev{
  font-family:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);
  background:#fff;padding:clamp(64px,9vw,120px) 20px;
}
.aq-rev *,.aq-modal *{box-sizing:border-box}
.aq-rev-wrap{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:340px 1fr;gap:clamp(32px,5vw,72px);align-items:start}

/* ---- summary column ---- */
.aq-rev-wrap>*{min-width:0}
.aq-sum{position:sticky;top:120px}
.aq-rev-kicker{font-size:15px;font-weight:600;color:var(--lagoon);margin:0 0 12px}
.aq-rev-title{
  font-family:"Bricolage Grotesque",Georgia,sans-serif;font-weight:700;
  font-size:clamp(32px,3.6vw,46px);line-height:1.05;letter-spacing:-.02em;color:var(--deep);margin:0 0 28px;
}
.aq-score{
  background:var(--deep);color:#fff;border-radius:24px;padding:26px;margin-bottom:18px;
}
.aq-score-top{display:flex;align-items:center;gap:16px;margin-bottom:20px}
.aq-score-num{font-family:"Bricolage Grotesque",sans-serif;font-weight:700;font-size:60px;line-height:.9}
.aq-score-meta{font-size:14px;color:#A9D1CD}
.aq-stars{display:inline-flex;gap:2px;color:var(--sun)}
.aq-stars svg{display:block}
.aq-bars{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.aq-bars li{display:grid;grid-template-columns:22px 1fr 34px;gap:10px;align-items:center;font-size:13px;color:#CFE6E3}
.aq-bar-track{height:6px;border-radius:6px;background:rgba(255,255,255,.12);overflow:hidden}
.aq-bar-fill{display:block;height:100%;background:var(--sun);border-radius:6px}
.aq-bars li span:last-child{text-align:right}

.aq-sources{display:flex;gap:10px;margin-bottom:22px}
.aq-source{
  flex:1;display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:16px;
  background:var(--foam);text-decoration:none;color:var(--deep);font-size:13px;line-height:1.3;
  transition:box-shadow .2s;
}
.aq-source:hover{box-shadow:inset 0 0 0 1.5px var(--lagoon)}
.aq-source b{display:block;font-size:15px}

.aq-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:15px 26px;border-radius:999px;border:0;cursor:pointer;
  font:600 16px/1 "Figtree",sans-serif;text-decoration:none;transition:background .2s,box-shadow .2s;
}
.aq-btn:focus-visible,.aq-chip-btn:focus-visible,.aq-more:focus-visible{outline:3px solid var(--sun);outline-offset:3px}
.aq-btn-primary{background:var(--lagoon);color:#fff}
.aq-btn-primary:hover{background:var(--deep)}
.aq-btn-ghost{background:#fff;color:var(--deep);box-shadow:inset 0 0 0 2px var(--shallow)}
.aq-btn-ghost:hover{box-shadow:inset 0 0 0 2px var(--lagoon)}
.aq-sum .aq-btn{width:100%}

/* ---- feed ---- */
.aq-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}
.aq-chip-btn{
  padding:10px 16px;border-radius:999px;border:0;cursor:pointer;
  background:var(--foam);color:var(--deep);font:500 15px/1 "Figtree",sans-serif;
  transition:background .2s,color .2s;
}
.aq-chip-btn:hover{background:var(--shallow)}
.aq-chip-btn[aria-pressed="true"]{background:var(--deep);color:#fff}
.aq-chip-btn small{opacity:.6;margin-left:4px}

.aq-feed{columns:2 320px;column-gap:20px}
.aq-review{
  break-inside:avoid;margin:0 0 20px;padding:24px;border-radius:22px;
  background:#fff;box-shadow:inset 0 0 0 1.5px #E3EFEE;
}
.aq-review--lead{background:var(--foam);box-shadow:none}
.aq-review-head{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.aq-avatar{
  width:44px;height:44px;border-radius:50%;flex:none;display:grid;place-items:center;
  font-weight:600;font-size:16px;color:var(--deep);background:var(--shallow);
}
.aq-who{flex:1;min-width:0}
.aq-who b{display:block;font-size:16px}
.aq-who span{font-size:13px;color:var(--muted)}
.aq-src-badge{font-size:12px;color:var(--muted);white-space:nowrap}
.aq-review-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.aq-trip-tag{font-size:13px;font-weight:600;color:var(--lagoon);background:#E6F5F4;padding:6px 10px;border-radius:999px}
.aq-review-row .aq-stars{color:#E5A800}
.aq-review p{margin:0;font-size:16px;line-height:1.65;color:#34474A}
.aq-review--lead p{font-family:"Bricolage Grotesque",sans-serif;font-weight:500;font-size:21px;line-height:1.45;color:var(--deep)}
.aq-photos{display:flex;gap:8px;margin-top:16px}
.aq-photos img{width:88px;height:88px;object-fit:cover;border-radius:14px;display:block}
.aq-reply{
  margin-top:16px;padding:14px 16px;border-radius:14px;background:#fff;
  box-shadow:inset 3px 0 0 var(--lagoon);font-size:14.5px;line-height:1.55;color:var(--muted);
}
.aq-reply b{color:var(--deep);display:block;margin-bottom:4px;font-size:14px}
.aq-review:not(.aq-review--lead) .aq-reply{background:var(--foam)}

.aq-empty{padding:40px;border-radius:22px;background:var(--foam);text-align:center;color:var(--muted)}
.aq-more{
  display:block;margin:8px auto 0;padding:14px 26px;border-radius:999px;border:0;cursor:pointer;
  background:none;color:var(--deep);box-shadow:inset 0 0 0 2px var(--shallow);font:600 16px/1 "Figtree",sans-serif;
}
.aq-more:hover{box-shadow:inset 0 0 0 2px var(--lagoon)}
.aq-more[hidden]{display:none}

/* ---- modal ---- */
.aq-modal{
  border:0;padding:0;border-radius:26px;width:min(560px,calc(100% - 32px));
  font-family:"Figtree",system-ui,sans-serif;color:var(--ink);
  box-shadow:0 30px 80px -20px rgba(12,58,66,.5);
}
.aq-modal::backdrop{background:rgba(12,58,66,.55);backdrop-filter:blur(3px)}
.aq-form{padding:30px}
.aq-form-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:22px}
.aq-form h3{font-family:"Bricolage Grotesque",sans-serif;font-weight:700;font-size:28px;color:var(--deep);margin:0 0 6px}
.aq-form-top p{margin:0;color:var(--muted);font-size:15px}
.aq-x{width:40px;height:40px;border-radius:50%;border:0;background:var(--foam);cursor:pointer;display:grid;place-items:center;color:var(--deep);flex:none}
.aq-field{margin-bottom:18px}
.aq-field label,.aq-field legend{display:block;font-weight:600;font-size:14px;margin-bottom:8px;color:var(--deep);padding:0}
.aq-field fieldset{border:0;margin:0;padding:0}
.aq-field input[type=text],.aq-field select,.aq-field textarea{
  width:100%;padding:13px 14px;border-radius:14px;border:1.5px solid #D9E7E6;background:#fff;
  font:400 16px/1.4 "Figtree",sans-serif;color:var(--ink);
}
.aq-field textarea{min-height:120px;resize:vertical}
.aq-field input:focus,.aq-field select:focus,.aq-field textarea:focus{outline:none;border-color:var(--lagoon);box-shadow:0 0 0 3px #D6F0EE}
.aq-row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.aq-hint{font-size:13px;color:var(--muted);margin-top:6px}
.aq-err{font-size:13px;color:#B42318;margin-top:6px;display:none}
.aq-field.is-bad .aq-err{display:block}
.aq-field.is-bad input,.aq-field.is-bad textarea{border-color:#E8847A}

/* star input: radios reversed so CSS can light up previous stars */
.aq-rate{display:inline-flex;flex-direction:row-reverse;gap:4px}
.aq-rate input{position:absolute;opacity:0;width:1px;height:1px}
.aq-rate label{cursor:pointer;color:#D5E0DF;margin:0;transition:color .15s,transform .15s}
.aq-rate label:hover,.aq-rate label:hover~label,.aq-rate input:checked~label{color:#E5A800}
.aq-rate input:focus-visible+label{outline:3px solid var(--sun);outline-offset:2px;border-radius:6px}
.aq-rate-text{margin-left:10px;font-size:14px;color:var(--muted);vertical-align:middle}

.aq-form-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:6px}
.aq-done{padding:44px 30px;text-align:center}
.aq-done-icon{width:64px;height:64px;border-radius:50%;background:var(--shallow);color:var(--deep);display:grid;place-items:center;margin:0 auto 16px}
.aq-done h3{font-family:"Bricolage Grotesque",sans-serif;font-size:26px;color:var(--deep);margin:0 0 8px}
.aq-done p{color:var(--muted);margin:0 0 22px}

@media (max-width:900px){
  .aq-rev-wrap{grid-template-columns:1fr}
  .aq-sum{position:static}
}
@media (max-width:600px){
  .aq-rev{padding:56px 16px}
  .aq-rev-wrap{gap:28px}
  .aq-rev-title{font-size:30px;margin-bottom:20px}

  /* compact score: number + stars on one line, bars below */
  .aq-score{padding:18px;border-radius:20px;margin-bottom:12px}
  .aq-score-top{margin-bottom:14px;gap:12px}
  .aq-score-num{font-size:44px}
  .aq-bars{gap:6px}

  .aq-sources{gap:8px;margin-bottom:14px}
  .aq-source{padding:10px 12px;border-radius:14px;gap:8px}
  .aq-source b{font-size:14px}
  .aq-sum .aq-btn{padding:14px 20px}

  /* chips: one swipeable row instead of 3 wrapped rows */
  .aq-filters{
    flex-wrap:nowrap;overflow-x:auto;margin:0 -16px 18px;padding:2px 16px;
    scroll-snap-type:x proximity;scroll-padding-left:16px;scrollbar-width:none;
  }
  .aq-filters::-webkit-scrollbar{display:none}
  .aq-chip-btn{flex:none;scroll-snap-align:start;padding:10px 14px;font-size:14px}

  .aq-feed{columns:1}
  .aq-review{padding:18px;border-radius:18px;margin-bottom:14px}
  .aq-review-head{gap:10px;margin-bottom:12px;flex-wrap:wrap}
  .aq-avatar{width:40px;height:40px;font-size:15px}
  .aq-who b{font-size:15px}
  .aq-src-badge{width:100%;order:3;padding-left:50px;margin-top:-6px}
  .aq-review p{font-size:15px;line-height:1.6}
  .aq-review--lead p{font-size:17px;line-height:1.5}
  .aq-photos img{width:72px;height:72px;border-radius:12px}
  .aq-reply{padding:12px 14px;font-size:14px}
  .aq-more{width:100%;padding:14px}

  /* modal becomes a bottom sheet */
  .aq-modal{
    width:100%;max-width:100%;max-height:92vh;margin:0;inset:auto 0 0 0;
    border-radius:24px 24px 0 0;
  }
  .aq-modal[open]{animation:aq-sheet .28s ease-out}
  .aq-form{padding:20px 18px 0}
  .aq-form h3{font-size:24px}
  .aq-form-top{margin-bottom:16px}
  .aq-row2{grid-template-columns:1fr;gap:0}
  .aq-field{margin-bottom:14px}
  .aq-field input[type=text],.aq-field select,.aq-field textarea{font-size:16px;padding:12px 13px}
  .aq-field textarea{min-height:100px}
  .aq-rate label svg{width:38px;height:38px}
  .aq-form-actions{
    position:sticky;bottom:0;background:#fff;margin:0 -18px;padding:12px 18px calc(12px + env(safe-area-inset-bottom));
    border-top:1px solid #E6EFEE;
  }
  .aq-form-actions .aq-btn{flex:1;padding:14px}
  .aq-done{padding:36px 20px calc(28px + env(safe-area-inset-bottom))}
  .aq-done .aq-btn{width:100%}
}
@media (max-width:360px){
  .aq-rev-title{font-size:27px}
  .aq-sources{flex-direction:column}
}
@keyframes aq-sheet{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.aq-modal[open]{animation:none}}
@media (prefers-reduced-motion:reduce){.aq-rev *,.aq-modal *{transition:none!important}}

a.aq-src-badge{text-decoration:underline;text-underline-offset:2px}
a.aq-src-badge:hover{color:var(--lagoon)}
