/*!
 * Rhyme Export — Premium Navbar Styles
 * Generated by: Claude Design + Manual cleanup
 * Theme: rhymexport-tema
 * Version: 1.0
 *
 * Sınıf prefix: .rhx-nav, .rhx-mega, .rhx-submenu, .rhx-search-panel, .rhx-mobile-panel
 * Çakışma riski yok — tüm stiller .rhx- prefix'li
 */

/* Navbar tema değişkenleri (assets-blog.css ile uyumlu, yeni eklenenler işaretli) */
:root{
    --cream:#F5F1EA;
    --ink:#1A1A1A;
    --mute:#5A5A5A;
    --mute-soft:#9A9A9A;
    --brand:#FF5F00;
    --brandDark:#E55400;
    --brandSoft:#FFB380;
    --brandTint:rgba(255,95,0,0.08);
    --whatsapp:#25D366;
    --whatsappDark:#1EBE57;
    --glass:rgba(255,255,255,0.55);
    --glass-strong:rgba(255,255,255,0.92);
    --glassBorder:rgba(26,26,26,0.08);
    --shadow:0 20px 50px rgba(26,26,26,0.12);
    --shadow-lg:0 30px 80px rgba(26,26,26,0.18);
    --ease:cubic-bezier(.2,.8,.2,1);
  }

  /* Navbar içindeki tüm linklerde altı çizgi YOK (scope'lu, global değil) */
  .rhx-nav a,
  .rhx-mega a,
  .rhx-submenu a,
  .rhx-search-panel a,
  .rhx-mobile-panel a{
    text-decoration:none;
    color:inherit;
  }


  body.no-scroll{overflow:hidden}

  .mono{font-family:'JetBrains Mono',ui-monospace,Menlo,monospace;font-size:12px;letter-spacing:.02em}

  /* ==========================================================
     NAVBAR
     ========================================================== */
  .rhx-nav{
    /* Default state: tam genişlik, sayfanın üstüne yapışık */
    position:fixed; top:0; left:50%;
    transform:translateX(-50%);
    width:100%; max-width:100%;
    z-index:100;
    background:rgba(245,241,234,0.35);
    backdrop-filter:blur(14px) saturate(160%);
    -webkit-backdrop-filter:blur(14px) saturate(160%);
    border:1px solid transparent;
    border-radius:0;
    transition:
      top .45s var(--ease),
      width .45s var(--ease),
      max-width .45s var(--ease),
      background .35s ease,
      backdrop-filter .35s ease,
      border-color .35s ease,
      border-radius .45s var(--ease),
      box-shadow .45s var(--ease);
  }

  /* Scrolled state: floating pill — ortalanmış, daraltılmış, yuvarlak */
  .rhx-nav.scrolled{
    top:14px;
    width:calc(100% - 32px);
    max-width:1180px;
    /* Gerçek cam: düşük opaklık + saturate (renk canlanır) + güçlü blur */
    background:rgba(255,253,250,0.55);
    backdrop-filter:blur(28px) saturate(180%);
    -webkit-backdrop-filter:blur(28px) saturate(180%);
    /* Çift kenarlık: dış subtle, iç parıltılı */
    border:1px solid rgba(255,255,255,0.55);
    border-radius:999px;
    /* Çok katmanlı gölge: derinlik + iç highlight (üstten ışık geliyor hissi) */
    box-shadow:
      0 1px 0 rgba(255,255,255,0.8) inset,
      0 -1px 0 rgba(255,255,255,0.15) inset,
      0 8px 32px rgba(26,26,26,0.08),
      0 2px 12px rgba(26,26,26,0.04),
      0 0 0 1px rgba(26,26,26,0.04);
  }

  /* Scrolled durumunda iç padding biraz azalsın (pill içinde rahatlık) */
  .rhx-nav.scrolled .rhx-nav__inner{
    padding:10px 22px;
  }

  /* Mobilde scrolled state biraz daha kompakt */
  @media (max-width:980px){
    .rhx-nav.scrolled{
      top:10px;
      width:calc(100% - 20px);
      border-radius:18px;
    }
    .rhx-nav.scrolled .rhx-nav__inner{
      padding:10px 16px;
    }
  }
  .rhx-nav__inner{
    max-width:1240px; margin:0 auto;
    padding:14px 24px;
    display:flex; align-items:center; gap:24px;
  }

  /* Logo */
  .rhx-nav__logo{
    display:inline-flex; align-items:center;
    flex-shrink:0;
    transition:transform .3s ease, filter .3s ease;
    transform-origin:left center;
  }
  .rhx-nav__logo:hover{
    transform:scale(1.03) rotate(-1deg);
    filter:brightness(1.05) drop-shadow(0 0 12px rgba(255,95,0,0.2));
  }
  .rhx-nav__logo img,
  .rhx-nav__logo svg.rhx-nav__logo-svg{height:32px; width:auto; display:block}

  /* Menu */
  .rhx-nav__menu{
    list-style:none; margin:0; padding:0;
    display:flex; align-items:center; gap:4px;
    flex:1;
  }
  .rhx-nav__item{position:relative}
  .rhx-nav__link{
    display:inline-flex; align-items:center; gap:6px;
    padding:10px 14px;
    font-size:14px; font-weight:500;
    color:var(--mute);
    border-radius:8px;
    transition:color .2s ease, background .2s ease;
    cursor:pointer;
    position:relative;
  }
  .rhx-nav__link:hover{ color:var(--ink); }
  .rhx-nav__chevron{
    width:12px; height:12px;
    transition:transform .25s ease;
    color:currentColor;
  }
  .rhx-nav__item--has-submenu:hover > .rhx-nav__link .rhx-nav__chevron,
  .rhx-nav__item--has-submenu.is-open > .rhx-nav__link .rhx-nav__chevron,
  .rhx-nav__item--has-submenu:focus-within > .rhx-nav__link .rhx-nav__chevron{
    transform:rotate(180deg);
  }

  /* Animated underline (left-to-right fill) */
  .rhx-nav__link::after{
    content:""; position:absolute;
    left:14px; right:14px; bottom:4px;
    height:2px; background:var(--brand);
    border-radius:2px;
    transform:scaleX(0); transform-origin:left center;
    transition:transform 300ms var(--ease);
  }
  .rhx-nav__link:hover::after,
  .rhx-nav__item.is-active > .rhx-nav__link::after{
    transform:scaleX(1);
  }
  .rhx-nav__item.is-active > .rhx-nav__link{ color:var(--ink); font-weight:600 }

  /* Submenu */
  .rhx-submenu{
    position:absolute; top:calc(100% + 8px); left:0;
    list-style:none; margin:0; padding:8px;
    min-width:240px;
    background:rgba(255,255,255,0.85);
    backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
    border:1px solid rgba(26,26,26,0.06);
    border-radius:14px;
    box-shadow:0 20px 50px rgba(26,26,26,0.12);
    opacity:0; transform:translateY(8px);
    pointer-events:none;
    transition:opacity .22s cubic-bezier(.2,.8,.2,1), transform .22s cubic-bezier(.2,.8,.2,1);
  }
  .rhx-nav__item--has-submenu.is-open > .rhx-submenu,
  .rhx-nav__item--has-submenu:focus-within > .rhx-submenu{
    opacity:1; transform:translateY(0); pointer-events:auto;
  }
  .rhx-submenu::before{
    /* invisible bridge so cursor can travel from parent to submenu */
    content:""; position:absolute; top:-10px; left:0; right:0; height:10px;
  }
  .rhx-submenu__item{margin:0}
  .rhx-submenu__link{
    display:block;
    padding:10px 14px;
    border-radius:8px;
    font-size:14px;
    color:var(--mute);
    transition:background .18s ease, color .18s ease;
    position:relative;
  }
  .rhx-submenu__link:hover,
  .rhx-submenu__link:focus-visible{
    background:rgba(255,95,0,0.08);
    color:var(--brand);
    outline:none;
  }
  .rhx-submenu__item.is-active > .rhx-submenu__link{
    color:var(--brand); font-weight:600;
  }
  .rhx-submenu__item.is-active > .rhx-submenu__link::before{
    content:""; position:absolute; left:0; top:50%;
    width:3px; height:60%; background:var(--brand);
    border-radius:0 2px 2px 0; transform:translateY(-50%);
  }

  /* ==========================================================
     SUBMENU STATS BANNER (Başarılarımız)
     ========================================================== */
  .rhx-submenu__stats{
    padding:10px 14px; font-size:11px;
    color:var(--mute); text-align:center;
    border-bottom:1px dashed var(--glassBorder);
    margin-bottom:6px;
    text-transform:uppercase; letter-spacing:.05em;
  }
  .rhx-submenu__stat-num{ color:var(--brand); font-weight:600; }
  .rhx-submenu__stat-sep{ margin:0 6px; opacity:.4; }

  /* ==========================================================
     MEGA MENU (Hizmetler)
     ========================================================== */
  .rhx-mega{
    position:absolute; top:calc(100% + 8px); left:0;
    width:720px; max-width:calc(100vw - 64px);
    display:grid; grid-template-columns:1fr 240px; gap:16px;
    padding:16px;
    background:var(--glass-strong);
    backdrop-filter:blur(30px); -webkit-backdrop-filter:blur(30px);
    border:1px solid var(--glassBorder); border-radius:18px;
    box-shadow:var(--shadow-lg);
    opacity:0; transform:translateY(12px); pointer-events:none;
    transition:opacity 280ms var(--ease), transform 280ms var(--ease);
    z-index:101;
    list-style:none;
  }
  .rhx-mega::before{
    content:""; position:absolute; top:-10px; left:0; right:0; height:10px;
  }
  .rhx-nav__item.is-open > .rhx-mega,
  .rhx-nav__item:focus-within > .rhx-mega{
    opacity:1; transform:translateY(0); pointer-events:auto;
  }
  .rhx-mega__col{ display:flex; flex-direction:column; gap:4px; }
  .rhx-mega__service{
    display:flex; align-items:center; gap:14px;
    padding:14px 12px; border-radius:12px;
    transition:background 220ms var(--ease), transform 220ms var(--ease);
  }
  .rhx-mega__service:hover{
    background:var(--brandTint);
    transform:translateX(2px);
  }
  .rhx-mega__service-icon{
    width:44px; height:44px; flex-shrink:0;
    display:flex; align-items:center; justify-content:center;
    background:var(--brandTint); border-radius:12px;
    transition:transform 220ms var(--ease);
    color:var(--brand);
  }
  .rhx-mega__service:hover .rhx-mega__service-icon{ transform:scale(1.06); }
  .rhx-mega__service-icon--shopify{
    background:rgba(149,191,71,0.10); color:#5A8A2E;
  }
  .rhx-mega__service-text{ display:flex; flex-direction:column; min-width:0; }
  .rhx-mega__service-title{
    display:block; font-size:15px; font-weight:600; color:var(--ink);
  }
  .rhx-mega__service-desc{
    display:block; font-size:13px; color:var(--mute); margin-top:2px;
  }
  .rhx-badge{
    display:inline-block; margin-left:8px;
    padding:2px 8px; font-size:10px; font-weight:600;
    background:var(--brand); color:#fff;
    border-radius:999px; letter-spacing:.04em;
    text-transform:uppercase; vertical-align:middle;
  }

  .rhx-mega__featured{
    position:relative; overflow:hidden;
    padding:18px 16px; border-radius:14px;
    background:linear-gradient(135deg, var(--brandTint) 0%, transparent 80%);
    border-left:1px solid var(--glassBorder);
  }
  .rhx-mega__featured-tag{
    font-size:11px; color:var(--brand); font-weight:600;
    letter-spacing:.06em; display:block; margin-bottom:10px;
  }
  .rhx-mega__featured-title{
    font-size:18px; font-weight:700; color:var(--ink);
    line-height:1.25; margin:0 0 8px;
  }
  .rhx-mega__featured-title em{ color:var(--brand) }
  .rhx-mega__featured-desc{
    font-size:13px; color:var(--mute); line-height:1.5; margin:0 0 14px;
  }
  .rhx-mega__featured-link{
    font-size:14px; font-weight:600; color:var(--brand);
    display:inline-flex; align-items:center; gap:4px;
    transition:gap 200ms var(--ease);
  }
  .rhx-mega__featured-link:hover{ gap:8px; }
  .rhx-mega__featured-blob{
    position:absolute; right:-30px; bottom:-30px;
    width:100px; height:100px; border-radius:50%;
    background:radial-gradient(circle, var(--brandSoft) 0%, transparent 70%);
    filter:blur(20px); opacity:.5; pointer-events:none;
  }

  /* ==========================================================
     BACKDROP OVERLAY
     ========================================================== */
  .rhx-nav-backdrop{
    position:fixed; top:72px; left:0; right:0; bottom:0;
    background:rgba(26,26,26,0.15);
    backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
    opacity:0; pointer-events:none;
    transition:opacity 300ms var(--ease);
    z-index:90;
  }
  .rhx-nav-backdrop.is-active{ opacity:1; pointer-events:auto; }

  /* ==========================================================
     SEARCH BUTTON + PANEL
     ========================================================== */
  .rhx-nav__search-btn{
    display:inline-flex; align-items:center; gap:6px;
    padding:8px 10px; border-radius:10px;
    background:transparent; border:1px solid transparent;
    color:var(--mute); cursor:pointer;
    transition:background 200ms var(--ease), border-color 200ms var(--ease), color 200ms var(--ease);
    font-family:inherit;
  }
  .rhx-nav__search-btn:hover{
    background:rgba(255,255,255,0.5);
    border-color:var(--glassBorder);
    color:var(--ink);
  }
  .rhx-nav__search-kbd,
  .rhx-search-panel__close kbd{
    font-size:11px; padding:2px 6px;
    border:1px solid var(--glassBorder); border-radius:4px;
    background:rgba(255,255,255,0.5);
    font-family:'JetBrains Mono',ui-monospace,monospace; color:var(--mute);
    line-height:1;
  }
  .rhx-search-panel__close kbd{ padding:3px 8px; }

  .rhx-search-panel{
    position:fixed;
    top:72px;
    left:50%;
    transform:translateX(-50%) translateY(-20px);
    width:calc(100% - 32px);
    max-width:1180px;
    background:var(--glass-strong);
    backdrop-filter:blur(30px); -webkit-backdrop-filter:blur(30px);
    border-bottom:1px solid var(--glassBorder);
    box-shadow:var(--shadow-lg);
    transform:translateY(-100%); opacity:0;
    transition:transform 300ms var(--ease), opacity 300ms var(--ease);
    z-index:101; pointer-events:none;
  }
  .rhx-search-panel.is-open{
    transform:translateX(-50%) translateY(0); opacity:1; pointer-events:auto;
  }
  .rhx-search-panel__inner{
    display:flex; align-items:center; gap:14px;
    max-width:1240px; margin:0 auto; padding:24px 32px;
  }
  .rhx-search-panel__icon{ color:var(--mute); flex-shrink:0; }
  .rhx-search-panel__input{
    flex:1; background:transparent; border:none; outline:none;
    font-size:18px; font-family:inherit; color:var(--ink);
  }
  .rhx-search-panel__input::placeholder{ color:var(--mute-soft); }
  .rhx-search-panel__close{
    background:transparent; border:none; cursor:pointer; padding:0;
  }
  .rhx-search-panel__results{
    max-width:1240px; margin:0 auto; padding:0 32px 24px;
  }
  .rhx-search-panel__hint{
    font-size:12px; color:var(--mute-soft);
    padding:16px 0; border-top:1px dashed var(--glassBorder);
    text-align:center; margin:0;
  }

  /* Right actions */
  .rhx-nav__actions{
    display:flex; align-items:center; gap:10px;
    flex-shrink:0;
  }

  .rhx-nav__whatsapp{
    width:40px; height:40px; border-radius:50%;
    display:inline-flex; align-items:center; justify-content:center;
    background:rgba(37,211,102,0.10);
    border:1px solid rgba(37,211,102,0.20);
    color:var(--whatsapp);
    transition:background .2s ease, transform .2s ease, color .2s ease, border-color .2s ease;
  }
  .rhx-nav__whatsapp svg{width:20px; height:20px}
  .rhx-nav__whatsapp:hover{
    background:var(--whatsapp);
    border-color:var(--whatsapp);
    color:#fff;
    transform:scale(1.05);
  }

  .rhx-nav__cta{
    display:inline-flex; align-items:center; gap:8px;
    padding:11px 20px;
    border-radius:10px;
    background:var(--brand);
    color:#fff;
    font-weight:600;
    font-size:14px;
    border:none; cursor:pointer;
    transition:background .2s ease, transform .2s ease, box-shadow .2s ease;
    white-space:nowrap;
  }
  .rhx-nav__cta svg{width:16px; height:16px; stroke:#fff; stroke-width:2; fill:none}
  .rhx-nav__cta:hover{
    background:var(--brandDark);
    transform:translateY(-1px);
    box-shadow:0 8px 20px rgba(255,95,0,0.35);
  }

  /* Burger (mobile only) */
  .rhx-nav__burger{
    display:none;
    width:40px; height:40px;
    background:transparent; border:1px solid rgba(26,26,26,0.10);
    border-radius:10px;
    align-items:center; justify-content:center;
    cursor:pointer;
    flex-shrink:0;
  }
  .rhx-nav__burger-lines{
    position:relative; width:18px; height:14px;
  }
  .rhx-nav__burger-lines span{
    position:absolute; left:0; right:0; height:2px;
    background:var(--ink);
    border-radius:2px;
    transition:transform .3s cubic-bezier(.2,.8,.2,1), opacity .2s ease, top .3s cubic-bezier(.2,.8,.2,1);
  }
  .rhx-nav__burger-lines span:nth-child(1){top:0}
  .rhx-nav__burger-lines span:nth-child(2){top:6px}
  .rhx-nav__burger-lines span:nth-child(3){top:12px}
  .rhx-nav__burger.is-open .rhx-nav__burger-lines span:nth-child(1){top:6px; transform:rotate(45deg)}
  .rhx-nav__burger.is-open .rhx-nav__burger-lines span:nth-child(2){opacity:0}
  .rhx-nav__burger.is-open .rhx-nav__burger-lines span:nth-child(3){top:6px; transform:rotate(-45deg)}

  /* Mobile compact CTA */
  .rhx-nav__cta--compact{ display:none; padding:9px 14px; font-size:13px; gap:6px }
  .rhx-nav__cta--compact svg{width:14px; height:14px}

  /* ==========================================================
     MOBILE PANEL
     ========================================================== */
  .rhx-mobile-panel{
    position:fixed; inset:0; z-index:99;
    background:rgba(245,241,234,0.98);
    backdrop-filter:blur(30px); -webkit-backdrop-filter:blur(30px);
    transform:translateX(100%);
    transition:transform .3s cubic-bezier(.2,.8,.2,1);
    display:flex; flex-direction:column;
    padding:80px 24px 24px;
    overflow-y:auto;
    visibility:hidden;
  }
  .rhx-mobile-panel.is-open{ transform:translateX(0); visibility:visible }

  .rhx-mobile-panel__list{
    list-style:none; margin:0; padding:0; flex:1;
  }
  .rhx-mobile-panel__item{
    border-bottom:1px solid rgba(26,26,26,0.06);
  }
  .rhx-mobile-panel__link{
    display:flex; align-items:center; justify-content:space-between;
    padding:18px 0;
    font-size:18px; font-weight:500;
    color:var(--ink);
    cursor:pointer;
    background:transparent; border:none; width:100%; text-align:left;
    font-family:inherit;
  }
  .rhx-mobile-panel__link.is-active{ color:var(--brand) }
  .rhx-mobile-panel__chevron{
    width:14px; height:14px; color:var(--mute);
    transition:transform .25s ease;
  }
  .rhx-mobile-panel__item.is-open .rhx-mobile-panel__chevron{ transform:rotate(180deg) }

  .rhx-mobile-panel__sub{
    list-style:none; margin:0; padding:0;
    max-height:0; overflow:hidden;
    transition:max-height .3s cubic-bezier(.2,.8,.2,1);
  }
  .rhx-mobile-panel__item.is-open .rhx-mobile-panel__sub{ max-height:400px }
  .rhx-mobile-panel__sub-link{
    display:block;
    padding:14px 0 14px 20px;
    font-size:16px;
    color:var(--mute);
    border-top:1px solid rgba(26,26,26,0.04);
  }
  .rhx-mobile-panel__sub-link.is-active{ color:var(--brand); font-weight:600 }

  .rhx-mobile-panel__whatsapp{
    margin-top:24px;
    display:flex; align-items:center; justify-content:center; gap:10px;
    padding:16px;
    width:100%;
    border-radius:12px;
    background:var(--whatsapp);
    color:#fff;
    font-weight:600;
    font-size:16px;
    transition:background .2s ease;
  }
  .rhx-mobile-panel__whatsapp:hover{ background:var(--whatsappDark) }
  .rhx-mobile-panel__whatsapp svg{width:22px; height:22px; fill:#fff}

  /* ==========================================================
     RESPONSIVE
     ========================================================== */
  @media (max-width: 979px){
    .rhx-nav__inner{ padding:12px 18px; gap:12px }
    .rhx-nav__logo img,
    .rhx-nav__logo svg.rhx-nav__logo-svg{height:28px}

    .rhx-nav__menu{display:none}
    .rhx-nav__whatsapp{display:none}
    .rhx-nav__cta{display:none}
    .rhx-nav__search-btn{display:none}
    .rhx-nav__cta--compact{display:inline-flex}
    .rhx-nav__burger{display:inline-flex}

    .rhx-nav__actions{margin-left:auto; gap:8px}
  }
  @media (min-width: 980px){
    .rhx-mobile-panel{display:none}
  }

  /* ==========================================================
     DEMO PAGE CONTENT
     ========================================================== */

  /* ==========================================================
     REDUCE MOTION
     ========================================================== */
  @media (prefers-reduced-motion: reduce){
    *, *::before, *::after{
      animation-duration:0.01ms !important;
      transition-duration:0.01ms !important;
    }
  }

/* ==========================================================
   BODY PADDING (navbar fixed olduğu için içerik üst boşluk gerekiyor)
   ========================================================== */
body{ padding-top:72px; }
@media (max-width:980px){
  body{ padding-top:64px; }
}

/* ==========================================================
   WORDPRESS UYUMLULUĞU
   ========================================================== */
/* WP admin bar varsa navbar onun altına insin */
body.admin-bar .rhx-nav{ top:32px; }
@media (max-width:782px){
  body.admin-bar .rhx-nav{ top:46px; }
}
body.admin-bar{ padding-top:104px; }
@media (max-width:782px){
  body.admin-bar{ padding-top:110px; }
}

/* Logo image styling (PNG için) */
.rhx-nav__logo-img{
  display:block;
  height:32px; width:auto;
  transition:transform 300ms var(--ease), filter 300ms var(--ease);
}
@media (max-width:980px){
  .rhx-nav__logo-img{ height:28px; }
}
.rhx-nav__logo:hover .rhx-nav__logo-img{
  transform:scale(1.03) rotate(-1deg);
  filter:brightness(1.05) drop-shadow(0 0 12px rgba(255,95,0,0.25));
}