/* =============================================
   ESPLÊNDIDO SABOR — LINKTREE PREMIUM CSS
   Estrutura inspirada na Aleanzza Pizzaria
   ============================================= */

/* RESET & BASE */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;font-size:16px}
body{
  font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;
  background:#0a0a0a;
  color:#fff;
  min-height:100vh;
  min-height:100dvh;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
img,video{display:block;max-width:100%}
a{text-decoration:none;color:inherit}
ul{list-style:none}
button{cursor:pointer;border:none;background:none;font:inherit;color:inherit}

/* SKIP LINK */
.skip-link{
  position:absolute;top:-100%;left:50%;transform:translateX(-50%);
  background:#e63a2e;color:#fff;padding:8px 20px;border-radius:0 0 8px 8px;
  font-weight:600;z-index:9999;font-size:.875rem;
}
.skip-link:focus{top:0}

/* =================== BACKDROP (Vídeo Fullscreen) =================== */
.backdrop{
  position:fixed;inset:0;z-index:0;
  overflow:hidden;
}
.backdrop__video{
  width:100%;height:100%;
  object-fit:cover;
  transform:scale(1.04);
  filter:brightness(0.72) saturate(1.25) contrast(1.05);
}
.backdrop__overlay{
  position:absolute;inset:0;
  background:
    linear-gradient(180deg,
      rgba(10,10,10,0.48) 0%,
      rgba(10,10,10,0.16) 25%,
      rgba(10,10,10,0.2) 60%,
      rgba(10,10,10,0.62) 100%
    ),
    radial-gradient(ellipse at center top, rgba(230,58,46,0.12) 0%, transparent 60%);
}

/* =================== BIOLINK CONTAINER =================== */
.biolink{
  position:relative;z-index:1;
  display:flex;justify-content:center;align-items:flex-start;
  min-height:100vh;min-height:100dvh;
  padding:36px 14px 28px;
}

/* =================== PANEL (Card Central Flutuante) =================== */
.biolink__panel{
  width:100%;max-width:440px;
  background:rgba(14,14,18,0.66);
  backdrop-filter:blur(16px) saturate(1.25);
  -webkit-backdrop-filter:blur(16px) saturate(1.25);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:24px;
  box-shadow:
    0 0 0 1px rgba(255,255,255,0.03),
    0 6px 28px rgba(0,0,0,0.4),
    0 24px 70px rgba(0,0,0,0.5),
    inset 0 1px 0 rgba(255,255,255,0.08);
  padding:36px 22px 28px;
  animation:panelIn 0.8s cubic-bezier(0.16,1,0.3,1) both;
}

@keyframes panelIn{
  from{opacity:0;transform:translateY(40px) scale(0.96)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

/* =================== HEADER (Topo Compacto) =================== */
.panel__header{
  text-align:center;
  margin-bottom:20px;
}
.panel__logo-wrap{
  width:88px;height:88px;
  margin:0 auto 14px;
  border-radius:50%;
  border:2.5px solid rgba(230,58,46,0.35);
  padding:3px;
  background:rgba(230,58,46,0.06);
  box-shadow:
    0 0 20px rgba(230,58,46,0.12),
    0 0 40px rgba(230,58,46,0.05);
  animation:cardIn 0.6s cubic-bezier(0.16,1,0.3,1) 0.15s both;
}
.panel__logo{
  width:100%;height:100%;
  border-radius:50%;
  object-fit:cover;
}
.panel__title{
  font-family:'Syne',sans-serif;
  font-size:clamp(1.3rem,4.8vw,1.6rem);
  font-weight:900;
  letter-spacing:0.04em;
  line-height:1.1;
  background:linear-gradient(135deg,#fff 25%,#e63a2e 65%,#f59e0b 100%);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
  animation:cardIn 0.6s cubic-bezier(0.16,1,0.3,1) 0.2s both;
}
.panel__category{
  font-size:.68rem;
  font-weight:700;
  letter-spacing:0.2em;
  color:rgba(255,255,255,0.4);
  margin-top:4px;
  animation:cardIn 0.6s cubic-bezier(0.16,1,0.3,1) 0.25s both;
}
.panel__tagline{
  font-size:.78rem;
  font-weight:600;
  line-height:1.45;
  color:rgba(255,255,255,0.65);
  margin-top:12px;
  animation:cardIn 0.6s cubic-bezier(0.16,1,0.3,1) 0.3s both;
}
.panel__since{
  font-size:.68rem;
  color:rgba(255,255,255,0.3);
  margin-top:6px;
  font-style:italic;
  animation:cardIn 0.6s cubic-bezier(0.16,1,0.3,1) 0.35s both;
}
.panel__location{
  display:inline-flex;align-items:center;gap:5px;
  font-size:.7rem;
  font-weight:500;
  color:rgba(255,255,255,0.45);
  margin-top:6px;
  animation:cardIn 0.6s cubic-bezier(0.16,1,0.3,1) 0.4s both;
}
.panel__location .icon{stroke:rgba(230,58,46,0.6)}

/* =================== STATUS BADGE =================== */
.panel__status{
  display:flex;align-items:center;justify-content:center;gap:8px;
  padding:8px 18px;
  margin:0 auto 20px;
  width:fit-content;
  border-radius:100px;
  background:rgba(20,20,24,0.65);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,0.08);
  font-size:.7rem;font-weight:600;
  letter-spacing:0.04em;
  color:rgba(255,255,255,0.8);
  animation:cardIn 0.6s cubic-bezier(0.16,1,0.3,1) 0.45s both;
}
.status__dot{
  width:8px;height:8px;
  border-radius:50%;
  background:#22c55e;
  box-shadow:0 0 8px rgba(34,197,94,0.5);
  animation:pulse 2s ease-in-out infinite;
}
.panel__status[data-status="closed"] .status__dot{
  background:#ef4444;
  box-shadow:0 0 8px rgba(239,68,68,0.5);
  animation:none;
}
@keyframes pulse{
  0%,100%{opacity:1;transform:scale(1)}
  50%{opacity:0.5;transform:scale(0.75)}
}

/* =================== ACTION CARDS (Empilhados) =================== */
.panel__cards{
  display:flex;flex-direction:column;gap:10px;
  margin-bottom:20px;
}
.action-card{
  display:flex;align-items:center;gap:14px;
  padding:16px 18px;
  border-radius:14px;
  background:rgba(22,22,26,0.58);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,0.08);
  box-shadow:0 4px 16px rgba(0,0,0,0.22);
  transition:all 0.3s cubic-bezier(0.16,1,0.3,1);
  position:relative;overflow:hidden;
  min-height:64px;
  cursor:pointer;
}
.action-card:hover{
  background:rgba(28,28,34,0.75);
  border-color:rgba(255,255,255,0.16);
  transform:translateY(-2px);
  box-shadow:0 8px 32px rgba(0,0,0,0.35);
}
.action-card:active{
  transform:translateY(0) scale(0.98);
}

/* Staggered card entrance */
.action-card:nth-child(1){animation:cardIn 0.6s cubic-bezier(0.16,1,0.3,1) 0.5s both}
.action-card:nth-child(2){animation:cardIn 0.6s cubic-bezier(0.16,1,0.3,1) 0.58s both}
.action-card:nth-child(3){animation:cardIn 0.6s cubic-bezier(0.16,1,0.3,1) 0.66s both}

@keyframes cardIn{
  from{opacity:0;transform:translateY(20px)}
  to{opacity:1;transform:translateY(0)}
}

.action-card__icon{
  flex-shrink:0;
  width:44px;height:44px;
  display:flex;align-items:center;justify-content:center;
  border-radius:12px;
  background:rgba(255,255,255,0.06);
  color:rgba(255,255,255,0.8);
}
.action-card__icon--instagram{
  background:linear-gradient(135deg,#833ab4,#fd1d1d,#fcb045);
  color:#fff;
}
.action-card__icon--location{
  background:rgba(230,58,46,0.12);
  color:#e63a2e;
}

.action-card__content{
  flex:1;min-width:0;
}
.action-card__title{
  display:block;
  font-size:.88rem;font-weight:700;
  color:#fff;
  line-height:1.2;
}
.action-card__subtitle{
  display:block;
  font-size:.72rem;
  color:rgba(255,255,255,0.7);
  margin-top:2px;
  line-height:1.3;
}
.action-card__chevron{
  flex-shrink:0;
  color:rgba(255,255,255,0.2);
  transition:all 0.3s ease;
}
.action-card:hover .action-card__chevron{
  transform:translateX(3px);
  color:rgba(255,255,255,0.5);
}

/* DELIVERY - CTA PRINCIPAL com Destaque Premium */
.action-card--delivery{
  background:linear-gradient(135deg,rgba(230,58,46,0.22) 0%,rgba(245,158,11,0.12) 50%,rgba(230,58,46,0.08) 100%);
  border-color:rgba(230,58,46,0.35);
  box-shadow:0 4px 20px rgba(230,58,46,0.12);
  position:relative;
}
.action-card--delivery .action-card__icon{
  background:linear-gradient(135deg,#e63a2e,#f59e0b);
  color:#fff;
  box-shadow:0 0 20px rgba(230,58,46,0.3),0 0 40px rgba(245,158,11,0.1);
}
.action-card--delivery:hover{
  background:linear-gradient(135deg,rgba(230,58,46,0.3) 0%,rgba(245,158,11,0.18) 50%,rgba(230,58,46,0.14) 100%);
  border-color:rgba(230,58,46,0.48);
  box-shadow:0 8px 32px rgba(230,58,46,0.22),0 0 48px rgba(230,58,46,0.08);
}
.action-card__badge{
  position:absolute;
  top:8px;right:14px;
  font-size:.52rem;
  font-weight:800;
  letter-spacing:0.12em;
  color:rgba(245,158,11,0.9);
  background:rgba(245,158,11,0.12);
  padding:2px 8px;
  border-radius:4px;
  border:1px solid rgba(245,158,11,0.18);
  line-height:1.4;
  pointer-events:none;
}

/* WHATSAPP (Segundo CTA) */
.action-card--whatsapp{
  background:linear-gradient(135deg,rgba(37,211,102,0.16) 0%,rgba(37,211,102,0.06) 100%);
  border-color:rgba(37,211,102,0.28);
  box-shadow:0 4px 20px rgba(37,211,102,0.08);
}
.action-card--whatsapp .action-card__icon{
  background:#25d366;
  color:#fff;
  box-shadow:0 0 18px rgba(37,211,102,0.3);
}
.action-card--whatsapp:hover{
  background:linear-gradient(135deg,rgba(37,211,102,0.24) 0%,rgba(37,211,102,0.1) 100%);
  border-color:rgba(37,211,102,0.42);
  box-shadow:0 8px 32px rgba(37,211,102,0.16);
}

/* SHINE SWEEP nos CTAs */
.action-card__shine{
  position:absolute;inset:0;
  background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,0.05) 45%,rgba(255,255,255,0.1) 50%,rgba(255,255,255,0.05) 55%,transparent 60%);
  transform:translateX(-100%);
  animation:shine 5s ease-in-out infinite;
  pointer-events:none;
}
@keyframes shine{
  0%,80%{transform:translateX(-100%)}
  100%{transform:translateX(100%)}
}

/* =================== MAP (Compacto dentro do painel) =================== */
.panel__map{
  margin-bottom:20px;
  border-radius:16px;
  overflow:hidden;
  background:rgba(22,22,26,0.55);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,0.08);
  box-shadow:0 4px 16px rgba(0,0,0,0.22);
  animation:cardIn 0.6s cubic-bezier(0.16,1,0.3,1) 0.74s both;
}
.map__container{
  position:relative;
  width:100%;
  height:180px;
  background:#18181c;
  overflow:hidden;
}
.map__iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
  z-index:2;
  transition:opacity 0.3s ease;
}
.map__fallback{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:16px;
  background:
    radial-gradient(ellipse at center, rgba(230,58,46,0.18) 0%, rgba(18,18,22,0.96) 75%),
    repeating-linear-gradient(45deg, rgba(255,255,255,0.015) 0px, rgba(255,255,255,0.015) 2px, transparent 2px, transparent 8px);
}
.map__fallback-visual{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:4px;
}
.map__fallback-pin{
  filter:drop-shadow(0 0 10px rgba(230,58,46,0.6));
  animation:bouncePin 2s infinite ease-in-out;
}
@keyframes bouncePin{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-5px)}
}
.map__fallback-title{
  font-size:.85rem;
  font-weight:700;
  color:#fff;
  letter-spacing:0.02em;
}
.map__fallback-subtitle{
  font-size:.72rem;
  color:rgba(255,255,255,0.6);
}
.map__fallback-cta{
  display:inline-flex;
  align-items:center;
  margin-top:6px;
  font-size:.7rem;
  font-weight:700;
  color:#e63a2e;
  text-decoration:none;
  padding:4px 10px;
  border-radius:6px;
  background:rgba(230,58,46,0.1);
  border:1px solid rgba(230,58,46,0.25);
  transition:all 0.2s;
}
.map__fallback-cta:hover{
  background:rgba(230,58,46,0.2);
  color:#ff5a4e;
}
.map__address{
  padding:14px 16px;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  flex-wrap:wrap;
  background:rgba(18,18,22,0.4);
}
.map__address-text{
  display:flex;align-items:flex-start;gap:8px;
  font-size:.8rem;
  color:rgba(255,255,255,0.7);
}
.map__address-text strong{
  color:#fff;font-size:.82rem;
}
.map__address-text .icon{
  stroke:rgba(230,58,46,0.6);
  flex-shrink:0;
  margin-top:2px;
}
.map__city{
  font-size:.72rem;color:rgba(255,255,255,0.35);
}
.map__actions{
  display:flex;gap:8px;
}
.btn{
  display:inline-flex;align-items:center;gap:5px;
  padding:7px 14px;
  border-radius:8px;
  font-size:.72rem;font-weight:600;
  transition:all 0.2s ease;
}
.btn--route{
  background:rgba(230,58,46,0.12);
  color:#e63a2e;
  border:1px solid rgba(230,58,46,0.2);
}
.btn--route:hover{background:rgba(230,58,46,0.22)}
.btn--copy{
  background:rgba(255,255,255,0.06);
  color:rgba(255,255,255,0.55);
  border:1px solid rgba(255,255,255,0.08);
}
.btn--copy:hover{background:rgba(255,255,255,0.1)}
.btn--copy.copied{
  background:rgba(34,197,94,0.15);
  color:#22c55e;
  border-color:rgba(34,197,94,0.3);
}

