.ide-agoda-banner {
  position: relative;
  display: flex;
  align-items: stretch;
  min-height: 250px;
  margin: 2rem 0 2.5rem;
  border-radius: 18px;
  overflow: hidden;
  background: linear-gradient(135deg, #1e86b4 0%, #0f4960 100%);
  background-size: cover;
  background-position: center center;
  box-shadow: 0 18px 42px rgba(0,0,0,.18);
}

.ide-agoda-banner__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(8,46,60,.84) 0%, rgba(8,46,60,.62) 45%, rgba(8,46,60,.36) 100%);
}

.ide-agoda-banner__content {
  position: relative;
  z-index: 2;
  max-width: 520px;
  padding: 2rem 2rem 2rem 2.1rem;
  color: #fff;
}

.ide-agoda-banner__eyebrow {
  display: inline-block;
  margin-bottom: .75rem;
  padding: .32rem .65rem;
  border-radius: 999px;
  background: rgba(255,255,255,.16);
  color: #f6e0c8;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.ide-agoda-banner__title {
  margin: 0 0 .7rem;
  color: #fff;
  font-size: clamp(1.55rem, 2vw, 2.2rem);
  line-height: 1.1;
}

.ide-agoda-banner__text {
  margin: 0 0 1.15rem;
  color: rgba(255,255,255,.92);
  font-size: 1rem;
  line-height: 1.5;
}

