/* Shared presentation layer. Existing routes, controls, and conversion logic stay intact.
   Explicit precedence is required by the older stylesheet's important overrides. */
:root {
  --studio-ink: #172c38;
  --studio-muted: #60717a;
  --studio-teal: #087f73;
  --studio-teal-dark: #06675e;
  --studio-line: #dde5e4;
  --studio-paper: #f7f9f8;
  --studio-soft: #edf5f2;
}
html { scroll-padding-top: 100px; }
html body {
  margin: 0;
  background: var(--studio-paper) !important;
  color: var(--studio-ink) !important;
  font-family: 'Plus Jakarta Sans', 'Segoe UI', sans-serif !important;
  font-size: 14px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
html body::before, html body::after { display: none !important; }
html body *, html body *::before, html body *::after { box-sizing: border-box; }
html body :is(button, input, select, textarea) { font: inherit; }
html body :is(h1, h2, h3, h4) { color: var(--studio-ink); }
html body :is(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid #19a995 !important;
  outline-offset: 4px !important;
}
html body :is(button, a, input, select, textarea) { -webkit-tap-highlight-color: transparent; }
html body button:disabled { cursor: not-allowed; opacity: .52; }
html body .app-shell { overflow: clip; }
html body main { min-height: 65vh; }

/* Navigation */
html body .site-header {
  height: auto !important;
  position: sticky !important; top: 0; z-index: 100;
  padding: 0 !important; background: #fff !important;
  border: 0 !important; border-bottom: 1px solid var(--studio-line) !important;
  box-shadow: none !important; backdrop-filter: none !important;
}
html body .site-header-inner {
  width: min(1160px, calc(100% - 64px)) !important; max-width: 1160px !important;
  min-height: 80px !important; margin: 0 auto !important; padding: 0 !important;
  display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 24px !important;
}
html body .brand-link { gap: 11px !important; flex-shrink: 0; text-decoration: none; }
html body .brand-mark {
  width: 40px !important; height: 40px !important; border-radius: 11px !important;
  background: var(--studio-ink) !important; color: #fff !important; box-shadow: none !important;
}
html body .brand-mark.brand-logo { background: transparent !important; }
html body .brand-copy strong { font-size: 20px !important; letter-spacing: -.8px !important; color: var(--studio-ink) !important; }
html body .brand-copy small { font-size: 9px !important; letter-spacing: 1.2px !important; color: var(--studio-muted) !important; }
html body .top-nav { gap: 6px !important; padding: 0 !important; background: transparent !important; }
html body .nav-main-link {
  color: #41545d !important; font-size: 12px !important; font-weight: 600 !important;
  padding: 12px 9px !important; border-radius: 6px !important;
}
html body .nav-main-link:hover { color: var(--studio-teal) !important; background: var(--studio-soft) !important; }
html body .nav-caret { color: #84928f !important; }
html body .header-actions { gap: 8px !important; }
html body .auth-link {
  min-height: 40px !important; padding: 9px 15px !important;
  color: var(--studio-ink) !important; background: #fff !important;
  border: 1px solid transparent !important; border-radius: 7px !important;
  font-size: 12px !important; font-weight: 700 !important; box-shadow: none !important;
}
html body .header-actions .auth-link.primary { background: var(--studio-ink) !important; color: #fff !important; box-shadow: none !important; }
html body .nav-mega-menu {
  background: #fff !important; border: 1px solid var(--studio-line) !important;
  border-radius: 12px !important; padding: 14px !important;
  box-shadow: 0 16px 40px #172c381a !important;
}
html body .nav-item-dropdown:focus-within .nav-mega-menu { display: block; opacity: 1; visibility: visible; transform: none; pointer-events: auto; }
html body .mega-tool-item { border-radius: 6px !important; font-size: 13px !important; }
html body .mega-tool-item:hover { background: var(--studio-soft) !important; color: var(--studio-teal) !important; }

/* A restrained, split-layout homepage */
html body .home-hero-studio {
  position: relative !important; z-index: 50 !important; width: 100% !important; max-width: none !important;
  margin: 0 !important; padding: 66px 0 34px !important;
  background: #f1f5f2 !important; border: 0 !important; border-bottom: 1px solid var(--studio-line) !important;
  border-radius: 0 !important; box-shadow: none !important;
}
html body .home-hero-studio::before, html body .home-hero-studio::after { display: none !important; }
html body .home-hero-studio .hero-content {
  width: min(1160px, calc(100% - 64px)) !important; max-width: 1160px !important;
  margin: 0 auto !important; padding: 0 !important;
  display: grid !important; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr) !important;
  align-items: center !important; gap: 38px 54px !important; text-align: start !important;
}
html body .home-hero-intro { min-width: 0; padding-block: 12px; }
html body .home-hero-intro .badge {
  display: inline-flex !important; align-items: center; gap: 8px;
  padding: 6px 0 !important; margin-bottom: 20px !important;
  border: 0 !important; border-radius: 0 !important; background: transparent !important;
  color: var(--studio-teal-dark) !important; font-size: 11px !important;
  font-weight: 700 !important; letter-spacing: 1px !important; text-transform: uppercase;
  box-shadow: none !important;
}
html body .home-hero-intro .badge::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--studio-teal); }
html body .home-hero-studio .hero-content h1 {
  margin: 0 0 22px !important; max-width: 500px !important;
  font-size: clamp(36px, 4.1vw, 54px) !important; font-weight: 800 !important;
  line-height: 1.12 !important; letter-spacing: -2.3px !important;
  color: var(--studio-ink) !important; text-align: start !important;
}
html body .home-hero-studio .hero-subtext {
  font-size: 15px !important; line-height: 1.8 !important;
  color: var(--studio-muted) !important; max-width: 440px !important; margin: 0 !important; text-align: start !important;
}
.hero-format-illustration { display: flex; align-items: center; gap: 16px; margin-top: 34px; }
.hero-file-sheet { position: relative; width: 52px; height: 66px; padding: 13px 10px 8px; background: white; border: 1px solid #d7dedb; border-radius: 5px 14px 5px 5px; transform: rotate(-7deg); box-shadow: 0 5px 9px #172c3805; }
.hero-file-sheet::after { content: ''; position: absolute; top: 0; right: 0; width: 12px; height: 12px; background: #e6ece8; border-radius: 0 12px 0 3px; }
.hero-file-lines { display: block; width: 24px; height: 15px; margin-bottom: 7px; background: repeating-linear-gradient(to bottom, #dce3df 0 2px, transparent 2px 6px); }
.hero-file-sheet b { display: block; color: #b64b3e; font-size: 9px; letter-spacing: .6px; }
.hero-file-sheet.output { transform: rotate(7deg); }
.hero-file-sheet.output b { color: #087f73; }
.hero-file-arrow { font-size: 24px; color: #889e95; }
.hero-format-caption { margin-inline-start: 10px; font-size: 11px; color: #718279; line-height: 1.9; }
.hero-format-caption strong { color: #36564a; font-weight: 600; }
html body .home-converter-hub-card {
  width: 100% !important; max-width: none !important; min-width: 0;
  margin: 0 !important; padding: 26px !important; border: 1px solid #dbe4de !important;
  border-radius: 16px !important; background: #fff !important;
  box-shadow: 0 12px 32px #263f3210 !important; text-align: start !important;
}
html body .hub-tabs-nav { width: 100% !important; display: flex !important; gap: 4px !important; padding: 4px !important; margin: 0 0 24px !important; background: #f2f5f4 !important; border: 1px solid #e9eeeb !important; border-radius: 8px !important; }
html body .hub-tab-btn { flex: 1; justify-content: center; min-height: 42px; padding: 10px !important; color: #667871 !important; font-size: 12px !important; font-weight: 600 !important; border-radius: 5px !important; background: transparent !important; box-shadow: none !important; }
html body .hub-tab-btn.active { background: #fff !important; color: var(--studio-teal-dark) !important; box-shadow: 0 1px 4px #172c3812 !important; }
html body .format-selector-studio { display: grid !important; grid-template-columns: minmax(0, 1fr) 24px minmax(0, 1fr) !important; gap: 16px 10px !important; padding: 0 !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
html body .selector-box { min-width: 0 !important; padding: 13px 12px !important; background: #fff !important; border: 1px solid #d8e2df !important; border-radius: 8px !important; box-shadow: none !important; }
html body .selector-box label { color: #687a72 !important; font-size: 9px !important; letter-spacing: 1px !important; margin: 0 0 10px !important; }
html body .selector-step-badge { background: #edf4f0 !important; color: var(--studio-teal) !important; }
html body .format-dropdown { width: 100% !important; min-width: 0 !important; padding: 0 16px 0 0 !important; color: var(--studio-ink) !important; font-size: 12px !important; font-weight: 600 !important; background-color: transparent !important; border: 0 !important; }
html body .selector-swap-icon { width: 24px !important; height: 24px !important; margin: 0 !important; align-self: center; border: 0 !important; background: transparent !important; box-shadow: none !important; color: #758d81 !important; }
html body .selector-action { grid-column: 1 / -1; width: 100%; }
html body :is(.primary-button, .action-button-premium.primary, .generator-primary, .category-more-btn) {
  background: var(--studio-teal) !important; background-image: none !important;
  border: 1px solid var(--studio-teal) !important; color: #fff !important;
  border-radius: 7px !important; font-weight: 700 !important; font-size: 13px !important;
  min-height: 44px; padding: 12px 20px !important; box-shadow: none !important;
  transition: background .15s, border-color .15s, transform .15s !important;
}
html body :is(.primary-button, .action-button-premium.primary, .generator-primary, .category-more-btn):hover:not(:disabled) { background: var(--studio-teal-dark) !important; border-color: var(--studio-teal-dark) !important; transform: translateY(-1px) !important; box-shadow: none !important; }
html body .open-converter-cta { width: 100% !important; justify-content: center; min-height: 48px !important; }
html body :is(.secondary-button, .generator-secondary) { background: white !important; border: 1px solid var(--studio-line) !important; color: #415b53 !important; border-radius: 7px !important; font-size: 12px !important; font-weight: 600 !important; padding: 9px 14px !important; box-shadow: none !important; }
html body :is(.secondary-button, .generator-secondary):hover { border-color: #87b6a7 !important; background: #f4f8f5 !important; transform: none !important; }
html body .home-popular-shortcuts { margin: 23px 0 0 !important; padding: 18px 0 0 !important; border-top: 1px solid #edf0ee !important; }
html body .shortcuts-label { color: #748079 !important; font-size: 10px !important; font-weight: 600 !important; margin-bottom: 10px !important; }
html body .shortcut-pills { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; }
html body .shortcut-pill { padding: 6px 9px !important; border: 1px solid #e7ece9 !important; border-radius: 5px !important; color: #57665f !important; font-size: 10px !important; font-weight: 500 !important; box-shadow: none !important; }
html body .shortcut-pill:hover { background: var(--studio-soft) !important; border-color: #a9c8bb !important; color: var(--studio-teal-dark) !important; transform: none !important; box-shadow: none !important; }
html body .search-and-stats { position: relative !important; z-index: 60 !important; grid-column: 1 / -1; display: flex !important; flex-direction: row !important; align-items: center; gap: 30px !important; width: 100% !important; max-width: none !important; margin: 4px 0 0 !important; padding-top: 25px; border-top: 1px solid #dce5df; }
html body .search-box-home { position: relative !important; z-index: 70 !important; flex: 1; width: 100% !important; max-width: 600px !important; margin: 0 !important; background: #fff !important; border: 1px solid #d7e2dc !important; border-radius: 8px !important; padding: 0 16px !important; min-height: 48px !important; box-shadow: none !important; }
html body .search-box-home > svg { color: #7b9387 !important; width: 18px; }
html body .search-box-home input { height: 48px !important; font-size: 13px !important; color: var(--studio-ink) !important; }
html body .search-results-dropdown {
  position: absolute !important;
  top: calc(100% + 8px) !important;
  left: 0 !important;
  right: 0 !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  border: 1px solid #d7e2dc !important;
  border-radius: 12px !important;
  padding: 8px !important;
  box-shadow: 0 20px 45px -10px rgba(15, 23, 42, 0.22), 0 4px 16px rgba(0, 0, 0, 0.08) !important;
  z-index: 99999 !important;
  max-height: 420px !important;
  overflow-y: auto !important;
  text-align: left !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html body .stat-pills { flex: 1; display: flex !important; justify-content: flex-end; gap: 24px !important; margin: 0 !important; padding: 0 !important; }
html body .stat-pills > span { display: flex !important; flex-direction: column; gap: 0; align-items: flex-start; border: none !important; background: transparent !important; padding: 0 !important; font-size: 10px !important; color: #79867e !important; box-shadow: none !important; }
html body .stat-pills strong { font-size: 17px !important; font-weight: 700 !important; color: #344e40 !important; }
html body .home-dropzone { padding: 24px 16px !important; border: 1px dashed #80b7a7 !important; border-radius: 8px !important; background: #f3f8f5 !important; transform: none !important; }
html body .dropzone-icon-wrap { background: #e3f0e8 !important; color: var(--studio-teal) !important; border-radius: 12px !important; width: 48px !important; height: 48px !important; }
html body .home-dropzone h3 { font-size: 16px !important; }
html body .home-dropzone p { font-size: 10px !important; color: #728079 !important; }

/* Browsable directories and consistently sized cards */
html body :is(.featured-workbench, .tool-shelf, .tool-directory-premium, .premium-category-banner, .premium-tool-banner, .converter-layout-premium, .tool-steps-section, .tool-knowledge-section, .tool-faq-section, .related-section-premium, .tool-content-premium, .tool-internal-links, .article-section, .category-page-container) {
  width: min(1160px, calc(100% - 64px)) !important; max-width: 1160px !important; margin-inline: auto !important;
}
html body .featured-workbench { margin-block: 48px !important; padding: 0 !important; border: none !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
html body .category-pills-bar-wrapper { border-bottom: 1px solid var(--studio-line) !important; margin-bottom: 32px !important; padding: 0 0 18px !important; background: transparent !important; box-shadow: none !important; }
html body .category-pills-bar { gap: 5px !important; padding: 0 !important; justify-content: flex-start !important; flex-wrap: wrap !important; background: transparent !important; }
html body :is(.category-pill, .category-filter-chip) { font-size: 11px !important; font-weight: 600 !important; padding: 8px 12px !important; min-height: 36px; border: 1px solid transparent !important; color: #607169 !important; background: transparent !important; border-radius: 6px !important; box-shadow: none !important; }
html body :is(.category-pill, .category-filter-chip).active { color: #fff !important; background: var(--studio-ink) !important; border-color: var(--studio-ink) !important; }
html body :is(.category-pill, .category-filter-chip):hover:not(.active) { background: #eaf0ec !important; color: #1e5040 !important; transform: none !important; }
html body :is(.tools-grid-header, .section-heading, .directory-toolbar) { align-items: center !important; gap: 20px; margin-bottom: 24px !important; }
html body :is(.tools-grid-title, .section-heading h2, .toolbar-left h2, .tool-knowledge-header h2, .article-header h2) { font-size: 25px !important; line-height: 1.3 !important; font-weight: 750 !important; letter-spacing: -.8px !important; color: var(--studio-ink) !important; margin: 0 0 7px !important; }
html body :is(.tools-grid-subtitle, .toolbar-left p, .tool-knowledge-header p) { font-size: 12px !important; color: var(--studio-muted) !important; margin: 0 !important; }
html body :is(.results-badge, .section-eyebrow) { font-size: 10px !important; font-weight: 650 !important; color: var(--studio-teal-dark) !important; letter-spacing: .5px !important; }
html body .results-badge { padding: 6px 10px !important; background: #edf3ef !important; border: 1px solid #dfe9e2 !important; border-radius: 5px !important; white-space: nowrap; }
html body :is(.ilovepdf-tools-grid, .tool-grid-premium, .quick-grid) { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 14px !important; padding: 0 !important; background: transparent !important; border: 0 !important; }
html body :is(.tool-card, .ilovepdf-card) {
  position: relative; display: flex !important; flex-direction: column !important;
  min-width: 0 !important; min-height: 185px !important; height: 100% !important;
  padding: 22px !important; border: 1px solid var(--studio-line) !important;
  border-radius: 10px !important; background: white !important; text-decoration: none !important;
  box-shadow: 0 2px 3px #142c2303 !important; overflow: hidden;
  transition: border-color .16s, box-shadow .16s, transform .16s !important;
}
html body :is(.tool-card, .ilovepdf-card)::before { display: none !important; }
html body :is(.tool-card, .ilovepdf-card):hover { transform: translateY(-3px) !important; border-color: #8ab8a5 !important; box-shadow: 0 8px 22px #284b3810 !important; }
html body .ilovepdf-card-top { margin-bottom: 17px !important; }
html body :is(.ilovepdf-thumb-badge, .ilovepdf-card-top > svg) { width: 40px !important; height: 40px !important; filter: none !important; }
html body .tool-icon { width: 38px !important; height: 38px !important; margin: 0 0 16px !important; border: none !important; border-radius: 8px !important; color: var(--accent, #087f73) !important; background: color-mix(in srgb, var(--accent, #087f73) 8%, white) !important; box-shadow: none !important; }
html body :is(.ilovepdf-card-title, .tool-card-body > strong) { font-size: 14px !important; line-height: 1.5 !important; letter-spacing: -.3px !important; font-weight: 750 !important; color: var(--studio-ink) !important; margin: 0 0 7px !important; }
html body .ilovepdf-card-desc { font-size: 11px !important; line-height: 1.85 !important; color: #77847e !important; margin: 0 !important; }
html body .tool-card-body { display: flex !important; flex-direction: column; flex: 1; width: 100%; gap: 6px !important; }
html body .tool-card-flow { display: flex !important; align-items: center; gap: 8px !important; color: #7f8c85 !important; margin: 0 0 12px !important; font-size: 10px !important; }
html body .tool-card-flow b { background: #f3f6f4 !important; padding: 3px 7px !important; border-radius: 4px !important; color: #64736c !important; font-size: 9px !important; font-weight: 600 !important; }
html body .tool-card-foot { display: flex !important; justify-content: space-between; gap: 8px; align-items: center; margin-top: auto !important; border-top: 1px solid #eef2ef; padding-top: 12px !important; }
html body .capability-chip { font-size: 9px !important; font-weight: 550 !important; padding: 3px 6px !important; border-radius: 4px !important; box-shadow: none !important; }
html body .tool-open-action { font-size: 10px !important; color: var(--studio-teal) !important; font-weight: 650 !important; }
html body :is(.favorite-mark, .card-fav-star) { position: absolute; inset-inline-end: 15px; top: 15px; width: 28px !important; height: 28px !important; color: #99a69f !important; background: transparent !important; border: 0 !important; border-radius: 5px; font-size: 19px !important; }
html body :is(.favorite-mark, .card-fav-star).active { color: #b7862a !important; }
html body .tool-shelf { margin-block: 30px !important; padding: 20px 0 !important; border-bottom: 1px solid var(--studio-line); background: transparent !important; box-shadow: none !important; }
html body .tool-shelf h2 { font-size: 18px !important; letter-spacing: -.4px; }
html body .tool-shelf-head { text-align: start !important; margin: 0 0 14px !important; }
html body .tool-shelf-head h2 { margin: 4px 0 0 !important; }
html body .instant-tools.shelf-row { justify-content: flex-start !important; margin: 0 !important; gap: 8px !important; }
html body .tool-shelf .tool-pill { border: 1px solid var(--studio-line) !important; border-radius: 6px !important; padding: 9px 12px !important; font-size: 11px !important; background: #fff !important; box-shadow: none !important; }

/* Category and format headers */
html body .premium-category-banner { margin-block: 32px !important; padding: 34px 38px !important; background: #fff !important; border: 1px solid var(--studio-line) !important; border-radius: 12px !important; box-shadow: none !important; }
html body :is(.premium-category-banner, .premium-tool-banner)::before, html body :is(.premium-category-banner, .premium-tool-banner)::after { display: none !important; }
html body :is(.banner-glass, .category-banner-glass) { display: flex !important; align-items: center !important; justify-content: space-between; gap: 36px; padding: 0 !important; margin: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; backdrop-filter: none !important; }
html body :is(.banner-content, .category-banner-left) { display: block !important; flex: 1; min-width: 0; text-align: start !important; }
html body :is(.banner-back-btn, .breadcrumb-premium) { display: inline-flex !important; width: fit-content; align-items: center; gap: 7px; margin: 0 0 22px !important; padding: 0 !important; min-height: 24px; border: 0 !important; background: transparent !important; color: #6c8277 !important; font-size: 11px !important; font-weight: 600 !important; box-shadow: none !important; }
html body .banner-eyebrow { display: block; padding: 0 !important; background: transparent !important; color: var(--accent, var(--studio-teal)) !important; font-size: 10px !important; letter-spacing: 1.5px !important; margin: 0 0 10px !important; }
html body .premium-category-banner h1 { font-size: clamp(28px, 3vw, 40px) !important; line-height: 1.2 !important; font-weight: 750 !important; letter-spacing: -1.5px !important; color: var(--studio-ink) !important; margin: 0 0 14px !important; }
html body :is(.banner-content > p, .category-subtitle) { max-width: 690px; font-size: 13px !important; line-height: 1.8 !important; color: var(--studio-muted) !important; margin: 0 !important; }
html body .banner-tags { gap: 16px !important; margin-top: 23px !important; flex-wrap: wrap; }
html body .banner-tags span { padding: 0 !important; background: transparent !important; border: 0 !important; color: #728077 !important; font-size: 10px !important; }
html body .banner-tags span::before { content: '✓'; color: var(--studio-teal); margin-inline-end: 6px; }
html body .banner-stats-card { display: flex !important; align-items: center; gap: 16px; flex-shrink: 0; padding: 24px !important; border: 1px solid #e4ece5 !important; background: #f4f8f4 !important; border-radius: 10px !important; box-shadow: none !important; }
html body .stat-ring { width: 48px !important; height: 48px !important; border: none !important; background: transparent !important; color: var(--accent, var(--studio-teal)) !important; box-shadow: none !important; }
html body .stat-meta strong { font-size: 30px !important; color: var(--studio-ink) !important; letter-spacing: -1px; }
html body .stat-meta span { font-size: 9px !important; letter-spacing: 1px !important; color: #7e8d82 !important; }
html body .tool-directory-premium { padding: 0 !important; margin-block: 32px 48px !important; border: none !important; background: transparent !important; box-shadow: none !important; }
html body .category-top-tasks { margin: 0 0 36px !important; padding: 0 0 28px !important; border: none !important; border-bottom: 1px solid var(--studio-line) !important; background: transparent !important; box-shadow: none !important; }
html body .category-top-tasks h2 { font-size: 18px !important; letter-spacing: -.5px !important; }
html body .category-task-row { gap: 8px !important; }
html body .category-task-link { background: #fff !important; border: 1px solid var(--studio-line) !important; border-radius: 6px !important; padding: 10px 13px !important; font-size: 11px !important; color: #426154 !important; box-shadow: none !important; }
html body .search-box-premium { background: #fff !important; border: 1px solid #d7e1db !important; border-radius: 7px !important; padding: 10px 14px !important; box-shadow: none !important; }
html body .search-box-premium input { font-size: 12px !important; }
html body .category-filter-chips { gap: 6px !important; margin-bottom: 22px !important; }
html body .category-pagination { margin-top: 28px !important; gap: 7px; }
html body .category-pagination :is(a, button) { border-radius: 6px !important; box-shadow: none !important; }
html body .category-page-container { padding: 0 !important; margin-block: 40px !important; }
html body .format-section + .format-section { padding-top: 36px; border-top: 1px solid var(--studio-line); }

/* Tool workspace - Centered Header in Middle */
html body .premium-tool-banner { margin-block: 22px 18px !important; padding: 0 !important; background: transparent !important; border: none !important; border-radius: 0 !important; box-shadow: none !important; }
html body .tool-banner-glass { display: flex !important; flex-direction: column !important; justify-content: center !important; align-items: center !important; text-align: center !important; gap: 14px; margin: 0 auto !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; width: 100% !important; }
html body .tool-banner-left { text-align: center !important; display: flex !important; flex-direction: column !important; align-items: center !important; width: 100% !important; margin: 0 auto !important; }
html body .breadcrumb-premium { justify-content: center !important; margin: 0 auto 6px auto !important; }
html body .premium-tool-banner h1 { margin: 0 auto 8px auto !important; font-size: clamp(28px, 3.2vw, 38px) !important; font-weight: 800 !important; line-height: 1.18 !important; letter-spacing: -1.2px !important; color: var(--studio-ink) !important; text-align: center !important; }
html body .tool-subtitle { margin: 0 auto 14px auto !important; font-size: 13.5px !important; line-height: 1.6 !important; max-width: 680px; color: var(--studio-muted) !important; text-align: center !important; }
html body .tool-page-actions { justify-content: center !important; margin: 6px auto 12px auto !important; gap: 10px !important; }
html body .tool-page-actions .small-button { min-height: 32px !important; padding: 6px 12px !important; font-size: 10.5px !important; }
html body .tool-capability-badges { justify-content: center !important; margin: 0 auto !important; gap: 8px !important; }
html body .visual-flow-connector { display: flex !important; align-items: center; justify-content: center; gap: 12px; padding: 14px 22px; border: 1px solid var(--studio-line); border-radius: 10px; background: #fff; margin: 10px auto 0 auto !important; }
html body .flow-node { width: auto !important; min-width: 64px; height: 52px !important; padding: 8px 14px !important; background: #f4f6f5 !important; border: 1px solid #e1e8e2 !important; border-radius: 6px !important; box-shadow: none !important; color: #647a6b !important; }
html body .flow-node.target { background: #eaf5ef !important; color: var(--studio-teal) !important; }
html body .flow-node span { color: inherit !important; font-size: 12px !important; font-weight: 600 !important; }
html body .flow-arrow-glowing { width: 26px !important; background: #bad0c3 !important; box-shadow: none !important; }
html body .glow-dot { animation: none !important; background: var(--studio-teal) !important; box-shadow: none !important; }

/* Full-width Upload Files Section & Balanced Tool Layout */
html body .converter-layout-premium {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  gap: 18px !important;
  margin-block: 0 24px !important;
}

html body .converter-panel-premium {
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 24px 28px !important;
  border: 1px solid var(--studio-line) !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: 0 3px 12px rgba(23, 44, 56, 0.04) !important;
  box-sizing: border-box !important;
}

html body .panel-head-premium { display: flex !important; align-items: center; justify-content: space-between; gap: 15px; background: transparent !important; border-bottom: 1px solid #edf1ee !important; padding: 0 0 14px !important; margin-bottom: 16px !important; }
html body .panel-head-premium h2 { margin: 0 !important; font-size: 18px !important; text-align: start !important; letter-spacing: -.4px !important; }
html body .panel-status-group { justify-content: flex-start !important; }
html body .status-pill { display: inline-flex !important; padding: 5px 9px !important; border-radius: 4px !important; background: #edf6ef !important; color: #488359 !important; border: 0 !important; font-size: 9.5px !important; white-space: nowrap; }
html body :is(.pulse-indicator, .pulse-dot) { background: #439b72 !important; box-shadow: none !important; animation: none !important; }
html body .upload-context-row { gap: 12px !important; margin: 0 0 18px !important; }
html body .upload-context-item { border: 1px solid #e7ede8 !important; border-radius: 8px !important; padding: 10px 14px !important; background: #f8faf8 !important; box-shadow: none !important; }
html body .upload-context-item > span { color: #789081 !important; font-size: 9.5px !important; letter-spacing: .8px !important; }
html body .upload-context-item strong { font-size: 13px !important; color: #2e4d3f !important; }
html body .upload-context-item small { font-size: 10.5px !important; color: #748378 !important; }
html body .drop-zone-premium { display: flex !important; min-height: 185px !important; border: 1.5px dashed #92bbaa !important; border-radius: 10px !important; background: #f3f8f5 !important; padding: 24px 18px !important; box-shadow: none !important; }
html body .drop-zone-premium:hover, html body .drop-zone-premium.drag-active { background: #eaf5ee !important; border-color: var(--studio-teal) !important; transform: none !important; }
html body .drop-zone-surface { padding: 0 !important; border: 0 !important; background: transparent !important; }
html body .drop-icon-container { width: 48px !important; height: 48px !important; margin-bottom: 12px !important; background: #e0eee5 !important; color: var(--studio-teal) !important; border: 0 !important; border-radius: 12px !important; box-shadow: none !important; transform: none !important; }
html body .drop-icon-container svg { width: 24px !important; height: 24px !important; }
html body #drop-label { font-size: 16px !important; line-height: 1.4; font-weight: 700 !important; color: #234334 !important; }
html body .drop-info-text { font-size: 11.5px !important; color: #627e6d !important; }
html body .upload-meta-pills { flex-wrap: wrap; justify-content: center; gap: 6px !important; margin-top: 12px !important; }
html body .upload-meta-pills span { padding: 3px 9px !important; border: 1px solid #dfe9e2 !important; border-radius: 4px !important; background: #fff !important; font-size: 9.5px !important; color: #627a6c !important; }
html body .selected-files-panel { padding: 14px 0 !important; border: 0 !important; border-bottom: 1px solid #edf1ee !important; background: transparent !important; box-shadow: none !important; }
html body .selected-files-head { gap: 12px; align-items: center; }
html body .selected-files-head strong { font-size: 12.5px !important; }
html body .selected-files-head p { font-size: 10.5px !important; }
html body .empty-file-state { padding: 12px !important; border: none !important; background: #f8faf8 !important; font-size: 11px !important; }
html body :is(.conversion-settings-panel, .converter-guidance-details) { border: 1px solid #e3eae4 !important; border-radius: 8px !important; background: #fafcfb !important; box-shadow: none !important; padding: 14px 16px !important; margin-top: 16px !important; }
html body .conversion-settings-grid { gap: 12px !important; }
html body .conversion-setting-field :is(input, select), html body .generator-field :is(input, textarea, select) { min-width: 0; max-width: 100%; padding: 9px 12px !important; border: 1px solid #d9e3db !important; border-radius: 6px !important; background: #fff !important; color: #355447 !important; font-size: 12px !important; box-shadow: none !important; }
html body .action-footer-premium { margin-top: 18px !important; padding: 0 !important; background: transparent !important; border: none !important; }
html body .action-button-premium { min-height: 48px !important; }
html body .progress-steps { margin-top: 16px !important; gap: 6px !important; }
html body .progress-steps span { padding: 6px 10px !important; border-radius: 4px !important; color: #7f9084 !important; background: #f2f6f3 !important; font-size: 10.5px !important; border: 0 !important; }
html body .progress-steps span.active { color: #1a6f4e !important; background: #e0f0e5 !important; }

/* Tools Side: Conversion Summary & Specifications (Foldable Like FAQs) */
html body .tool-meta-premium {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 18px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  position: static !important;
  min-width: 0 !important;
  align-items: start !important;
  box-sizing: border-box !important;
}

@media (max-width: 768px) {
  html body .tool-meta-premium {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
}

/* Hide redundant secondary cards from tool meta so page stays clean & not too long */
html body .tool-meta-premium .info-card-premium {
  display: none !important;
}

/* Foldable Card Surfaces (Native <details>) */
html body :is(.meta-card-premium, .conversion-summary-card) {
  background: #ffffff !important;
  border: 1px solid var(--studio-line, #dfe7e1) !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 8px rgba(23, 44, 56, 0.03) !important;
  display: flex !important;
  flex-direction: column !important;
  min-height: auto !important;
  box-sizing: border-box !important;
  padding: 0 !important;
  overflow: hidden !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
}

html body :is(.meta-card-premium, .conversion-summary-card):hover {
  border-color: #bad3c5 !important;
  box-shadow: 0 4px 14px rgba(23, 44, 56, 0.06) !important;
}

/* Foldable Headers (<summary>) */
html body :is(.meta-card-head, .meta-card-premium > summary) {
  cursor: pointer !important;
  list-style: none !important;
  user-select: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 16px 22px !important;
  margin: 0 !important;
  border-bottom: 1px solid transparent !important;
  color: var(--studio-teal, #087f73) !important;
  background: #ffffff !important;
  transition: background 0.18s ease, border-color 0.18s ease !important;
}

html body :is(.meta-card-head, .meta-card-premium > summary)::-webkit-details-marker {
  display: none !important;
}

html body :is(.meta-card-head, .meta-card-premium > summary):hover {
  background: #fbfdfc !important;
}

html body details.meta-card-premium[open] summary.meta-card-head {
  border-bottom: 1px solid #edf3ef !important;
}

html body .meta-head-title {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
}

html body .meta-head-title h3,
html body .meta-card-head h3 {
  margin: 0 !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: 0.03em !important;
  text-transform: uppercase !important;
  color: var(--studio-ink, #142a21) !important;
}

/* Rotating Chevron */
html body .meta-card-premium .faq-chevron {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  background: #f0f6f2 !important;
  color: var(--studio-teal, #087f73) !important;
  transition: transform 0.25s ease, background 0.18s ease !important;
  flex-shrink: 0 !important;
}

html body details.meta-card-premium:hover .faq-chevron {
  background: #e2f0e7 !important;
}

html body details.meta-card-premium[open] .faq-chevron svg {
  transform: rotate(180deg) !important;
  transition: transform 0.25s ease !important;
}

html body details.meta-card-premium:not([open]) .faq-chevron svg {
  transform: rotate(0deg) !important;
  transition: transform 0.25s ease !important;
}

/* Spec Rows Inside Foldable */
html body .spec-list-premium {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  width: 100% !important;
  flex: 1 !important;
  padding: 12px 22px 14px 22px !important;
  box-sizing: border-box !important;
}

html body .spec-item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 8px 0 !important;
  border: 0 !important;
  border-bottom: 1px dashed #e8efe9 !important;
  font-size: 12.5px !important;
  gap: 12px !important;
  min-height: 36px !important;
  box-sizing: border-box !important;
}

html body .spec-item:last-child {
  border-bottom: none !important;
  padding-bottom: 2px !important;
}

html body .spec-item :is(.spec-k, span:first-child) {
  color: #556b60 !important;
  font-weight: 600 !important;
  font-size: 12px !important;
  white-space: nowrap !important;
}

html body .spec-item :is(.spec-v, strong:last-child) {
  color: var(--studio-ink, #152d23) !important;
  font-weight: 700 !important;
  font-size: 12.5px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  text-align: right !important;
}

/* Extension Badges */
html body .ext-tag {
  display: inline-flex !important;
  align-items: center !important;
  padding: 2px 7px !important;
  border-radius: 5px !important;
  font-size: 11px !important;
  font-weight: 750 !important;
  letter-spacing: 0.02em !important;
  color: #1a6d41 !important;
  background: #eaf5ee !important;
  border: 1px solid #cde4d4 !important;
}

html body .ext-tag.output-tag {
  color: #0d6e64 !important;
  background: #e4f5f2 !important;
  border-color: #c0e8e0 !important;
}

/* Status Green */
html body .spec-item .status-green {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  background: #edf7ee !important;
  color: #276d43 !important;
  padding: 3px 9px !important;
  border-radius: 12px !important;
  font-size: 11.5px !important;
  font-weight: 650 !important;
}

html body .pulse-dot {
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: #2ebd6a !important;
  display: inline-block !important;
}

/* Bottom Note */
html body .summary-bottom-note {
  margin: 0 22px 16px 22px !important;
  padding: 9px 12px !important;
  border-radius: 7px !important;
  background: #f4f8f5 !important;
  border: 1px solid #e7f0e9 !important;
  color: #557062 !important;
  font-size: 11px !important;
  line-height: 1.5 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* FAQ Accordion Fix: Answers open when clicked */
html body .faq-accordion-container {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  width: 100% !important;
}

html body .faq-accordion-item {
  border: 1px solid #e1ebe4 !important;
  border-radius: 10px !important;
  background: #fff !important;
  overflow: hidden !important;
  box-shadow: 0 1px 4px rgba(23, 44, 56, 0.02) !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
}

html body .faq-accordion-item:hover {
  border-color: #bad3c5 !important;
}

html body .faq-accordion-question {
  cursor: pointer !important;
  list-style: none !important;
  user-select: none !important;
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 16px 20px !important;
  width: 100% !important;
  background: #ffffff !important;
  border: none !important;
  box-sizing: border-box !important;
  text-align: left !important;
  color: var(--studio-ink, #142a21) !important;
}

html body .faq-accordion-question::-webkit-details-marker {
  display: none !important;
}

html body .faq-q-badge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 26px !important;
  height: 26px !important;
  border-radius: 6px !important;
  background: #eef6f1 !important;
  color: var(--studio-teal, #087f73) !important;
  font-size: 11.5px !important;
  font-weight: 800 !important;
  flex-shrink: 0 !important;
}

html body .faq-q-text {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: var(--studio-ink, #142a21) !important;
  flex: 1 !important;
  line-height: 1.4 !important;
}

html body .faq-accordion-question .faq-chevron {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  background: #f2f7f4 !important;
  color: #617b6e !important;
  transition: transform 0.25s ease, background 0.2s !important;
  flex-shrink: 0 !important;
}

html body .faq-accordion-item[open] .faq-accordion-question .faq-chevron svg {
  transform: rotate(180deg) !important;
}

html body .faq-accordion-item:not([open]) .faq-accordion-question .faq-chevron svg {
  transform: rotate(0deg) !important;
}

html body .faq-accordion-item[open] .faq-accordion-question {
  border-bottom: 1px solid #edf4f0 !important;
}

/* THE CRITICAL FIX: Ensure answer displays when [open] or .active */
html body .faq-accordion-answer {
  display: none !important;
}

html body .faq-accordion-item[open] .faq-accordion-answer,
html body .faq-accordion-item.active .faq-accordion-answer {
  display: block !important;
  padding: 16px 20px 18px !important;
  color: #3b5346 !important;
  font-size: 13.5px !important;
  line-height: 1.75 !important;
  background: #fbfdfc !important;
}

html body .faq-accordion-answer p {
  margin: 0 0 10px 0 !important;
  color: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
}

html body .faq-accordion-answer p:last-child {
  margin-bottom: 0 !important;
}

/* Impressive, Structured & User-Friendly Content Details / Documentation */
html body :is(.tool-steps-section, .tool-knowledge-section, .tool-faq-section, .related-section-premium, .tool-content-premium, .article-section) { margin-block: 26px !important; }
html body :is(.article-section, .tool-steps-section, .tool-knowledge-section, .tool-faq-section) { padding: 0 !important; background: transparent !important; border: none !important; box-shadow: none !important; }

html body .tool-knowledge-header {
  text-align: center !important;
  margin-bottom: 20px !important;
}

html body .tool-knowledge-header .section-eyebrow {
  display: inline-block !important;
  padding: 4px 12px !important;
  background: #e8f4ec !important;
  color: #176f45 !important;
  border-radius: 20px !important;
  font-size: 10.5px !important;
  font-weight: 750 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  margin-bottom: 8px !important;
}

html body .tool-knowledge-header h2 {
  font-size: clamp(23px, 2.5vw, 30px) !important;
  font-weight: 800 !important;
  letter-spacing: -0.6px !important;
  color: var(--studio-ink, #142a21) !important;
  margin: 0 0 8px 0 !important;
}

html body .tool-knowledge-header p {
  font-size: 13px !important;
  color: #557063 !important;
  max-width: 620px !important;
  margin: 0 auto !important;
  line-height: 1.6 !important;
}

html body .tool-guide-card {
  padding: 28px 32px !important;
  border: 1px solid #dfe9e2 !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  box-shadow: 0 3px 14px rgba(23, 44, 56, 0.03) !important;
}

/* Left-aligned, high-readability prose */
html body .tool-guide-prose {
  text-align: left !important;
  justify-items: start !important;
  max-width: 860px !important;
  margin: 0 auto 24px !important;
}

/* Featured lead callout */
html body .tool-guide-prose p:first-child {
  font-size: 14.5px !important;
  font-weight: 600 !important;
  line-height: 1.75 !important;
  color: #173b2d !important;
  padding: 16px 20px !important;
  background: #f1f8f4 !important;
  border-left: 4px solid var(--studio-teal, #087f73) !important;
  border-radius: 0 8px 8px 0 !important;
  margin-bottom: 18px !important;
}

html body .tool-guide-prose p {
  font-size: 13.5px !important;
  line-height: 1.8 !important;
  color: #3e564a !important;
  margin: 0 0 14px 0 !important;
}

/* 3-Column Insight Cards */
html body .tool-guide-insights {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
  padding: 0 !important;
  max-width: 860px !important;
  margin: 0 auto !important;
}

@media (max-width: 768px) {
  html body .tool-guide-insights {
    grid-template-columns: 1fr !important;
  }
}

html body .tool-guide-insights .article-insight-card {
  background: #f8faf8 !important;
  border: 1px solid #e1eae3 !important;
  border-radius: 10px !important;
  padding: 16px 18px !important;
  box-shadow: 0 2px 6px rgba(23, 44, 56, 0.02) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease !important;
}

html body .tool-guide-insights .article-insight-card:hover {
  transform: translateY(-2px) !important;
  border-color: #bad3c5 !important;
  box-shadow: 0 6px 16px rgba(23, 44, 56, 0.06) !important;
}

html body .tool-guide-insights .article-insight-card span {
  font-size: 10.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: var(--studio-teal, #087f73) !important;
}

html body .tool-guide-insights .article-insight-card strong {
  font-size: 14px !important;
  font-weight: 800 !important;
  color: var(--studio-ink, #142a21) !important;
}

html body .tool-guide-insights .article-insight-card p {
  font-size: 12px !important;
  line-height: 1.6 !important;
  color: #557063 !important;
  margin: 0 !important;
}

html body .article-illustration { background: #edf5ef !important; border-radius: 7px !important; color: var(--studio-teal) !important; }
html body .tool-steps-list li { background: #fff !important; border: 1px solid var(--studio-line) !important; border-radius: 9px !important; box-shadow: none !important; }
html body .tool-steps-list li::before { background: var(--studio-soft) !important; color: var(--studio-teal) !important; box-shadow: none !important; }
html body .tool-steps-list strong { font-size: 13px !important; color: #2b4a39 !important; }
html body .tool-steps-list span { font-size: 11px !important; color: #7c8b80 !important; }
html body :is(.faq-card-premium, .faq-text) details { border: 1px solid #e2e9e3 !important; border-radius: 7px !important; background: #fafcfb !important; box-shadow: none !important; }
html body :is(.faq-card-premium, .faq-text) summary { font-size: 13px !important; color: #385a46 !important; }
html body .generator-studio-container { border: 0 !important; border-radius: 0 !important; box-shadow: none !important; padding: 0 !important; background: transparent !important; }
html body .generator-studio-header { padding: 0 0 20px !important; border-bottom: 1px solid var(--studio-line); background: transparent !important; }
html body .generator-studio-header h3 { font-size: 18px !important; }
html body .generator-studio-header p { color: var(--studio-muted) !important; font-size: 12px !important; }
html body .gen-header-icon { background: var(--studio-soft) !important; color: var(--studio-teal) !important; border-radius: 10px !important; }
html body .generator-app { padding: 24px 0 0 !important; }
html body .generator-result { padding: 20px !important; background: #f2f7f3 !important; border: 1px solid #dce8df !important; border-radius: 8px !important; }
html body .generator-result pre { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 13px; }
html body #generator-canvas { max-width: 100%; height: auto; }
html body :is(.blog-card, .auth-card, .account-card, .trust-card) { background: #fff !important; border: 1px solid var(--studio-line) !important; border-radius: 10px !important; box-shadow: 0 3px 12px #253e2e06 !important; }
html body :is(.auth-page, .account-page, .blog-page, .trust-page) h1 { color: var(--studio-ink) !important; letter-spacing: -1px !important; }

/* Footer */
html body .site-footer { margin-top: 60px !important; padding: 38px 0 20px !important; background: #192e2b !important; border-top: 0 !important; color: #d0dcd4 !important; }
html body .footer-inner-compact { width: min(1160px, calc(100% - 64px)) !important; max-width: 1160px !important; margin: auto !important; padding: 0 !important; }
html body .footer-main-row { gap: 24px !important; padding-bottom: 28px !important; align-items: center; }
html body .footer-brand-title { color: #f1f6f3 !important; font-size: 21px !important; letter-spacing: -.6px !important; }
html body .footer-brand-badge { font-size: 9px !important; color: #b7ccbf !important; border: 0 !important; background: #294039 !important; padding: 5px 8px !important; border-radius: 4px !important; }
html body .footer-nav-compact { gap: 14px !important; }
html body .footer-nav-compact a { color: #bdcdc2 !important; font-size: 11px !important; }
html body .footer-dot { display: none !important; }
html body .footer-sub-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 20px !important;
  border-top: 1px solid #354a41 !important;
  padding-top: 22px !important;
  margin-top: 8px !important;
}
html body .footer-sub-left { display: flex !important; align-items: center !important; flex: 1 1 0% !important; min-width: 140px; }
html body .footer-socials-ilovepdf { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 22px !important; flex: 0 0 auto !important; }
html body .ilovepdf-social-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #9cb3a5 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 4px !important;
  margin: 0 !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  border-radius: 0 !important;
  text-decoration: none !important;
  transition: color 0.18s ease, transform 0.18s ease !important;
}
html body .ilovepdf-social-link svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  fill: currentColor !important;
  transition: transform 0.18s ease !important;
}
html body .ilovepdf-social-link:hover {
  color: #ffffff !important;
  background: transparent !important;
  transform: translateY(-2px) !important;
}
html body .footer-sub-right { display: flex !important; align-items: center !important; justify-content: flex-end !important; flex: 1 1 0% !important; min-width: 180px; }
html body :is(.footer-sub-right p, .footer-copy) { color: #8fa597 !important; font-size: 11px !important; margin: 0 !important; white-space: nowrap !important; }
html body .footer-lang-btn { border: 1px solid #455d4f !important; background: transparent !important; color: #cfdfd3 !important; border-radius: 6px !important; font-size: 11px !important; cursor: pointer !important; }
html body .footer-lang-menu {
  position: absolute !important;
  bottom: calc(100% + 12px) !important;
  left: 0 !important;
  right: auto !important;
  inset-inline-start: 0 !important;
  inset-inline-end: auto !important;
  background: #ffffff !important;
  border: 1px solid var(--studio-line) !important;
  border-radius: 12px !important;
  box-shadow: 0 16px 40px rgba(14, 39, 31, 0.22) !important;
  padding: 12px !important;
  width: min(520px, calc(100vw - 48px)) !important;
  max-height: 360px !important;
  overflow-y: auto !important;
  z-index: 99999 !important;
}
html body .footer-lang-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 4px !important;
}
html body .footer-lang-item {
  color: #3b5647 !important;
  font-size: 12px !important;
  padding: 8px 10px !important;
  border-radius: 6px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  text-decoration: none !important;
}
html body .footer-lang-item:hover { background: var(--studio-soft) !important; color: var(--studio-teal) !important; }
html body .footer-lang-item.active { background: var(--studio-soft) !important; color: var(--studio-teal) !important; font-weight: 700 !important; }

@media (max-width: 1080px) {
  html body .site-header-inner { gap: 12px !important; }
  html body .top-nav { gap: 0 !important; }
  html body .nav-main-link { padding: 10px 7px !important; font-size: 11px !important; }
  html body .home-hero-studio .hero-content { gap: 28px !important; }
  html body .home-converter-hub-card { padding: 20px !important; }
  html body :is(.ilovepdf-tools-grid, .tool-grid-premium, .quick-grid) { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  html body .converter-layout-premium { display: flex !important; flex-direction: column !important; width: 100% !important; gap: 16px !important; }
  html body .converter-panel-premium { padding: 20px !important; }
  html body .visual-flow-connector { padding: 18px; }
}
@media (max-width: 820px) {
  html body .site-header-inner { flex-wrap: wrap !important; padding-top: 14px !important; gap: 12px !important; }
  html body .site-header .top-nav { display: flex !important; order: 3; width: 100%; justify-content: space-between; border-top: 1px solid #eff2ef; }
  html body .nav-main-link { padding: 12px 8px !important; }
  html body .home-hero-studio { padding-top: 36px !important; }
  html body .home-hero-studio .hero-content { grid-template-columns: minmax(0, 1fr) !important; gap: 28px !important; }
  html body .home-hero-intro { text-align: center; }
  html body .home-hero-studio .hero-content h1 { max-width: 620px !important; margin-inline: auto !important; font-size: 44px !important; text-align: center !important; }
  html body .home-hero-studio .hero-subtext { max-width: 560px !important; margin-inline: auto !important; text-align: center !important; }
  .hero-format-illustration { justify-content: center; margin-top: 22px; }
  html body .home-converter-hub-card { padding: 24px !important; }
  html body .search-and-stats { flex-direction: column !important; gap: 20px !important; }
  html body .search-box-home { max-width: none !important; }
  html body .stat-pills { width: 100%; justify-content: space-around; }
  html body .stat-pills > span { align-items: center; }
  html body .converter-layout-premium { display: flex !important; flex-direction: column !important; width: 100% !important; }
  html body .tool-meta-premium { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  html body .visual-flow-connector { display: none !important; }
  html body .banner-glass { gap: 20px; }
  html body .banner-stats-card { padding: 18px !important; }
  html body .stat-ring { display: none !important; }
  html body .directory-toolbar { flex-wrap: wrap; }
  html body .tool-content-premium { display: grid !important; grid-template-columns: 1fr !important; }
  html body .footer-main-row { flex-wrap: wrap; }
  html body .footer-nav-compact { flex-wrap: wrap; }
}
@media (max-width: 600px) {
  html { scroll-padding-top: 125px; }
  html body :is(.site-header-inner, .home-hero-studio .hero-content, .featured-workbench, .tool-shelf, .tool-directory-premium, .premium-category-banner, .premium-tool-banner, .converter-layout-premium, .tool-steps-section, .tool-knowledge-section, .tool-faq-section, .related-section-premium, .tool-content-premium, .tool-internal-links, .article-section, .category-page-container, .footer-inner-compact) { width: calc(100% - 32px) !important; }
  html body .brand-mark { width: 34px !important; height: 34px !important; border-radius: 9px !important; }
  html body .brand-copy strong { font-size: 17px !important; }
  html body .brand-copy small { font-size: 7px !important; }
  html body .header-actions { gap: 0 !important; }
  html body .auth-link { padding: 8px 10px !important; font-size: 10px !important; min-height: 36px !important; }
  html body .site-header .top-nav { flex-wrap: nowrap !important; overflow-x: auto; overflow-y: hidden; justify-content: flex-start; scrollbar-width: none; }
  html body .nav-item-dropdown { flex-shrink: 0; }
  html body .nav-main-link { padding: 12px 10px !important; font-size: 10px !important; white-space: nowrap; }
  html body .nav-mega-menu { display: none !important; }
  html body .nav-caret { display: none; }
  html body .home-hero-studio { padding: 24px 0 !important; }
  html body .home-hero-intro .badge { font-size: 9px !important; margin-bottom: 16px !important; letter-spacing: .8px !important; }
  html body .home-hero-studio .hero-content h1 { font-size: 35px !important; letter-spacing: -1.5px !important; margin-bottom: 16px !important; }
  html body .home-hero-studio .hero-subtext { font-size: 12px !important; line-height: 1.8 !important; }
  .hero-format-illustration { gap: 12px; margin-top: 20px; }
  .hero-file-sheet { width: 43px; height: 55px; padding: 9px 8px 6px; }
  .hero-file-lines { height: 12px; margin-bottom: 4px; }
  .hero-format-caption { font-size: 9px; }
  html body .home-converter-hub-card { padding: 16px !important; border-radius: 11px !important; }
  html body .hub-tabs-nav { margin-bottom: 17px !important; }
  html body .hub-tab-btn { font-size: 10px !important; padding: 8px 5px !important; min-height: 40px; gap: 5px; }
  html body .format-selector-studio { grid-template-columns: minmax(0, 1fr) 18px minmax(0, 1fr) !important; gap: 13px 5px !important; }
  html body .selector-box { padding: 12px 8px !important; }
  html body .selector-box label { font-size: 8px !important; letter-spacing: .4px !important; }
  html body .selector-swap-icon { width: 18px !important; transform: none !important; }
  html body .format-dropdown { font-size: 10px !important; }
  html body .shortcut-pill { font-size: 9px !important; padding: 5px 7px !important; }
  html body .home-popular-shortcuts { margin-top: 17px !important; padding-top: 15px !important; }
  html body .stat-pills { gap: 12px !important; }
  html body .stat-pills strong { font-size: 15px !important; }
  html body .stat-pills > span { font-size: 9px !important; }
  html body .featured-workbench { margin-block: 28px !important; }
  html body .category-pills-bar { flex-wrap: nowrap !important; overflow-x: auto; scrollbar-width: thin; padding-bottom: 7px !important; }
  html body .category-pill { flex-shrink: 0; padding: 8px 10px !important; }
  html body :is(.tools-grid-title, .section-heading h2, .toolbar-left h2, .tool-knowledge-header h2, .article-header h2) { font-size: 21px !important; }
  html body .tools-grid-subtitle { font-size: 10px !important; }
  html body :is(.ilovepdf-tools-grid, .tool-grid-premium, .quick-grid) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }
  html body :is(.tool-card, .ilovepdf-card) { padding: 16px !important; min-height: 184px !important; border-radius: 8px !important; }
  html body :is(.ilovepdf-card-title, .tool-card-body > strong) { font-size: 12px !important; }
  html body .ilovepdf-card-desc { font-size: 10px !important; line-height: 1.7 !important; }
  html body .tool-card-flow { flex-wrap: wrap; gap: 4px !important; }
  html body .tool-card-foot { align-items: start; flex-direction: column; gap: 6px; }
  html body .premium-category-banner { padding: 24px !important; margin-block: 24px !important; }
  html body .banner-glass { align-items: flex-start !important; }
  html body .banner-stats-card { display: none !important; }
  html body .premium-category-banner h1 { font-size: 29px !important; letter-spacing: -1px !important; }
  html body .banner-tags { gap: 9px !important; }
  html body .banner-tags span { font-size: 9px !important; }
  html body .category-top-tasks-head { align-items: start; }
  html body .category-top-tasks h2 { font-size: 17px !important; }
  html body .search-box-premium { width: 100% !important; }
  html body .directory-toolbar { display: grid !important; gap: 18px; }
  html body .premium-tool-banner { margin-block: 24px !important; }
  html body .premium-tool-banner h1 { font-size: 32px !important; letter-spacing: -1px !important; overflow-wrap: anywhere; }
  html body .converter-panel-premium { padding: 16px !important; }
  html body .panel-head-premium h2 { font-size: 14px !important; }
  html body .upload-context-row { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 5px !important; }
  html body .upload-context-item { padding: 9px 7px !important; }
  html body .upload-context-item strong { font-size: 10px !important; overflow-wrap: anywhere; }
  html body .upload-context-item small { font-size: 8px !important; }
  html body .drop-zone-premium { min-height: 220px !important; padding: 22px 12px !important; }
  html body #drop-label { font-size: 14px !important; }
  html body .selected-files-head { flex-wrap: wrap; }
  html body .conversion-settings-grid { grid-template-columns: 1fr !important; }
  html body .tool-meta-premium { grid-template-columns: 1fr; }
  html body .tool-steps-list { grid-template-columns: 1fr !important; }
  html body :is(.article-container-premium, .tool-guide-card, .faq-card-premium, .article-card) { padding: 20px !important; }
  html body .article-card { grid-template-columns: 1fr !important; }
  html body .generator-fields { grid-template-columns: 1fr !important; }
  html body .generator-result-head { flex-direction: column; align-items: flex-start; gap: 12px; }
  html body .generator-result-head > div { display: flex; flex-wrap: wrap; gap: 6px; }
  html body .footer-main-row { flex-direction: column; align-items: flex-start !important; }
  html body .footer-nav-compact { justify-content: flex-start; gap: 16px !important; }
  html body .footer-sub-row { flex-direction: column !important; align-items: center !important; gap: 16px !important; text-align: center !important; }
  html body .footer-sub-left, html body .footer-sub-right { justify-content: center !important; flex: none !important; }
  html body .footer-lang-menu {
    left: 50% !important;
    right: auto !important;
    inset-inline-start: 50% !important;
    inset-inline-end: auto !important;
    transform: translateX(-50%) !important;
    width: min(340px, calc(100vw - 28px)) !important;
    max-width: calc(100vw - 28px) !important;
  }
  html body .footer-lang-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  html body *, html body *::before, html body *::after { animation: none !important; transition: none !important; }
}
