/* Dropdown overlay */
.dd-overlay{position:fixed;inset:0;z-index:99}

/* Tools dropdown */
.AiToolsDropdown-module__PIoxgq__wrapper{border:1px solid var(--text-secondary-on-dark,#e8e8e8);background:var(--text-primary-on-dark,#fff);border-radius:16px;grid-template-columns:600px 312px;gap:1em;padding:1em;display:none;position:absolute;top:100%;left:250px;box-shadow:0 0 16px rgba(0,0,0,.1);z-index:100}
.AiToolsDropdown-module__PIoxgq__wrapper.dd-open{display:grid}
.AiToolsDropdown-module__PIoxgq__list{grid-template-columns:repeat(2,1fr);gap:.5em .75em;display:grid}
.AiToolsDropdown-module__PIoxgq__typesItem{border-radius:16px;align-items:center;gap:.75em;padding:.75em;text-decoration:none;color:inherit;transition:.15s;display:flex;position:relative}
.AiToolsDropdown-module__PIoxgq__typesItem:not(.AiToolsDropdown-module__PIoxgq__disabled):hover{background:var(--text-secondary-on-dark,#f5f5f5)}
.AiToolsDropdown-module__PIoxgq__content{flex-direction:column;gap:.25em;max-width:215px;display:flex}
.AiToolsDropdown-module__PIoxgq__content>span{font-weight:500}
.AiToolsDropdown-module__PIoxgq__content>small{opacity:.5;font-family:Manrope,sans-serif;font-weight:500;text-wrap:balance}
.AiToolsDropdown-module__PIoxgq__disabled>img{filter:grayscale(1)}
.AiToolsDropdown-module__PIoxgq__badge{z-index:2;height:20px;color:#fff;background:linear-gradient(90deg,#7a3fff 0%,#ff723f 100%);border-radius:20px;align-items:center;padding:0 8px;font-family:Manrope,sans-serif;font-size:10px;font-weight:700;display:flex;position:absolute;top:.75em;right:.75em}

/* CTA banner inside tools dropdown */
.CtaSmallBanner-module__v5fKMW__wrapper{background:url("/images/ai-tools-dropdown/bannerBg.webp") 0 0/cover;border-radius:16px;flex-direction:column;justify-content:space-between;width:100%;height:100%;padding:1.5em;display:flex}
.CtaSmallBanner-module__v5fKMW__content{flex-direction:column;gap:.5em;display:flex}
.CtaSmallBanner-module__v5fKMW__content>h5{text-wrap:balance;font-weight:500}
.CtaSmallBanner-module__v5fKMW__content>small{opacity:.5;font-family:Manrope,sans-serif}
.CtaSmallBanner-module__v5fKMW__arrowIcon{fill:var(--text-primary-on-dark,#fff)}

/* Models dropdown */
.ModelsDropdown-module__OrSvAG__wrapper{border:1px solid var(--text-secondary-on-dark,#e8e8e8);background:var(--text-primary-on-dark,#fff);border-radius:16px;grid-template-columns:repeat(2,1fr);gap:12px;width:540px;padding:1em;display:none;position:absolute;top:100%;left:385px;box-shadow:0 0 16px rgba(0,0,0,.1);z-index:100}
.ModelsDropdown-module__OrSvAG__wrapper.dd-open{display:grid}
.ModelsDropdown-module__OrSvAG__item{background:var(--text-secondary-on-dark,#f5f5f5);border-radius:16px;grid-template-columns:1fr auto;align-items:center;padding:16px;text-decoration:none;color:inherit;transition:.15s;display:grid}
.ModelsDropdown-module__OrSvAG__item:hover{background:#eee}
.ModelsDropdown-module__OrSvAG__left{align-items:center;gap:8px;display:flex}
.ModelsDropdown-module__OrSvAG__left>h6{font-weight:500;margin:0}
.ModelsDropdown-module__OrSvAG__icon{font-size:16px;transition:.15s}
.ModelsDropdown-module__OrSvAG__item:hover .ModelsDropdown-module__OrSvAG__icon{transform:translateX(6px)}

/* Chevron rotation when active */
.dd-btn-active svg{transform:rotate(180deg);transition:transform .2s}
button .Button-module__Rmgt5G__content svg{transition:transform .2s}

/* ===================== */
/* BURGER MENU & DRAWER  */
/* ===================== */

/* Burger button — hidden on desktop */
.dd-burger{display:none;background:none;border:none;cursor:pointer;padding:8px;z-index:102;position:relative;-webkit-tap-highlight-color:transparent}
.dd-burger svg{display:block}

/* Mobile drawer */
.dd-drawer{position:fixed;top:0;right:0;bottom:0;width:min(320px,85vw);background:#fff;z-index:200;transform:translateX(100%);transition:transform .3s cubic-bezier(.4,0,.2,1);overflow-y:auto;-webkit-overflow-scrolling:touch;box-shadow:-4px 0 24px rgba(0,0,0,.15);padding:0}
.dd-drawer.dd-drawer-open{transform:translateX(0)}

/* Drawer overlay */
.dd-drawer-overlay{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:199;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
.dd-drawer-overlay.dd-drawer-overlay-visible{opacity:1;visibility:visible}

/* Drawer header */
.dd-drawer-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid #eee}
.dd-drawer-header img{height:32px;width:auto}
.dd-drawer-close{background:none;border:none;cursor:pointer;padding:8px;-webkit-tap-highlight-color:transparent}
.dd-drawer-close svg{display:block}

/* Drawer nav links */
.dd-drawer-nav{display:flex;flex-direction:column;padding:8px 0}
.dd-drawer-link{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;text-decoration:none;color:#1a1a1a;font-weight:500;font-size:16px;font-family:Manrope,system-ui,sans-serif;border:none;background:none;cursor:pointer;width:100%;text-align:left;-webkit-tap-highlight-color:transparent;transition:background .15s}
.dd-drawer-link:hover,.dd-drawer-link:active{background:#f5f5f5}
.dd-drawer-link svg{transition:transform .2s}
.dd-drawer-link.dd-submenu-open svg{transform:rotate(180deg)}

/* Submenu inside drawer */
.dd-drawer-submenu{display:none;flex-direction:column;background:#f9f9f9;padding:4px 0}
.dd-drawer-submenu.dd-submenu-visible{display:flex}
.dd-drawer-submenu a{display:flex;align-items:center;gap:10px;padding:10px 20px 10px 32px;text-decoration:none;color:#333;font-size:14px;font-family:Manrope,system-ui,sans-serif;transition:background .15s}
.dd-drawer-submenu a:hover,.dd-drawer-submenu a:active{background:#efefef}
.dd-drawer-submenu a img{width:24px;height:24px;border-radius:4px}
.dd-drawer-submenu a span{font-weight:500}

/* Drawer CTA */
.dd-drawer-cta{padding:16px 20px;margin-top:auto}
.dd-drawer-cta a{display:flex;align-items:center;justify-content:center;gap:8px;padding:14px 24px;background:linear-gradient(135deg,#7a3fff,#ff723f);color:#fff;font-weight:600;font-size:16px;font-family:Manrope,system-ui,sans-serif;border-radius:12px;text-decoration:none;transition:opacity .15s}
.dd-drawer-cta a:hover{opacity:.9}

/* Prevent body scroll when drawer open */
body.dd-no-scroll{overflow:hidden}

/* ==================== */
/* RESPONSIVE           */
/* ==================== */

/* Tablet: stack tools dropdown */
@media(max-width:1024px){
  .AiToolsDropdown-module__PIoxgq__wrapper{grid-template-columns:1fr;width:calc(100vw - 2em);left:0;max-height:80vh;overflow-y:auto}
  .AiToolsDropdown-module__PIoxgq__list{grid-template-columns:1fr}
  .ModelsDropdown-module__OrSvAG__wrapper{width:calc(100vw - 2em);left:0;grid-template-columns:1fr;max-height:80vh;overflow-y:auto}
}

/* Mobile: show burger, hide desktop nav, hide desktop CTA */
@media(max-width:768px){
  .dd-burger{display:flex;align-items:center;justify-content:center}

  /* Hide the right-side CTA button on mobile — drawer has its own */
  .Navbar-module__GjKCxa__relativeWrapper>.buttonGradient{display:none}

  /* Compact navbar on mobile */
  .Navbar-module__GjKCxa__relativeWrapper{gap:0.5em;padding:.5em 1em}
  .Navbar-module__GjKCxa__logo{height:28px;width:auto}

  /* Hide desktop dropdowns on mobile — drawer has its own submenus */
  .AiToolsDropdown-module__PIoxgq__wrapper.dd-open,
  .ModelsDropdown-module__OrSvAG__wrapper.dd-open{display:none}
}