/* BHROMI v108 - Home 'Trending cities' section from the mock-up. Numbers are mock-up px (1312px image = 390px phone); change only --xt to scale. Load after explore-redesign.css */
.tc{--xu:calc(1px / 3.9385);--xt:calc(1px / 3.3641);--tc-ff:"Inter","Noto Sans Bengali",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;position:relative;padding:0 calc(44*var(--xt))!important;margin:0;box-sizing:border-box;background:transparent}
.tc *{box-sizing:border-box;font-family:var(--tc-ff)}
.tc-head{position:relative;height:calc(147*var(--xt));margin:0 calc(-44*var(--xt))}
.tc-title{position:absolute;left:calc(45*var(--xt));top:calc(39*var(--xt));margin:0;white-space:nowrap;font-size:calc(58*var(--xt));line-height:1;font-weight:800;letter-spacing:0em;color:#020924}
.tc-title em{font-style:normal;color:#0557ef}
.tc-bar{position:absolute;left:calc(50*var(--xt));top:calc(114*var(--xt));width:calc(73*var(--xt));height:calc(6*var(--xt));border-radius:calc(3*var(--xt));background:#0b5aea}
.tc-bar2{position:absolute;left:calc(134*var(--xt));top:calc(114*var(--xt));width:calc(80*var(--xt));height:calc(6*var(--xt));border-radius:calc(3*var(--xt));background:linear-gradient(90deg,#d1e1f6 0,#d1e1f6 55%,rgba(209,225,246,0) 100%)}
.tc-all{position:absolute;left:calc(1083*var(--xt));top:calc(41*var(--xt));width:calc(184*var(--xt));height:calc(65*var(--xt));border-radius:calc(33*var(--xt));background:#e0ecfe;color:#0950f4;text-decoration:none;display:block;-webkit-tap-highlight-color:transparent}
.tc-all span{position:absolute;left:calc(30*var(--xt));top:calc(20.5*var(--xt));font-size:calc(24*var(--xt));line-height:1;font-weight:700;letter-spacing:0em;white-space:nowrap}
.tc-all svg{position:absolute;left:calc(142*var(--xt));top:calc(25*var(--xt));width:calc(13*var(--xt));height:calc(21*var(--xt));overflow:visible}
.tc-all:active{transform:scale(.97)}
.tc-grid{display:grid;grid-template-columns:1fr 1fr;column-gap:calc(25*var(--xt));row-gap:calc(25*var(--xt));padding-bottom:calc(38*var(--xt))}
.tc-card{position:relative;display:block;height:calc(505*var(--xt));border-radius:calc(28*var(--xt));overflow:hidden;background:#fcfdfe;text-decoration:none;box-shadow:0 calc(14*var(--xt)) calc(34*var(--xt)) calc(-6*var(--xt)) rgba(20,100,250,.18);-webkit-tap-highlight-color:transparent;transition:transform .18s ease}
.tc-card.r2{height:calc(485*var(--xt))}
.tc-card:active{transform:scale(.985)}
.tc-photo{position:absolute;left:0;top:0;width:100%;height:calc(368*var(--xt));object-fit:cover;display:block}
.tc-card.r2 .tc-photo{height:calc(347*var(--xt))}.tc-card.h4 .tc-photo{height:calc(344*var(--xt))}
.tc-name{position:absolute;left:calc(38*var(--xt));top:calc(390*var(--xt));margin:0;font-size:calc(40*var(--xt));line-height:1;font-weight:800;letter-spacing:0em;color:#06093a;white-space:nowrap}
.tc-card.r2 .tc-name{top:calc(369*var(--xt))}
.tc-count{position:absolute;left:calc(92*var(--xt));top:calc(445.5*var(--xt));font-size:calc(27.1*var(--xt));line-height:1;font-weight:400;letter-spacing:0em;color:#566486;white-space:nowrap}
.tc-card.r2 .tc-count{top:calc(423.5*var(--xt))}
.tc-ic{position:absolute;left:calc(38*var(--xt));top:calc(444*var(--xt));width:calc(33*var(--xt));height:calc(32*var(--xt));color:#4f6189}.tc-card.r2 .tc-ic{top:calc(423*var(--xt))}.tc-ic svg{display:block;width:100%;height:100%}
.tc-go{position:absolute;right:calc(28*var(--xt));top:calc(397.5*var(--xt));width:calc(77*var(--xt));height:calc(77*var(--xt));border-radius:50%;background:#e4eefd;display:block}.tc-card.r2 .tc-go{top:calc(376.5*var(--xt))}.tc-go svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.tc-card:nth-child(even) .tc-go{right:calc(30*var(--xt))}
@media (min-width:768px){.tc{max-width:876px;margin-left:auto;margin-right:auto}}
.tc-grid .ex-card{width:auto;height:calc(711*var(--xu));margin:0}
.tc-grid .ex-card.is-first{margin-right:0}

/* ---- /areas page: same header + cards as the home "Explore Cox's Bazar" section (grid layout) ---- */
.ex-areas{--xt:calc(1px / 3.3641);margin-top:14px!important}
.ex-areas .tc-grid{display:grid;grid-template-columns:1fr 1fr;column-gap:calc(25*var(--xt));row-gap:calc(25*var(--xt));padding-bottom:24px}
.ex-areas .ex-card{width:auto;height:calc(711*var(--xu));margin:0}
.ex-areas .ex-card.is-first{margin-right:0}
.ex-areas .ex-card:not(.is-first) .ex-go{right:calc(34*var(--xu))}
@media (min-width:768px){.ex-areas .tc-grid{grid-template-columns:repeat(3,1fr)}}