:root{
  --paper: #FFFDF6;
  --ink: #10192B;
  --yellow: #FFCC00;
  --yellow-deep: #E0AE00;
  --blue: #4687FF;
  --blue-deep: #2E5FE0;
  --line: #10192B;
}
*{box-sizing:border-box; margin:0; padding:0;}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:'Space Mono', monospace;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
@media (prefers-reduced-motion: reduce){ *{animation:none !important; transition:none !important;} }
a{color:inherit; text-decoration:none;}
.wrap{max-width:1100px; margin:0 auto; padding:0 28px;}
.display{font-family:'Fredoka', sans-serif; font-weight:700;}

/* NAV */
nav{padding:22px 0;}
nav .wrap{display:flex; align-items:center; justify-content:space-between;}
.logo{display:flex; align-items:center; gap:9px;}
.brand-logo{height:42px; width:auto; display:block;}
.nav-links{display:flex; align-items:center; gap:26px;}
.nav-link{font-family:'Fredoka', sans-serif; font-weight:600; font-size:14px;}
.nav-link:hover{color:var(--blue);}
.nav-cta{
  background:var(--ink); color:var(--paper); font-weight:700; font-size:14px;
  padding:10px 20px; border-radius:30px; font-family:'Fredoka', sans-serif;
  border:2px solid var(--ink);
}
.nav-cta:hover{background:var(--blue); border-color:var(--blue);}
.nav-cta{white-space:nowrap;}
@media (max-width:640px){
  nav .wrap{flex-wrap:wrap; gap:14px;}
  .nav-links{width:100%; justify-content:space-between; gap:14px;}
}

/* HERO */
.hero{padding:70px 0 30px; position:relative;}
.hero-inner{max-width:640px; margin:0 auto; text-align:center; position:relative; z-index:2;}
.eyebrow{
  display:inline-block; background:var(--ink); color:var(--yellow);
  font-size:12px; font-weight:700; letter-spacing:2px; padding:6px 14px;
  border-radius:20px; margin-bottom:22px; transform:rotate(-2deg);
}
h1{
  font-size:clamp(46px, 8vw, 78px); line-height:0.98; letter-spacing:-1px;
}
h1 .hl{ background:var(--yellow); padding:0 8px; border-radius:8px; box-decoration-break:clone; -webkit-box-decoration-break:clone;}
.sub{font-size:15px; line-height:1.6; max-width:420px; margin:22px auto 30px; opacity:0.85;}