/* =================== REVIEWS (Avaliações do Google) =================== */
.panel__reviews{
  margin-bottom:20px;
  animation:cardIn 0.6s cubic-bezier(0.16,1,0.3,1) 0.82s both;
}
.reviews-card{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  padding:24px 20px 22px;
  border-radius:18px;
  background:rgba(22,22,26,0.55);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,0.08);
  box-shadow:0 4px 16px rgba(0,0,0,0.22);
  position:relative;
  overflow:hidden;
  transition:border-color 0.3s ease, box-shadow 0.3s ease;
}
.reviews-card:hover{
  border-color:rgba(245,158,11,0.25);
  box-shadow:0 8px 32px rgba(0,0,0,0.35), 0 0 24px rgba(245,158,11,0.06);
}
.reviews-card__google-logo{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-bottom:8px;
  filter:drop-shadow(0 2px 8px rgba(0,0,0,0.3));
}
.reviews-card__score{
  font-family:'Montserrat',sans-serif;
  font-size:2.8rem;
  font-weight:800;
  line-height:1;
  color:#fff;
  letter-spacing:-0.03em;
  margin-bottom:6px;
}
.reviews-card__stars{
  display:flex;
  gap:4px;
  justify-content:center;
  margin-bottom:8px;
  font-size:1.25rem;
  color:#f59e0b;
  filter:drop-shadow(0 0 8px rgba(245,158,11,0.4));
}
.star--half{
  position:relative;
  display:inline-block;
  background:linear-gradient(90deg,#f59e0b 50%,rgba(255,255,255,0.2) 50%);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}
.reviews-card__caption{
  font-size:.78rem;
  font-weight:500;
  color:rgba(255,255,255,0.7);
  margin-bottom:16px;
}
.reviews-card__btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:100%;
  max-width:320px;
  min-height:48px;
  padding:12px 20px;
  border-radius:12px;
  background:rgba(245,158,11,0.06);
  border:1px solid rgba(245,158,11,0.35);
  color:#f59e0b;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
  overflow:hidden;
  transition:all 0.3s cubic-bezier(0.16,1,0.3,1);
  text-decoration:none;
}
.reviews-card__btn:hover{
  background:rgba(245,158,11,0.15);
  border-color:rgba(245,158,11,0.6);
  color:#fbbf24;
  transform:translateY(-1px);
  box-shadow:0 6px 20px rgba(245,158,11,0.2);
}
.reviews-card__btn:focus-visible{
  outline:2px solid #f59e0b;
  outline-offset:2px;
}
.reviews-card__btn:active{
  transform:translateY(0) scale(0.98);
}
.reviews-card__btn-arrow{
  font-size:.85rem;
  line-height:1;
  transition:transform 0.25s ease;
}
.reviews-card__btn:hover .reviews-card__btn-arrow{
  transform:translate(2px, -2px);
}
.reviews-card__btn-shine{
  position:absolute;
  inset:0;
  background:linear-gradient(105deg,transparent 40%,rgba(245,158,11,0.08) 45%,rgba(255,255,255,0.22) 50%,rgba(245,158,11,0.08) 55%,transparent 60%);
  transform:translateX(-100%);
  animation:shine 5s ease-in-out 1.2s infinite;
  pointer-events:none;
}

/* =================== ESTEIRA / TICKER =================== */
.reviews-ticker{
  width:100%;
  overflow:hidden;
  margin-top:14px;
  position:relative;
  padding:4px 0;
  mask-image:linear-gradient(to right, transparent 0%, black 16px, black calc(100% - 16px), transparent 100%);
  -webkit-mask-image:linear-gradient(to right, transparent 0%, black 16px, black calc(100% - 16px), transparent 100%);
  cursor:grab;
}
.reviews-ticker:active{
  cursor:grabbing;
}
.reviews-ticker__track{
  display:flex;
  gap:12px;
  width:max-content;
  animation:tickerScroll 26s linear infinite;
  will-change:transform;
}
.reviews-ticker:hover .reviews-ticker__track,
.reviews-ticker.is-paused .reviews-ticker__track{
  animation-play-state:paused;
}
@keyframes tickerScroll{
  0%{transform:translateX(0)}
  100%{transform:translateX(-50%)}
}
.review-bubble{
  flex-shrink:0;
  width:230px;
  padding:12px 14px;
  border-radius:14px;
  background:rgba(24,24,30,0.62);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,0.08);
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:8px;
  transition:border-color 0.25s, transform 0.25s, background 0.25s;
}
.review-bubble:hover{
  border-color:rgba(245,158,11,0.25);
  transform:translateY(-2px);
  background:rgba(30,30,38,0.75);
}
.review-bubble__header{
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.review-bubble__stars{
  color:#f59e0b;
  font-size:.72rem;
  letter-spacing:1px;
}
.review-bubble__source{
  font-size:.58rem;
  font-weight:600;
  letter-spacing:0.04em;
  color:rgba(255,255,255,0.35);
  display:inline-flex;
  align-items:center;
  gap:3px;
}
.review-bubble__quote{
  font-size:.74rem;
  font-style:italic;
  line-height:1.42;
  color:rgba(255,255,255,0.78);
  margin:0;
}
.review-bubble__author{
  font-size:.66rem;
  font-weight:600;
  color:rgba(255,255,255,0.45);
}

/* =================== HOURS (Horário de Funcionamento) =================== */
.panel__hours{
  margin-bottom:20px;
  padding:16px;
  border-radius:16px;
  background:rgba(22,22,26,0.55);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,0.08);
  box-shadow:0 4px 16px rgba(0,0,0,0.2);
  animation:cardIn 0.6s cubic-bezier(0.16,1,0.3,1) 0.9s both;
}
.hours__title{
  display:flex;align-items:center;gap:8px;
  font-size:.82rem;font-weight:700;
  color:rgba(255,255,255,0.75);
  margin-bottom:12px;
}
.hours__title svg{stroke:rgba(230,58,46,0.6)}
.hours__list{
  display:flex;flex-direction:column;gap:4px;
}
.hours__day{
  display:flex;justify-content:space-between;align-items:center;
  padding:7px 10px;
  border-radius:8px;
  font-size:.78rem;
  transition:background 0.2s;
}
.hours__day.is-today{
  background:rgba(230,58,46,0.08);
  border:1px solid rgba(230,58,46,0.15);
}
.hours__day.is-today .hours__label{
  color:#e63a2e;font-weight:700;
}
.hours__label{
  color:rgba(255,255,255,0.55);
  font-weight:500;
}
.hours__time{
  color:rgba(255,255,255,0.8);
  font-weight:600;
  font-variant-numeric:tabular-nums;
}
.hours__time--closed{
  color:rgba(239,68,68,0.65);
}