.ide-agoda-banner__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .95rem 1.25rem;
  border-radius: 12px;
  background: linear-gradient(135deg, #35b8c8 0%, #1e86b4 100%);
  color: #fff !important;
  font-weight: 800;
  text-decoration: none !important;
  letter-spacing: .03em;
  text-transform: uppercase;
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.ide-agoda-banner__button:hover,
.ide-agoda-banner__button:focus {
  background: linear-gradient(135deg, #ef7f59 0%, #1e86b4 100%);
  color: #fff !important;
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(0,0,0,.22);
}

@media (max-width: 782px) {
  .ide-agoda-banner {
    min-height: 220px;
    margin: 1.5rem 0 2rem;
  }

  .ide-agoda-banner__overlay {
    background: linear-gradient(180deg, rgba(8,46,60,.78) 0%, rgba(8,46,60,.68) 52%, rgba(8,46,60,.55) 100%);
  }

  .ide-agoda-banner__content {
    max-width: none;
    padding: 1.25rem 1.15rem 1.2rem;
  }

  .ide-agoda-banner__title {
    font-size: 1.45rem;
  }

  .ide-agoda-banner__text {
    font-size: .95rem;
  }

  .ide-agoda-banner__button {
    width: 100%;
    padding: .9rem 1rem;
  }
}

/* Version 1.2.0: dedicated Als Plomari promotion in the Lesbos guide. */
.ide-als-plomari-banner{
  min-height:290px;
  background-position:center 48%;
}
.ide-als-plomari-banner .ide-agoda-banner__overlay{
  background:linear-gradient(90deg,rgba(12,35,46,.84) 0%,rgba(12,35,46,.58) 48%,rgba(12,35,46,.25) 100%);
}
.ide-als-plomari-banner .ide-agoda-banner__eyebrow{
  background:rgba(255,255,255,.18);
  color:#fff;
}
.ide-als-plomari-banner .ide-agoda-banner__button{
  background:linear-gradient(135deg,#35b8c8 0%,#1e86b4 100%);
}
.ide-als-plomari-banner .ide-agoda-banner__button:hover,
.ide-als-plomari-banner .ide-agoda-banner__button:focus{
  background:linear-gradient(135deg,#ef7f59 0%,#1e86b4 100%);
}
@media(max-width:782px){
  .ide-als-plomari-banner{min-height:260px;background-position:center center}
}

/* Version 1.2.1: prevent long mobile CTA labels from escaping banner boxes. */
.ide-agoda-banner,
.ide-agoda-banner__content,
.ide-agoda-banner__button{
  box-sizing:border-box;
  min-width:0;
}
.ide-agoda-banner__title,
.ide-agoda-banner__text,
.ide-agoda-banner__button{
  overflow-wrap:anywhere;
  word-break:normal;
}
.ide-agoda-banner__button{
  max-width:100%;
  white-space:normal;
  text-align:center;
  line-height:1.2;
}
@media(max-width:782px){
  .ide-agoda-banner__button{
    display:flex;
    width:100%;
    min-height:52px;
    padding:.85rem .8rem;
  }
}

/* Version 1.2.2: force high-contrast banner typography and add the À Table Paros promotion. */
body .ide-agoda-banner .ide-agoda-banner__title,
body .ide-agoda-banner .ide-agoda-banner__text,
body .ide-agoda-banner .ide-agoda-banner__content h1,
body .ide-agoda-banner .ide-agoda-banner__content h2,
body .ide-agoda-banner .ide-agoda-banner__content h3,
body .ide-agoda-banner .ide-agoda-banner__content p{
  color:#fff!important;
  text-shadow:0 2px 12px rgba(0,0,0,.55);
}
body .ide-agoda-banner .ide-agoda-banner__eyebrow{
  color:#fff!important;
  text-shadow:none;
}

.ide-atable-paros-banner{
  min-height:330px;
  background-position:center 70%;
}
.ide-atable-paros-banner .ide-agoda-banner__overlay{
  background:linear-gradient(90deg,rgba(9,36,48,.88) 0%,rgba(9,36,48,.64) 46%,rgba(9,36,48,.26) 100%);
}
.ide-atable-paros-banner .ide-agoda-banner__eyebrow{
  background:rgba(255,255,255,.18);
}
.ide-atable-paros-banner .ide-agoda-banner__button{
  background:linear-gradient(135deg,#ef7f59 0%,#1e86b4 100%);
}
.ide-atable-paros-banner .ide-agoda-banner__button:hover,
.ide-atable-paros-banner .ide-agoda-banner__button:focus{
  background:linear-gradient(135deg,#35b8c8 0%,#1e86b4 100%);
}
@media(max-width:782px){
  .ide-atable-paros-banner{
    min-height:285px;
    background-position:center 72%;
  }
}

/* Version 1.2.3: keep promotional typography readable and proportionate. */
body .ide-agoda-banner .ide-agoda-banner__title{
  max-width:30ch;
  font-size:clamp(1.35rem,2vw,1.9rem)!important;
  line-height:1.18!important;
  letter-spacing:.01em!important;
}
body .ide-agoda-banner .ide-agoda-banner__text{
  max-width:38ch;
  font-size:clamp(.98rem,1.35vw,1.12rem)!important;
  line-height:1.48!important;
  letter-spacing:0!important;
}
body .ide-agoda-banner .ide-agoda-banner__content{
  max-width:620px;
}
@media(max-width:782px){
  body .ide-agoda-banner .ide-agoda-banner__title{
    font-size:1.22rem!important;
    line-height:1.22!important;
  }
  body .ide-agoda-banner .ide-agoda-banner__text{
    font-size:.96rem!important;
    line-height:1.45!important;
  }
}

/* Version 1.2.4: sister-site banners at the end of selected island guides. */
.ide-sister-site-banner{
  position:relative;
  display:block;
  min-height:300px;
  margin:3rem 0 2.5rem;
  border-radius:20px;
  overflow:hidden;
  background:linear-gradient(135deg,#1e86b4 0%,#0f4960 100%);
  background-size:cover;
  background-position:center center;
  box-shadow:0 18px 42px rgba(0,0,0,.16);
}
.ide-sister-site-banner__overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(7,37,50,.88) 0%,rgba(7,37,50,.68) 50%,rgba(7,37,50,.28) 100%);
}
.ide-sister-site-banner__content{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(120px,190px) minmax(0,1fr);
  gap:1.6rem;
  align-items:center;
  min-height:300px;
  padding:2rem 2.1rem;
  box-sizing:border-box;
}
.ide-sister-site-banner__logo-wrap{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:145px;
  padding:1rem;
  border-radius:16px;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(6px);
  box-sizing:border-box;
}
.ide-sister-site-banner__logo{
  display:block;
  width:auto;
  max-width:100%;
  max-height:115px;
  object-fit:contain;
}
.ide-sister-site-banner__copy{
  min-width:0;
  color:#fff;
}
.ide-sister-site-banner__eyebrow{
  margin-bottom:.55rem;
  color:#f5d7bd;
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.ide-sister-site-banner__title{
  margin:0 0 .65rem!important;
  color:#fff!important;
  font-size:clamp(1.55rem,2.2vw,2.2rem)!important;
  line-height:1.12!important;
  text-shadow:0 2px 14px rgba(0,0,0,.55);
}
.ide-sister-site-banner__tagline{
  max-width:42ch;
  margin:0 0 1.1rem!important;
  color:rgba(255,255,255,.95)!important;
  font-size:clamp(1rem,1.35vw,1.13rem)!important;
  line-height:1.5!important;
  text-shadow:0 2px 12px rgba(0,0,0,.48);
}
.ide-sister-site-banner__button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  max-width:100%;
  min-height:50px;
  padding:.85rem 1.2rem;
  border-radius:11px;
  background:linear-gradient(135deg,#35b8c8 0%,#1e86b4 100%);
  color:#fff!important;
  font-weight:800;
  letter-spacing:.04em;
  text-decoration:none!important;
  text-transform:uppercase;
  box-shadow:0 10px 24px rgba(0,0,0,.2);
  transition:transform .18s ease,background .18s ease,box-shadow .18s ease;
  box-sizing:border-box;
}
.ide-sister-site-banner__button:hover,
.ide-sister-site-banner__button:focus{
  background:linear-gradient(135deg,#ef7f59 0%,#1e86b4 100%);
  color:#fff!important;
  transform:translateY(-1px);
  box-shadow:0 14px 28px rgba(0,0,0,.24);
}
.ide-sister-site-banner__domain{
  display:block;
  margin-top:.75rem;
  color:rgba(255,255,255,.78);
  font-size:.88rem;
  letter-spacing:.02em;
  overflow-wrap:anywhere;
}
@media(max-width:782px){
  .ide-sister-site-banner{
    min-height:0;
    margin:2rem 0 2.25rem;
    background-position:center center;
  }
  .ide-sister-site-banner__overlay{
    background:linear-gradient(180deg,rgba(7,37,50,.58) 0%,rgba(7,37,50,.78) 54%,rgba(7,37,50,.9) 100%);
  }
  .ide-sister-site-banner__content{
    grid-template-columns:1fr;
    gap:1rem;
    min-height:0;
    padding:1.2rem;
  }
  .ide-sister-site-banner__logo-wrap{
    width:min(220px,75%);
    min-height:100px;
    margin:0 auto;
    padding:.8rem;
  }
  .ide-sister-site-banner__logo{
    max-height:82px;
  }
  .ide-sister-site-banner__copy{
    text-align:center;
  }
  .ide-sister-site-banner__title{
    font-size:1.5rem!important;
  }
  .ide-sister-site-banner__tagline{
    margin-left:auto!important;
    margin-right:auto!important;
    font-size:.98rem!important;
  }
  .ide-sister-site-banner__button{
    width:100%;
    white-space:normal;
    text-align:center;
  }
}

/* Version 1.2.5: discreet language note for English-language sister websites. */
.ide-sister-site-banner__language-note{
  display:inline-block;
  margin-top:.75rem;
  margin-right:.7rem;
  padding:.28rem .55rem;
  border:1px solid rgba(255,255,255,.34);
  border-radius:999px;
  background:rgba(7,37,50,.28);
  color:rgba(255,255,255,.88);
  font-size:.74rem;
  font-weight:700;
  letter-spacing:.03em;
}
@media(max-width:782px){
  .ide-sister-site-banner__language-note{
    margin-right:.35rem;
  }
}


/* Version 1.2.6: place the English-site note at the desktop banner's bottom-right. */
@media (min-width:783px){
  .ide-sister-site-banner__language-note{
    position:absolute;
    right:1.35rem;
    bottom:1.15rem;
    z-index:3;
    margin:0;
  }
}