.hero-actions{display:flex; gap:12px; flex-wrap:wrap; align-items:center; justify-content:center;}
.search-wrap{position:relative; width:100%; max-width:680px; margin:0 auto;}
.cta-pill{
  display:flex; align-items:center; background:var(--paper); border:3px solid var(--ink);
  border-radius:56px; padding:10px 10px 10px 32px; gap:14px; width:100%; margin:0 auto;
}
.cta-pill input{
  border:none; background:transparent; font-family:'Space Mono', monospace; font-size:18px;
  outline:none; flex:1; min-width:0; color:var(--ink);
}
.cta-pill input::placeholder{color:#9098A8;}
.go-btn{
  background:var(--blue); color:#fff; border:none; font-family:'Fredoka', sans-serif;
  font-weight:700; font-size:17px; padding:16px 32px; border-radius:44px; cursor:pointer;
  white-space:nowrap;
}
.go-btn:hover{background:var(--blue-deep);}
@media (max-width:640px){
  .cta-pill{padding:8px 8px 8px 22px; gap:8px;}
  .cta-pill input{font-size:15px;}
  .go-btn{font-size:14px; padding:13px 20px;}
}

/* Search suggestions dropdown */
.suggest-dropdown{
  position:absolute; top:calc(100% + 8px); left:0; right:0; z-index:10;
  background:var(--paper); border:2.5px solid var(--ink); border-radius:20px;
  overflow:hidden; text-align:left; box-shadow:0 8px 20px rgba(16,25,43,0.12);
}
.suggest-item{
  display:flex; align-items:center; gap:10px; padding:12px 20px; cursor:pointer;
  border-bottom:1px solid #EFEAD8;
}
.suggest-item:last-child{border-bottom:none;}
.suggest-item:hover, .suggest-item.active{background:var(--yellow);}
.suggest-flag{font-size:18px;}
.suggest-name{font-family:'Fredoka', sans-serif; font-weight:600; font-size:14px; flex:1;}
.suggest-region{font-size:10px; letter-spacing:1px; opacity:0.55; text-transform:uppercase;}

/* floating stickers, decorative */
.sticker{
  position:absolute; font-family:'Fredoka', sans-serif; font-weight:700; font-size:13px;
  padding:10px 16px; border-radius:40px; border:2.5px solid var(--ink);
  white-space:nowrap; background:var(--paper);
}
.s1{top:6%; right:2%; background:var(--yellow); transform:rotate(7deg);}
.s2{top:38%; right:14%; background:var(--blue); color:#fff; transform:rotate(-6deg);}
.s3{top:64%; right:0%; background:var(--paper); transform:rotate(4deg);}
.s4{top:88%; right:22%; background:var(--yellow); transform:rotate(-4deg);}
.l1{top:10%; left:1%; background:var(--blue); color:#fff; transform:rotate(-7deg);}
.l2{top:36%; left:15%; background:var(--paper); transform:rotate(6deg);}
.l3{top:62%; left:0%; background:var(--yellow); transform:rotate(-5deg);}
.l4{top:86%; left:18%; background:var(--paper); transform:rotate(5deg);}
@media (max-width:860px){ .sticker{display:none;} }

/* SIM strip */
.sim-strip{padding:30px 0 46px; border-top:2.5px dashed var(--ink); border-bottom:2.5px dashed var(--ink); margin-top:20px;}
.sim-strip .wrap{display:flex; justify-content:space-between; flex-wrap:wrap; gap:16px;}
.stat{display:flex; align-items:baseline; gap:8px;}
.stat b{font-family:'Fredoka', sans-serif; font-size:26px;}
.stat span{font-size:11px; letter-spacing:1px; opacity:0.65;}

/* WORKS WITH */
.works{padding:40px 0; text-align:center;}
.works p{font-size:11px; letter-spacing:2px; opacity:0.55; margin-bottom:16px;}
.chip-row{display:flex; justify-content:center; gap:10px; flex-wrap:wrap;}
.chip{
  border:2.5px solid var(--ink); border-radius:20px; padding:7px 16px; font-size:12px; font-weight:700;
  font-family:'Fredoka', sans-serif; background:var(--paper); transition:transform 0.15s;
}
.chip:nth-child(1){background:var(--yellow); transform:rotate(-4deg);}
.chip:nth-child(2){background:var(--blue); color:#fff; transform:rotate(3deg);}
.chip:nth-child(3){background:var(--paper); transform:rotate(-3deg);}
.chip:nth-child(4){background:var(--yellow); transform:rotate(4deg);}
.chip:nth-child(5){background:var(--paper); transform:rotate(-2deg);}
.chip:hover{transform:rotate(0deg) scale(1.06);}

/* FOOTER CTA */
.foot-cta{padding:70px 0 40px; text-align:center; position:relative;}
.fs1{top:6%; left:6%; background:var(--yellow); transform:rotate(-6deg);}
.fs2{top:10%; right:6%; background:var(--blue); color:#fff; transform:rotate(5deg);}
@media (max-width:860px){ .fs1, .fs2{display:none;} }
.foot-cta h2{font-size:clamp(32px,6vw,50px); margin-bottom:6px;}
.foot-cta p{font-size:14px; opacity:0.75; margin-bottom:26px;}
.big-btn{
  display:inline-block; background:var(--ink); color:var(--yellow); font-family:'Fredoka', sans-serif;
  font-weight:700; font-size:16px; padding:16px 34px; border-radius:40px;
}
.big-btn:hover{background:var(--blue); color:#fff;}

footer{padding:26px 0 34px; border-top:2px solid var(--ink);}
footer .wrap{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;}
.footer-logo{height:32px; width:auto; display:block;}
.fine{font-size:10.5px; opacity:0.55; max-width:480px; line-height:1.5;}

/* PAGE HEADER (destinations / blog index + detail pages) */
.page-header{padding:54px 0 30px; text-align:center;}
.page-header h1{font-size:clamp(36px, 6vw, 56px);}
.page-header p{font-size:14px; opacity:0.75; max-width:480px; margin:14px auto 0;}

/* Search / filter bar */
.filter-bar{padding:0 0 30px;}
.filter-bar .wrap{display:flex; gap:10px; flex-wrap:wrap; justify-content:center;}
.filter-input{
  border:2.5px solid var(--ink); border-radius:30px; padding:11px 20px; font-family:'Space Mono', monospace;
  font-size:13px; background:var(--paper); color:var(--ink); outline:none; min-width:220px;
}
.filter-input::placeholder{color:#9098A8;}

/* Destination grid */
.dest-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(220px, 1fr)); gap:16px; padding:20px 0 60px;}
.dest-card{
  border:2.5px solid var(--ink); border-radius:18px; padding:20px; background:var(--paper);
  display:flex; flex-direction:column; gap:8px; transition:transform 0.15s;
}
.dest-card:hover{transform:translateY(-3px);}
.dest-card .flag{font-size:30px;}
.dest-card .name{font-family:'Fredoka', sans-serif; font-weight:700; font-size:17px;}
.dest-card .region{font-size:11px; letter-spacing:1px; opacity:0.6;}
.dest-card .from-price{font-size:12px; margin-top:auto;}
.dest-card .from-price b{font-family:'Fredoka', sans-serif; font-size:16px; color:var(--blue-deep);}

/* Destination detail */
.dest-hero{padding:20px 0 40px; text-align:center;}
.dest-hero .flag-big{font-size:64px;}
.dest-hero h1{font-size:clamp(34px,6vw,54px); margin-top:6px;}
.dest-hero .region-tag{font-size:12px; letter-spacing:1px; opacity:0.6; margin-top:6px;}
.dest-intro{max-width:560px; margin:16px auto 0; font-size:14px; line-height:1.7; opacity:0.85;}

.plan-list{display:flex; flex-direction:column; gap:14px; padding:20px 0 60px;}
.plan-card{
  border:2.5px solid var(--ink); border-radius:18px; padding:20px 22px; background:var(--paper);
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
}
.plan-card .provider{display:flex; align-items:center; gap:12px;}
.plan-card .provider-name{font-family:'Fredoka', sans-serif; font-weight:700; font-size:17px;}
.plan-card .provider-badge{
  font-size:10px; letter-spacing:1px; background:var(--yellow); border:2px solid var(--ink);
  border-radius:20px; padding:3px 10px; font-family:'Fredoka', sans-serif; font-weight:700;
}
.plan-card .specs{display:flex; gap:20px; flex-wrap:wrap; font-size:13px;}
.plan-card .specs b{font-family:'Fredoka', sans-serif; font-size:15px; display:block;}
.plan-card .specs span{font-size:10px; letter-spacing:1px; opacity:0.6;}
.plan-card .price{font-family:'Fredoka', sans-serif; font-size:22px; white-space:nowrap;}
.plan-card .price span{font-size:11px; font-family:'Space Mono', monospace; opacity:0.6; font-weight:400;}
.plan-cta{
  background:var(--blue); color:#fff; border:none; font-family:'Fredoka', sans-serif;
  font-weight:700; font-size:13px; padding:12px 22px; border-radius:32px; cursor:pointer; white-space:nowrap;
}
.plan-cta:hover{background:var(--blue-deep);}

/* Blog grid */
.blog-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:20px; padding:20px 0 60px;}
.blog-card{
  border:2.5px solid var(--ink); border-radius:18px; overflow:hidden; background:var(--paper);
  display:flex; flex-direction:column; transition:transform 0.15s;
}
.blog-card:hover{transform:translateY(-3px);}
.blog-card .cover{height:150px; background:var(--yellow); display:flex; align-items:center; justify-content:center; font-size:42px;}
.blog-card .body{padding:18px; display:flex; flex-direction:column; gap:8px; flex:1;}
.blog-card .meta{font-size:10px; letter-spacing:1px; opacity:0.55;}
.blog-card .title{font-family:'Fredoka', sans-serif; font-weight:700; font-size:16px; line-height:1.3;}
.blog-card .excerpt{font-size:12.5px; opacity:0.8; line-height:1.6;}
.blog-card .read-more{font-size:12px; font-weight:700; color:var(--blue-deep); margin-top:auto;}

/* Blog post detail */
.post-header{padding:30px 0 20px; text-align:center;}
.post-header .meta{font-size:11px; letter-spacing:1px; opacity:0.55;}
.post-header h1{font-size:clamp(30px,6vw,46px); margin-top:10px;}
.post-cover{height:260px; background:var(--yellow); border-radius:18px; border:2.5px solid var(--ink); display:flex; align-items:center; justify-content:center; font-size:80px; margin:20px 0 10px;}
.post-body{max-width:640px; margin:0 auto; padding:20px 0 60px; font-size:15px; line-height:1.8;}
.post-body h2{font-family:'Fredoka', sans-serif; font-size:22px; margin:28px 0 12px;}
.post-body p{margin-bottom:16px;}
.post-body ul{margin:0 0 16px 20px;}