/* =================== FOOTER =================== */
.panel__footer{
  text-align:center;
  padding-top:16px;
  border-top:1px solid rgba(255,255,255,0.04);
  animation:cardIn 0.6s cubic-bezier(0.16,1,0.3,1) 1s both;
}
.panel__footer p{
  font-size:.65rem;
  color:rgba(255,255,255,0.2);
}
.footer__credit{
  display:inline-block;
  margin-top:6px;
  font-size:.6rem;
  color:rgba(255,255,255,0.18);
  transition:color 0.2s;
}
.footer__credit:hover{color:rgba(255,255,255,0.45)}
.footer__credit strong{font-weight:700}

/* =================== REDUCED MOTION =================== */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:0.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.01ms !important;
  }
  .backdrop__video{transform:none}
  .action-card__shine,
  .reviews-card__btn-shine{display:none !important}
  .reviews-ticker__track{
    animation:none !important;
    overflow-x:auto;
    width:100%;
    scroll-snap-type:x mandatory;
    padding-bottom:6px;
  }
  .review-bubble{
    scroll-snap-align:start;
  }
}

/* =================== RESPONSIVE =================== */

/* 320px - Small phones */
@media (max-width:340px){
  .biolink{padding:18px 8px 16px}
  .biolink__panel{padding:22px 12px 18px;border-radius:18px;background:rgba(14,14,18,0.6)}
  .panel__logo-wrap{width:70px;height:70px}
  .panel__title{font-size:1.15rem}
  .action-card{padding:13px 12px;gap:10px}
  .action-card__icon{width:38px;height:38px;border-radius:10px}
  .action-card__title{font-size:.82rem}
  .action-card__subtitle{font-size:.68rem}
  .map__container{height:160px}
  .reviews-card{padding:18px 14px 16px}
  .reviews-card__score{font-size:2.3rem}
  .reviews-card__btn{font-size:.66rem;padding:10px 14px;min-height:48px}
  .review-bubble{width:205px;padding:10px 12px}
}

/* 360px */
@media (min-width:341px) and (max-width:389px){
  .biolink{padding:24px 10px 20px}
  .biolink__panel{padding:28px 16px 22px;border-radius:20px;background:rgba(14,14,18,0.62)}
  .map__container{height:170px}
}

/* 390px-414px */
@media (min-width:390px) and (max-width:450px){
  .biolink{padding:28px 12px 24px}
  .biolink__panel{background:rgba(14,14,18,0.64)}
  .map__container{height:180px}
}

/* Tablets 768px */
@media (min-width:768px){
  .biolink{padding:60px 24px 40px;align-items:center}
  .biolink__panel{max-width:460px;padding:40px 32px 32px}
}

/* Desktop 1024px */
@media (min-width:1024px){
  .biolink{padding:80px 32px 48px;min-height:100vh}
  .biolink__panel{max-width:480px}
  .backdrop__video{filter:brightness(0.68) saturate(1.25)}
}

/* Large Desktop 1440px+ */
@media (min-width:1440px){
  .biolink__panel{max-width:500px;padding:44px 36px 36px}
  .backdrop__video{filter:brightness(0.68) saturate(1.25)}
}