html, body { overflow-x: hidden; max-width: 100vw; }
    img, video { max-width: 100%; }
body { font-family: 'Inter', sans-serif; }
    .font-display { font-family: 'Poppins', sans-serif; }
    .font-serif-it { font-family: 'Playfair Display', serif; font-style: italic; }

    .hero-bg {
      position: relative;
      background:
        linear-gradient(180deg, rgba(11,36,54,.78) 0%, rgba(11,36,54,.65) 40%, rgba(11,36,54,.88) 100%),
        radial-gradient(1200px 600px at 20% 0%, rgba(1,84,180,.25), transparent 60%),
        url('<?php echo get_template_directory_uri(); ?>/assets/galerii/imgi_62_480683249_1039658081524359_2942312183085501194_n.jpg') center/cover no-repeat,
        #0b2436;
    }
    .hero-bg::after {
      content: '';
      position: absolute; inset: 0;
      background: linear-gradient(180deg, transparent 70%, #fff 100%);
      pointer-events: none;
    }

    .trip {
      display: grid;
      grid-template-columns: 80px 1fr;
      gap: 1.5rem;
      padding: 2.25rem 0;
      border-top: 1px solid rgba(11,36,54,.10);
    }
    .trip:first-of-type { border-top: 0; }
    .trip-num {
      font-family: 'Playfair Display', serif;
      font-style: italic;
      font-weight: 800;
      font-size: 3.25rem;
      line-height: 1;
      color: #0154B4;
    }
    .trip h2 {
      font-family: 'Poppins', sans-serif;
      font-weight: 800;
      font-size: 1.75rem;
      line-height: 1.15;
      color: #0b2436;
      margin: 0 0 .55rem;
    }
    .trip .meta {
      font-size: .85rem;
      color: #0154B4;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: .08em;
      margin-bottom: 1rem;
    }
    .trip p {
      color: rgba(11,36,54,.78);
      line-height: 1.75;
      margin-bottom: .85rem;
    }
    .trip ul { margin: .25rem 0 1rem 0; padding-left: 0; }
    .trip li {
      list-style: none;
      padding-left: 1.5rem;
      position: relative;
      margin-bottom: .4rem;
      color: rgba(11,36,54,.78);
    }
    .trip li::before {
      content: '';
      position: absolute;
      left: 0; top: .65em;
      width: .5rem; height: .5rem;
      border-radius: 9999px;
      background: #0154B4;
    }
    .trip a { color: #0154B4; text-decoration: underline; text-underline-offset: 3px; }
    .trip a:hover { color: #013d82; }
    .icon-box {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 56px; height: 56px;
      border-radius: 14px;
      background: rgba(1,84,180,.08);
      color: #0154B4;
      margin-bottom: 1rem;
    }
    .icon-box svg { width: 30px; height: 30px; }

    .trip.ours {
      background: linear-gradient(135deg, #0b2436 0%, #0e3a5a 100%);
      color: #fff;
      border-radius: 1.5rem;
      padding: 2.5rem;
      margin: 1.25rem 0;
      border: 0;
      position: relative;
      overflow: hidden;
    }
    .trip.ours::before {
      content: '';
      position: absolute;
      top: -60px; right: -60px;
      width: 240px; height: 240px;
      background: radial-gradient(circle, rgba(1,84,180,.5), transparent 70%);
      pointer-events: none;
    }
    .trip.ours .trip-num { color: #62a4ff; }
    .trip.ours h2 { color: #fff; }
    .trip.ours p { color: rgba(255,255,255,.85); }
    .trip.ours li { color: rgba(255,255,255,.85); }
    .trip.ours li::before { background: #62a4ff; }
    .trip.ours .meta { color: #62a4ff; }
    .trip.ours .icon-box { background: rgba(255,255,255,.10); color: #fff; }
    .trip.ours a:not(.cta) { color: #62a4ff; }
    .trip.ours .badge {
      display: inline-block;
      background: #0154B4;
      color: #fff;
      font-size: .7rem;
      font-weight: 700;
      letter-spacing: .12em;
      text-transform: uppercase;
      padding: .35rem .75rem;
      border-radius: 9999px;
      margin-bottom: .85rem;
    }
    .trip.ours .cta {
      display: inline-flex;
      align-items: center;
      gap: .5rem;
      background: #fff;
      color: #0b2436;
      font-weight: 700;
      padding: .85rem 1.5rem;
      border-radius: 9999px;
      text-decoration: none;
      margin-top: .5rem;
      transition: transform .25s ease, background .25s ease;
    }
    .trip.ours .cta:hover { transform: translateY(-2px); background: #62a4ff; color: #fff; }

    .toc a {
      display: block;
      padding: .55rem .8rem;
      border-radius: .5rem;
      color: rgba(11,36,54,.72);
      font-size: .9rem;
      text-decoration: none;
      transition: background .2s ease, color .2s ease;
    }
    .toc a:hover { background: rgba(1,84,180,.08); color: #0154B4; }
    .toc a span.n { color: #0154B4; font-weight: 700; margin-right: .5rem; font-family: 'Playfair Display', serif; font-style: italic; }

    
    .ext-link { margin-top: .25rem; }
    .ext-link a { display: inline-flex; align-items: center; gap: .35rem; font-size: .85rem; font-weight: 600; color: #0154B4; text-decoration: none; padding: .4rem .85rem; border: 1px solid rgba(1,84,180,.25); border-radius: 9999px; transition: background .2s ease, border-color .2s ease; }
    .ext-link a:hover { background: rgba(1,84,180,.08); border-color: #0154B4; }
    
    @media (max-width: 640px) {
      .trip { grid-template-columns: 1fr; gap: .25rem; padding: 1.75rem 0; }
      .trip-num { font-size: 2.5rem; }
      .trip.ours { padding: 1.75rem; }
    }