/* ==========================================================================
   Contact sheet — one implementation shared by /auto, /plates and the
   homepage. Self-contained on purpose: each of those pages ships a different
   stylesheet with different custom properties, so nothing here depends on a
   variable that may or may not be defined.
   ========================================================================== */

.csheet{position:fixed;inset:0;z-index:200;display:flex;align-items:flex-end;justify-content:center}
.csheet[hidden]{display:none}

.csheet__scrim{position:absolute;inset:0;background:rgba(3,4,7,.74);
  opacity:0;transition:opacity .2s linear;will-change:opacity}
.csheet.is-open .csheet__scrim{opacity:1}

.csheet__panel{
  position:relative;width:100%;max-width:460px;
  padding:14px 18px calc(22px + env(safe-area-inset-bottom,0px));
  border-radius:26px 26px 0 0;
  border:1px solid rgba(255,255,255,.10);border-bottom:0;
  background:linear-gradient(180deg,#141a28,#0a0d16);
  box-shadow:0 -26px 70px -30px rgba(0,0,0,.95),inset 0 1px 0 rgba(255,255,255,.08);
  color:#f4f6fb;font-family:inherit;
  transform:translateY(102%);
  transition:transform .26s cubic-bezier(.32,.72,.35,1);
  will-change:transform}
.csheet.is-open .csheet__panel{transform:none}

.csheet__grip{display:block;width:38px;height:4px;border-radius:999px;margin:0 auto 16px;
  background:rgba(255,255,255,.16)}
.csheet__panel h2{margin:0;font-size:1.2rem;font-weight:700;letter-spacing:-.02em;line-height:1.2}
.csheet__lead{margin:6px 0 16px;font-size:.88rem;color:rgba(244,246,251,.66);line-height:1.55}

.csheet__row{display:flex;align-items:center;gap:13px;padding:13px 14px;margin-bottom:9px;
  border:1px solid rgba(255,255,255,.06);border-radius:12px;text-decoration:none;color:inherit;
  background:rgba(255,255,255,.026);
  transition:border-color .18s ease,background .18s ease}
.csheet__row:hover,.csheet__row:focus-visible{border-color:rgba(255,255,255,.18);background:rgba(255,255,255,.05)}
.csheet__ico{flex:none;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;
  color:#60a5fa;background:rgba(96,165,250,.12);border:1px solid rgba(96,165,250,.22)}
.csheet__ico svg{width:18px;height:18px}
.csheet__txt{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}
.csheet__txt b{font-size:.98rem;font-weight:600}
.csheet__txt span{font-size:.78rem;color:rgba(244,246,251,.42)}
.csheet__arw{width:16px;height:16px;flex:none;color:rgba(244,246,251,.42)}

.csheet__close{width:100%;margin-top:6px;height:46px;border-radius:12px;
  border:1px solid rgba(255,255,255,.10);background:transparent;color:rgba(244,246,251,.66);
  font:inherit;font-weight:600;cursor:pointer}
.csheet__close:hover{color:#f4f6fb;border-color:rgba(255,255,255,.22)}

/* wider screens: a centred dialog rather than a bottom sheet */
@media (min-width:600px){
  .csheet{align-items:center}
  .csheet__panel{border-radius:26px;border-bottom:1px solid rgba(255,255,255,.10);
    transform:translateY(14px) scale(.985);padding:22px 22px 20px}
  .csheet.is-open .csheet__panel{transform:none}
  .csheet__grip{display:none}
}
@media (prefers-reduced-motion:reduce){
  .csheet__scrim,.csheet__panel{transition:none}
}

/* ── an empty ad slot is an invitation, so make it behave like one ─────── */
.adslot,.ad-slot{cursor:pointer}
.adslot:focus-visible,.ad-slot:focus-visible{outline:2px solid #60a5fa;outline-offset:3px}
.adslot::after,.ad-slot::after{
  content:"განათავსე რეკლამა →";
  position:absolute;right:14px;bottom:10px;
  font-size:.66rem;font-weight:600;letter-spacing:.02em;color:#60a5fa;
  opacity:0;transition:opacity .2s ease;pointer-events:none}
.adslot:hover::after,.ad-slot:hover::after,
.adslot:focus-visible::after,.ad-slot:focus-visible::after{opacity:1}
.ad-slot{position:relative}
