/* ============================================================
 * @file_version 1.0.0
 * VOGO ro/index.php — extracted inline <style> blocks (7 total).
 * Concatenated in document order. Page links this single file.
 * ============================================================ */

/* === Block 1 === */
.imp-btn {
      display: inline-flex; align-items: center; gap: 8px;
      padding: 13px 22px;
      border-radius: 5px;
      font-weight: 700; font-size: .98rem;
      text-decoration: none; border: 1px solid transparent; cursor: pointer;
      transition: transform .15s ease, box-shadow .2s ease, background .2s ease;
      font-family: inherit;
    }
    .imp-btn:hover { transform: translateY(-1px); text-decoration: none; }
    .imp-btn-primary {
      background: #0f619b; color: #fff;
      box-shadow: 0 8px 20px rgba(15, 97, 155, 0.25);
    }
    .imp-btn-primary:hover { background: #0a4d7a; }
    .imp-btn-primary.is-rbl-green {
      background: linear-gradient(135deg, #7cb928, #639b22);
      color: #fff;
      box-shadow: none;
    }
    .imp-btn-primary.is-rbl-green:hover {
      background: linear-gradient(135deg, #639b22, #4d7a1a);
    }
    .imp-btn-primary.is-rbl-black {
      background: #000b17;
      color: #fff;
      box-shadow: none;
      border: 1px solid #1a2940;
    }
    .imp-btn-primary.is-rbl-black:hover {
      background: #0f1e30;
      border-color: #2a3850;
    }
    /* Red */
    .imp-btn-primary.is-rbl-red {
      background: linear-gradient(135deg, #dc2626, #b91c1c);
      color: #fff;
      box-shadow: none;
    }
    .imp-btn-primary.is-rbl-red:hover {
      background: linear-gradient(135deg, #b91c1c, #991b1b);
    }
    .imp-btn-ghost {
      background: transparent; color: #18221f;
      border-color: #18221f;
    }
    .imp-btn-ghost:hover { background: #18221f; color: #fff; }
    .imp-btn svg { width: 18px; height: 18px; }
    .imp-hero-actions {
      display: flex; flex-wrap: wrap; gap: 12px;
    }
    /* Compress to fit all 5 hero buttons on one row + center inside hero-content column.
       Note: /general/styles.css makes .hero-actions a CSS grid (cols for .hero-buttons +
       .climate-badge). Override to flex since we only have .imp-hero-actions as child. */
    .hero-content .hero-actions { display: flex; justify-content: center; }
    .hero-content .imp-hero-actions { gap: 8px; flex-wrap: nowrap; justify-content: center; }
    .hero-content .imp-btn { padding: 10px 14px; font-size: .85rem; white-space: nowrap; }
    /* Tablet — start allowing wrap when 5 buttons no longer fit comfortably. */
    @media (max-width: 900px) {
      .hero-content .imp-hero-actions { flex-wrap: wrap; gap: 10px; }
      .hero-content .imp-btn { padding: 11px 16px; font-size: .92rem; }
    }
    /* Phone — full-width buttons stacked, one per row. */
    @media (max-width: 540px) {
      .hero-content .imp-hero-actions { gap: 8px; }
      .hero-content .imp-btn { padding: 12px 18px; font-size: .95rem; flex: 1 1 100%; justify-content: center; }
    }

    /* "Beneficii și performanță" band — vogo black-blue style (matches generator hero band + go-top button). */
    .solution-chooser-band-section { background: #000b17; }
    .solution-chooser-band-section h2 { color: #fff; }
    .solution-chooser-band-section .section-intro,
    .solution-chooser-band-section .section-intro * { color: rgba(255,255,255,0.85); }
    .solution-chooser-band-section .section-intro strong,
    .solution-chooser-band-section .section-intro b { color: #fff; }
    .solution-chooser-band-section a { color: #7ed957; }
    .solution-chooser-band-section a:hover { color: #a3e87a; }

    /* "Certificări" band — same vogo black-blue style. */
    .trust-section { background: #000b17; }
    .trust-section h2 { color: #fff; }
    .trust-section .eyebrow { color: #7ed957; }
    .trust-section p { color: rgba(255,255,255,0.85); }
    .trust-section .badge-iso-card { background: #fff; border-radius: 10px; padding: 6px; }
    .trust-section .badge-iso-card figcaption { color: #18221f; }

    /* "Pachete servicii" band — same vogo black-blue style. */
    .service-packages-section { background: #000b17; }
    .service-packages-section .service-packages-title { color: #fff; }
    .service-packages-section .service-package-card { background: #fff; }
    .service-packages-section .service-package-card h4 { color: #0a4d7a; }
    .service-packages-section .service-package-card .service-package-price { color: #10b981; }

/* === Block 2 === */
.vogo-logos .track{
      display:flex; gap:var(--gap); align-items:center; will-change:transform;
      min-width:max-content;                    /* <<< important: pista are latimea continutului */
      animation:vogo-marquee var(--speed,120s) linear infinite;
    }
    .vogo-logos .track > a{
      display:flex; align-items:center; justify-content:center; height:var(--row-height);
      flex:0 0 auto;
    }
    /* Body needs padding-bottom so content isn't hidden behind the fixed band.
       Total band height ≈ row-height(65) + padding-y(12+18) = 95px. */
    body{ padding-bottom: 100px; }
    .vogo-logos img{
      max-height:100%;
      max-width:var(--maxw,320px);
      width:auto; height:auto; object-fit:contain;
      filter:none;
      opacity:1; transition:filter .2s, opacity .2s, transform .2s;
    }
    /* Square-aspect logos (DHL, UPS) look ~3× smaller visually than wide logos
       because they're height-constrained instead of width-constrained. Scale up. */
    .vogo-logos img[alt="DHL"],
    .vogo-logos img[alt="UPS"] {
      transform: scale(1.4);
      transform-origin: center;
    }
    .vogo-logos a:hover img{ filter:none; opacity:1; transform:scale(1.03); }

    .vogo-logos::before,.vogo-logos::after{
      content:""; position:absolute; top:0; bottom:0; width:var(--fade-w); pointer-events:none;
      background:linear-gradient(to right,#fff,rgba(255,255,255,0)); z-index:2;
    }
    .vogo-logos::after{ right:0; transform:scaleX(-1); } .vogo-logos::before{ left:0; }

    .vogo-logos:hover .track{ animation-play-state:paused; }

    /* animatie pe GPU + fallback durata */
    @keyframes vogo-marquee {
      from { transform:translate3d(0,0,0) }
      to   { transform:translate3d(-50%,0,0) } /* set duplicat în render → loop seamless */
    }

    @media (max-width:767px){
      .vogo-logos{ --row-height:48px; --gap:36px; --fade-w:64px; --speed:30s; }
    }

/* === Block 3 === */
/* Scoped carousel CSS — info30-style guide-mode (1 image per slide, manual nav) */
        .imp-extra-carousel { position: relative; margin-top: 30px; }
        .imp-extra-viewport { overflow: hidden; margin: 0; }
        .imp-extra-track {
          display: flex; flex-wrap: nowrap;
          transition: transform .55s cubic-bezier(.4, 0, .2, 1);
          will-change: transform;
        }
        .imp-extra-item {
          flex: 0 0 calc(50% - 30px);
          margin: 0 15px;
          padding: 10px;
          background: #fff;
          border: 6px solid #dcdcdc;
          border-radius: 5px;
          box-shadow: 0 2px 4px rgba(0, 0, 0, 0.10);
          text-decoration: none;
          color: inherit;
          cursor: pointer;
          transition: transform .2s ease, box-shadow .25s ease, border-color .2s ease;
        }
        .imp-extra-item:hover {
          transform: translateY(-3px);
          box-shadow: 0 8px 18px rgba(0, 0, 0, 0.14);
          border-color: #0f619b;
          text-decoration: none;
        }
        .imp-extra-item img {
          width: 100%; display: block;
          aspect-ratio: 4 / 3;
          object-fit: contain;
          object-position: center;
          background: #fff;
        }
        .imp-extra-arrow {
          position: absolute;
          top: 50%; transform: translateY(-50%);
          z-index: 10;
          width: 56px; height: 56px;
          border-radius: 50%;
          border: 0;
          background: rgba(255, 255, 255, 0.92);
          color: #18221f;
          cursor: pointer;
          display: inline-flex; align-items: center; justify-content: center;
          box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
          transition: background .2s ease, color .2s ease, transform .2s ease;
          padding: 0; font-family: inherit;
          backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
        }
        .imp-extra-arrow:hover {
          background: #0f619b; color: #fff;
          transform: translateY(-50%) scale(1.08);
        }
        .imp-extra-arrow svg { width: 26px; height: 26px; }
        .imp-extra-prev { left: 18px; }
        .imp-extra-next { right: 18px; }
        .imp-extra-dots {
          display: flex; justify-content: center; gap: 8px;
          margin-top: 22px;
        }
        .imp-extra-dot {
          width: 10px; height: 10px; border-radius: 50%;
          background: #d7dee3; border: 0; padding: 0;
          cursor: pointer;
          transition: background .2s ease, transform .2s ease;
        }
        .imp-extra-dot.is-active { background: #0f619b; transform: scale(1.25); }
        @media (max-width: 720px) {
          .imp-extra-item { padding: 8px; border-width: 4px; }
          .imp-extra-arrow { width: 44px; height: 44px; }
          .imp-extra-arrow svg { width: 20px; height: 20px; }
          .imp-extra-prev { left: 10px; }
          .imp-extra-next { right: 10px; }
        }
        @media (max-width: 560px) {
          .imp-extra-item { flex: 0 0 calc(100% - 20px); margin: 0 10px; }
          .imp-extra-item img { aspect-ratio: 16 / 11; }
        }
        /* Guide mode — single image per slide always */
        .imp-extra-carousel.imp-guide-mode .imp-extra-item {
          flex: 0 0 calc(100% - 30px);
        }
        .imp-extra-carousel.imp-guide-mode .imp-extra-item img {
          aspect-ratio: 16 / 9;
        }
        @media (max-width: 720px) {
          .imp-extra-carousel.imp-guide-mode .imp-extra-item {
            flex: 0 0 calc(100% - 20px);
          }
        }
        .imp-extra-caption {
          display: block;
          margin-top: 12px;
          padding: 0 6px;
          text-align: center;
          font-size: .98rem;
          font-style: italic;
          color: #18221f;
          font-family: 'Cormorant Garamond', serif;
          line-height: 1.45;
        }

/* === Block 4 === */
/* === Imperia template — gallery carousel (verbatim from generator/index.php, vars hardcoded) === */
        .imp-section { padding: 72px 0; }
        .imp-container { width: min(1180px, 92%); margin-inline: auto; }
        .imp-section-title {
          font-size: clamp(1.6rem, 3vw, 2.4rem);
          margin: 0 0 10px; letter-spacing: -.01em;
        }
        .imp-section-kicker {
          font-family: 'Cormorant Garamond', serif;
          color: #0f619b; letter-spacing: .2em;
          text-transform: uppercase; font-size: .92rem;
          margin-bottom: 10px;
        }
        .imp-section-sub {
          color: #5a6561; max-width: 70ch;
          margin: 0 0 36px; font-size: 1.05rem;
        }
        .imp-sub-with-highlight {
          display: grid; gap: 24px;
          grid-template-columns: 1fr;
          align-items: start;
          margin: 0 0 36px;
        }
        @media (min-width: 880px) {
          .imp-sub-with-highlight { grid-template-columns: 1.4fr 1fr; gap: 36px; }
        }
        .imp-sub-with-highlight .imp-section-sub { margin: 0; }
        .imp-member-highlight {
          margin: 0;
          padding: 18px 24px;
          background: linear-gradient(135deg, rgba(15,97,155,0.10), rgba(15,97,155,0.04));
          border: 1px dashed #0f619b;
          border-left: 4px solid #0f619b;
          border-radius: 14px;
          color: #18221f;
          font-size: 1.02rem;
          font-weight: 600;
          line-height: 1.5;
          box-shadow: 0 6px 18px rgba(15,97,155,0.10);
        }
        .imp-member-highlight strong {
          color: #0a4d7a;
          font-family: 'Cormorant Garamond', serif;
          font-style: italic; font-weight: 600;
          font-size: 1.2rem;
        }
        .imp-member-highlight::before {
          content: "★"; color: #0f619b;
          margin-right: 8px; font-size: .95rem;
        }
        .imp-gallery-section {
          background: #f6f8fb;
          overflow: hidden;
        }
        .imp-reel-viewport {
          width: 100%; overflow: hidden;
          position: relative;
          padding: 14px 0 18px;
          -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
                  mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
        }
        .imp-reel-track {
          display: flex; gap: 22px;
          width: max-content; align-items: center;
          animation: imp-marquee 60s linear infinite;
          will-change: transform;
        }
        .imp-reel-viewport:hover .imp-reel-track { animation-play-state: paused; }
        @keyframes imp-marquee {
          from { transform: translate3d(0, 0, 0); }
          to   { transform: translate3d(-50%, 0, 0); }
        }
        .imp-reel-item { flex: 0 0 auto; }
        .imp-reel-item img {
          height: clamp(360px, 50vh, 540px);
          width: auto; display: block;
          border-radius: 22px;
          background: #0b0b0b;
          border: 1px solid #e6dfce;
          box-shadow: 0 18px 40px rgba(15, 97, 155, 0.10), 0 2px 8px rgba(24, 34, 31, 0.05);
          object-fit: contain;
        }
        @media (max-width: 600px) {
          /* Mobile: keep auto-scroll animation (same 60s as desktop, per user request 2026-05-11).
             Only override what differs visually: smaller img height and tighter gap. */
          .imp-reel-item img { height: 62vh; max-height: 460px; }
          .imp-reel-track { gap: 16px; }
        }
        @media (prefers-reduced-motion: reduce) and (min-width: 601px) {
          /* Desktop fallback for reduced-motion users — replace animation with manual scroll */
          .imp-reel-track { animation: none; }
          .imp-reel-viewport { overflow-x: auto; }
        }

/* === Block 5 === */
.solution-chooser-band-section h2 { font-size: clamp(1.8rem, 3.2vw, 2.4rem); margin: 0 0 28px; color:#fff; letter-spacing: -.01em; }
      .solution-chooser-band-section .imp-stats-grid {
        display: grid; gap: 18px;
        grid-template-columns: 1fr;
        margin-top: 0;
      }
      @media (min-width: 700px) { .solution-chooser-band-section .imp-stats-grid { grid-template-columns: 1fr 1fr 1fr; } }
      .solution-chooser-band-section .imp-stat {
        background: #fff;
        border: 1px solid #e6dfce;
        border-radius: 16px;
        padding: 22px;
        box-shadow: 0 6px 18px rgba(15, 97, 155, 0.10);
        display: flex; align-items: flex-start; gap: 14px;
      }
      .solution-chooser-band-section .imp-stat-icon {
        flex: 0 0 auto;
        width: 44px; height: 44px;
        border-radius: 12px;
        background: rgba(15, 97, 155, 0.10);
        color: #0f619b;
        display: inline-flex; align-items: center; justify-content: center;
      }
      .solution-chooser-band-section .imp-stat-icon svg { width: 22px; height: 22px; }
      .solution-chooser-band-section .imp-stat-content { flex: 1 1 auto; }
      .solution-chooser-band-section .imp-stat-num {
        font-size: clamp(1.8rem, 3.2vw, 2.4rem);
        font-weight: 800; color: #0a4d7a;
        line-height: 1.1; margin: 0 0 4px;
      }
      .solution-chooser-band-section .imp-stat-label { color: #5a6561; font-size: .92rem; margin: 0; line-height: 1.4; }
      .solution-chooser-band-section .imp-grid-2 {
        display: grid; gap: 22px;
        grid-template-columns: 1fr;
        margin-top: 30px;
      }
      @media (min-width: 820px) { .solution-chooser-band-section .imp-grid-2 { grid-template-columns: 1fr 1fr; } }
      .solution-chooser-band-section .imp-direction {
        background: #fff;
        border: 1px solid #e6dfce;
        border-radius: 18px;
        padding: 32px 30px;
        box-shadow: 0 18px 40px rgba(15, 97, 155, 0.10), 0 2px 8px rgba(24, 34, 31, 0.05);
        display: flex; flex-direction: column; gap: 14px;
        transition: transform .2s ease, border-color .25s ease;
      }
      .solution-chooser-band-section .imp-direction:hover {
        transform: translateY(-4px);
        border-color: #0f619b;
      }
      .solution-chooser-band-section .imp-direction-tag {
        display: inline-block; align-self: flex-start;
        background: rgba(15, 97, 155, 0.10); color: #0a4d7a;
        padding: 6px 14px; border-radius: 999px;
        font-size: .8rem; letter-spacing: .12em;
        text-transform: uppercase; font-weight: 700;
      }
      .solution-chooser-band-section .imp-direction-tag.tag-green { background: rgba(16, 185, 129, 0.14); color: #059669; }
      .solution-chooser-band-section .imp-direction.is-green { border-left: 4px solid #10b981; }
      .solution-chooser-band-section .imp-direction.is-green:hover { border-color: #10b981; }
      .solution-chooser-band-section .imp-direction h3 { margin: 0; font-size: 1.4rem; line-height: 1.25; color: #18221f; }
      .solution-chooser-band-section .imp-direction ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
      .solution-chooser-band-section .imp-direction ul.has-icons li {
        padding-left: 0; display: flex; align-items: flex-start; gap: 12px;
        color: #18221f; font-size: .98rem;
      }
      .solution-chooser-band-section .imp-direction ul.has-icons li svg {
        flex: 0 0 auto; width: 18px; height: 18px; margin-top: 3px; color: #0f619b;
      }
      .solution-chooser-band-section .imp-direction.is-green ul.has-icons li svg { color: #10b981; }
      .solution-chooser-band-section .imp-callout {
        margin-top: 30px;
        background: #fff;
        border: 1px dashed #0f619b;
        border-left: 4px solid #0f619b;
        border-radius: 16px;
        padding: 28px 32px;
        box-shadow: 0 6px 18px rgba(15, 97, 155, 0.10);
      }
      .solution-chooser-band-section .imp-callout h3 { margin: 0 0 10px; font-size: 1.4rem; color: #18221f; }
      .solution-chooser-band-section .imp-callout p { margin: 0; color: #18221f; font-size: 1.05rem; }

/* === Block 6 === */
.imp-video-section {
      position: relative;
      padding: 90px 0 100px;
      background:
        radial-gradient(900px 380px at 82% 18%, rgba(184,153,104,0.20), transparent 60%),
        radial-gradient(900px 480px at 12% 88%, rgba(15,97,155,0.28), transparent 60%),
        #0e1a2e;
      color: #f4ead5;
      overflow: hidden;
    }
    .imp-video-section::before {
      content: ""; position: absolute; inset: 0; pointer-events: none;
      background-image: repeating-linear-gradient(45deg, rgba(255,255,255,.012) 0 2px, transparent 2px 5px);
      opacity: .6;
    }
    .imp-video-section .imp-section-kicker { color: #9ec9eb; }
    .imp-video-section .imp-section-title {
      color: #fff;
      font-size: clamp(2.2rem, 5.4vw, 4.4rem);
      letter-spacing: -.02em; line-height: 1.02;
      margin-bottom: 18px;
    }
    .imp-video-section .imp-section-title em {
      font-family: 'Cormorant Garamond', serif;
      font-style: italic; font-weight: 500;
      color: #b89968;
    }
    .imp-video-section .imp-section-sub {
      color: rgba(244,234,213,.78);
      font-size: 1.08rem; max-width: 60ch; margin-bottom: 44px;
    }
    .imp-video-grid { display: grid; gap: 30px; grid-template-columns: 1fr; }
    .imp-video-shorts-row { display: grid; gap: 30px; grid-template-columns: 1fr; }
    @media (min-width: 720px) {
      .imp-video-shorts-row { grid-template-columns: 1fr 1fr 1fr; align-items: stretch; }
    }
    .imp-video-card {
      position: relative;
      background: rgba(255,255,255,0.035);
      border: 1px solid rgba(184,153,104,0.20);
      border-radius: 22px;
      padding: 34px 30px 30px;
      display: flex; flex-direction: column;
      overflow: visible;
      backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
    }
    .imp-video-card h3 { color: #fff; font-size: 1.35rem; margin: 0 0 8px; }
    .imp-video-card p.imp-video-note {
      color: rgba(244,234,213,.72);
      margin: 0 0 26px; font-size: .98rem; min-height: 48px;
    }
    .imp-video-holder {
      flex: 1; position: relative;
      background: #080f1c;
      border: 1px solid rgba(184,153,104,0.10);
      border-radius: 16px; padding: 16px;
      display: flex; align-items: center; justify-content: center;
      min-height: 380px;
    }
    .imp-yt-facade {
      border: 0; padding: 0; margin: 0; font: inherit; color: inherit;
      -webkit-appearance: none; appearance: none;
      cursor: pointer; position: relative; display: block;
      width: 100%; border-radius: 12px; overflow: hidden;
      background: #050605;
      box-shadow: 0 16px 38px rgba(0,0,0,.45);
      transition: transform .2s ease, box-shadow .25s ease;
    }
    .imp-yt-facade:hover { transform: translateY(-2px); box-shadow: 0 22px 50px rgba(0,0,0,.55); }
    .imp-yt-facade:focus-visible { outline: 2px solid #b89968; outline-offset: 3px; }
    .imp-yt-facade-landscape { aspect-ratio: 16 / 9; }
    .imp-yt-facade-portrait  { aspect-ratio: 9 / 16; max-width: 280px; margin-inline: auto; }
    .imp-yt-thumb { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
    .imp-yt-facade::after {
      content: ""; position: absolute; inset: 0;
      background: linear-gradient(180deg, rgba(0,0,0,0.05) 0%, transparent 35%, rgba(0,0,0,0.55) 100%);
      pointer-events: none;
    }
    .imp-yt-play {
      position: absolute; top: 50%; left: 50%;
      transform: translate(-50%, -50%);
      width: 84px; height: 60px;
      background: rgba(0,0,0,0.82);
      border-radius: 16px;
      display: flex; align-items: center; justify-content: center;
      transition: background .2s ease, transform .2s ease;
      z-index: 2;
    }
    .imp-yt-facade:hover .imp-yt-play {
      background: #cc0000;
      transform: translate(-50%, -50%) scale(1.06);
    }
    .imp-yt-play svg { width: 32px; height: 32px; fill: #fff; margin-left: 4px; }
    .imp-yt-iframe {
      display: block; border: 0; width: 100%;
      border-radius: 12px; background: #050605;
      box-shadow: 0 16px 38px rgba(0,0,0,.45);
    }
    .imp-yt-iframe.imp-yt-landscape { aspect-ratio: 16 / 9; }
    .imp-yt-iframe.imp-yt-portrait  { aspect-ratio: 9 / 16; max-width: 280px; margin-inline: auto; }
    @media (max-width: 520px) {
      .imp-video-holder { min-height: 0; padding: 12px; }
      .imp-video-card { padding: 28px 22px 24px; }
    }
    /* Stickers on video cards */
    .imp-sticker {
      position: absolute; z-index: 5; pointer-events: none;
      white-space: nowrap; font-weight: 700;
    }
    .imp-sticker-gold {
      top: -16px; left: 28px;
      background: linear-gradient(135deg, #b89968, #a07f4d);
      color: #1a1410;
      padding: 9px 18px; border-radius: 999px;
      font-size: .82rem; letter-spacing: .12em;
      text-transform: uppercase;
      box-shadow: 0 10px 22px rgba(184,153,104,0.45), inset 0 1px 0 rgba(255,255,255,0.35);
      animation: imp-bob 4.2s ease-in-out infinite;
      transform: rotate(-3deg);
    }
    .imp-sticker-script {
      top: -2px; right: 24px;
      font-family: 'Cormorant Garamond', serif;
      font-style: italic; font-weight: 600;
      font-size: 1.7rem;
      color: #d9c4a3;
      text-shadow: 0 2px 10px rgba(0,0,0,.6);
      transform: rotate(7deg);
    }
    .imp-sticker-time {
      bottom: 28px; right: 28px;
      background: rgba(0,0,0,.78);
      color: #f4ead5;
      padding: 7px 13px 7px 11px;
      border-radius: 999px;
      font-size: .82rem;
      font-family: ui-monospace, "SF Mono", Menlo, monospace;
      border: 1px solid rgba(184,153,104,0.45);
      backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
      display: inline-flex; align-items: center; gap: 7px;
    }
    .imp-sticker-time::before {
      content: ""; width: 7px; height: 7px; border-radius: 50%;
      background: #b89968;
      box-shadow: 0 0 10px #b89968;
      animation: imp-pulse 1.6s ease-in-out infinite;
    }
    @keyframes imp-bob {
      0%, 100% { transform: translateY(0) rotate(-3deg); }
      50%      { transform: translateY(-4px) rotate(-1deg); }
    }
    @keyframes imp-pulse {
      0%, 100% { opacity: 1; transform: scale(1); }
      50%      { opacity: .35; transform: scale(.85); }
    }
    @media (prefers-reduced-motion: reduce) {
      .imp-sticker-gold, .imp-sticker-time::before { animation: none; }
    }

/* === Block 7 === */
.lang-switcher{
      display:inline-flex;align-items:center;gap:2px;
      padding:4px;border:1px solid #e3e8ec;border-radius:10px;
      background:#fff;font-family:inherit;
    }
    .lang-flag-btn{
      display:inline-flex;align-items:center;justify-content:center;
      width:30px;height:24px;border-radius:6px;
      cursor:pointer;text-decoration:none;
      transition:transform .15s ease, background-color .15s ease, box-shadow .15s ease;
    }
    .lang-flag-btn img{
      width:22px;height:auto;display:block;border-radius:2px;
      box-shadow:0 0 0 1px rgba(15,23,42,.08);
    }
    .lang-flag-btn:not(.is-active):hover{background:#f3f6f8;transform:translateY(-1px)}
    .lang-flag-btn:focus-visible{outline:2px solid #10b981;outline-offset:2px}
    .lang-flag-btn.is-active{
      background:#ecfdf5;
      box-shadow:inset 0 0 0 1.5px #10b981;
      cursor:default;
    }
    .lang-flag-btn.is-active img{box-shadow:0 0 0 1px rgba(15,23,42,.1)}
    @media (max-width:780px){
      .lang-switcher{padding:3px;gap:1px}
      .lang-flag-btn{width:28px;height:22px}
      .lang-flag-btn img{width:20px}
    }

    .lang-suggest{
      position:fixed;left:50%;bottom:16px;transform:translateX(-50%);
      max-width:calc(100vw - 24px);
      display:flex;align-items:center;gap:10px;
      padding:9px 12px 9px 14px;border-radius:999px;
      background:#0f172a;color:#fff;font-size:12.5px;font-weight:500;
      box-shadow:0 12px 30px rgba(0,0,0,.25);z-index:9999;
      white-space:nowrap;
    }
    .lang-suggest a{color:#7ef4c8;text-decoration:underline;font-weight:700;white-space:nowrap}
    .lang-suggest button{
      appearance:none;border:0;background:transparent;color:#9aa5ad;
      cursor:pointer;font-size:18px;line-height:1;padding:0 4px;border-radius:6px;
      flex-shrink:0;
    }
    .lang-suggest button:hover{color:#fff;background:rgba(255,255,255,.1)}
    @media (max-width:420px){
      .lang-suggest{font-size:11.5px;padding:8px 10px 8px 12px;bottom:12px}
    }