:root{
  --bg:#fbfaf7;
  --bg2:#ffffff;
  --bg3:#f5f2ea;
  --bg4:#eee7db;
  --border:#e8dfd2;
  --border2:#d8c8b4;
  --text:#171411;
  --muted:#72695f;
  --muted2:#a59a8d;
  --accent:#ff7a1a;
  --accent2:#ffb000;
  --accent3:#111827;
  --accent-dark:#fff2e4;
  --green:#12a568;
  --blue:#2563eb;
  --red:#e5484d;
  --purple:#7c3aed;
  --orange:#ff7a1a;
  --radius:22px;
  --radius-sm:14px;
  --shadow:0 24px 80px rgba(50,38,24,.13);
  --shadow-sm:0 12px 35px rgba(50,38,24,.08);
  --ring:0 0 0 4px rgba(255,122,26,.14);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:radial-gradient(circle at 12% 8%,rgba(255,122,26,.16),transparent 28%),radial-gradient(circle at 92% 0%,rgba(255,176,0,.12),transparent 26%),linear-gradient(180deg,#fffdf9 0%,#fbfaf7 48%,#f8f3eb 100%);color:var(--text);font-family:'DM Sans',system-ui,-apple-system,Segoe UI,Arial,sans-serif;font-size:15px;line-height:1.65;min-height:100vh;overflow-x:hidden}
h1,h2,h3,h4,.brand,.btn,.stat-n,.price-amount,.summary b,.format b,.table th{font-family:'Syne','DM Sans',system-ui,sans-serif}
a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.container{max-width:1180px;margin:0 auto;padding:0 24px}.narrow{max-width:960px}.skip{position:absolute;left:-999px;top:8px;background:var(--accent3);color:#fff;padding:8px 12px;border-radius:8px;z-index:999}.skip:focus{left:8px}
.nav{position:sticky;top:0;z-index:100;background:rgba(255,253,249,.86);backdrop-filter:blur(20px);border-bottom:1px solid rgba(232,223,210,.92)}.nav-inner{height:74px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;gap:10px;align-items:center;font-size:20px;font-weight:800;letter-spacing:-.35px}.brand span:not(.logo){color:var(--accent)}.logo{width:38px;height:38px;border-radius:14px;background:linear-gradient(135deg,var(--accent),var(--accent2));display:grid;place-items:center;color:#111;font-weight:900;box-shadow:0 14px 30px rgba(255,122,26,.25)}.nav-links{display:flex;align-items:center;gap:3px}.nav-links a{font-size:13px;color:var(--muted);padding:9px 12px;border-radius:999px;transition:.16s;font-weight:700}.nav-links a:hover,.nav-links a.active{color:#111;background:var(--accent-dark)}.nav-cta{background:linear-gradient(135deg,var(--text),#34312d);color:#fff;border:0;border-radius:999px;padding:10px 18px;font-weight:800;cursor:pointer;box-shadow:0 14px 28px rgba(23,20,17,.18)}.menu-btn{display:none;background:#fff;border:1px solid var(--border);color:var(--text);border-radius:13px;padding:8px 12px;box-shadow:var(--shadow-sm)}.mobile-menu{display:none;border-top:1px solid var(--border);padding:10px 0;background:#fffdf9}.mobile-menu a{display:block;padding:12px 22px;color:var(--muted);font-weight:700}.mobile-menu a.active{color:#111;background:var(--accent-dark)}
.hero{position:relative;min-height:calc(100vh - 74px);display:grid;place-items:center;text-align:center;padding:82px 0;overflow:hidden}.grid-bg{position:absolute;inset:0;opacity:.82;background-image:linear-gradient(rgba(255,122,26,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,122,26,.06) 1px,transparent 1px);background-size:46px 46px;pointer-events:none;mask-image:radial-gradient(circle at center,#000 22%,transparent 76%)}.badge{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.9);border:1px solid var(--border);border-radius:999px;padding:8px 16px;font-size:12px;color:var(--muted);margin-bottom:26px;box-shadow:var(--shadow-sm);font-weight:700}.dot{width:8px;height:8px;background:var(--green);border-radius:50%;box-shadow:0 0 18px rgba(18,165,104,.55)}.hero h1{font-size:clamp(46px,8vw,104px);line-height:.96;letter-spacing:-4px;margin-bottom:22px}.hero h1 em{font-style:normal;background:linear-gradient(135deg,var(--accent),var(--accent2));-webkit-background-clip:text;background-clip:text;color:transparent}.lead{color:var(--muted);font-size:18px;max-width:700px;margin:0 auto 32px}.btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.btn{display:inline-flex;justify-content:center;align-items:center;gap:8px;border-radius:999px;padding:13px 22px;font-weight:800;border:1px solid var(--border);cursor:pointer;transition:.18s;background:#fff;box-shadow:0 8px 20px rgba(50,38,24,.05);white-space:nowrap}.btn:hover{transform:translateY(-2px);box-shadow:0 18px 36px rgba(50,38,24,.11)}.btn.primary{background:linear-gradient(135deg,var(--accent),var(--accent2));border-color:transparent;color:#18120a}.btn.secondary{background:#fff;color:var(--text)}.btn.danger{color:#fff;background:linear-gradient(135deg,var(--red),#fb7185);border-color:transparent}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;max-width:860px;margin:54px auto 0}.stat{background:rgba(255,255,255,.9);border:1px solid var(--border);border-radius:20px;padding:23px;box-shadow:var(--shadow-sm)}.stat-n{font-size:30px;font-weight:800}.stat-l{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:1px;font-weight:800}.section{padding:78px 0}.section.alt{background:rgba(255,255,255,.64);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.section-head{text-align:center;margin-bottom:38px}.label{display:block;color:var(--accent);font-size:11px;font-weight:800;letter-spacing:3px;text-transform:uppercase;margin-bottom:10px}.section-head h2,.page-title h1{font-size:clamp(30px,4vw,50px);line-height:1.08;letter-spacing:-1.4px}.section-head p,.page-title p{color:var(--muted);margin-top:10px}.page-title{margin-bottom:28px}.page-title h1{margin-top:3px}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:18px}.card{background:rgba(255,255,255,.96);border:1px solid var(--border);border-radius:var(--radius);padding:27px;transition:.18s;box-shadow:var(--shadow-sm);position:relative;overflow:hidden}.card:before{content:'';position:absolute;inset:auto 24px 0;height:3px;background:linear-gradient(90deg,var(--accent),var(--accent2));opacity:0;transition:.18s}.card:hover{border-color:#f7c58c;transform:translateY(-5px);box-shadow:var(--shadow)}.card:hover:before{opacity:1}.tool-icon{width:54px;height:54px;border-radius:18px;display:grid;place-items:center;font-size:24px;margin-bottom:17px}.yellow{background:#fff4d6;color:#b45309}.blue{background:#eaf2ff;color:var(--blue)}.green{background:#e9fbf2;color:var(--green)}.red{background:#fff0ed;color:var(--red)}.card h3{font-size:18px;margin-bottom:7px;letter-spacing:-.3px}.card p{font-size:13px;color:var(--muted)}.tag{display:inline-block;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;border-radius:999px;padding:5px 10px}.tag.free{background:#e9fbf2;color:var(--green)}.tag.popular{background:var(--accent-dark);color:#a24700}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.step{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:30px;text-align:center;box-shadow:var(--shadow-sm)}.step-num{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent2));display:grid;place-items:center;color:#14100b;font-weight:800;margin:0 auto 13px}.step p{color:var(--muted);font-size:13px}.page-main{padding:54px 0 88px}.tool-shell{background:rgba(255,255,255,.94);border:1px solid var(--border);border-radius:30px;box-shadow:var(--shadow);padding:30px}.drop{position:relative;border:2px dashed #efbd83;border-radius:24px;padding:56px 22px;text-align:center;cursor:pointer;transition:.18s;background:linear-gradient(180deg,#fff,#fff8ef)}.drop:hover,.drop.over{border-color:var(--accent);background:#fff2e4;transform:translateY(-2px)}.drop input{position:absolute;inset:0;opacity:0;cursor:pointer}.drop-icon{font-size:46px;margin-bottom:12px}.drop h2,.drop h3{font-size:21px;letter-spacing:-.4px}.drop p{color:var(--muted);font-size:13px;margin-top:5px}.controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(185px,1fr));gap:14px;margin:18px 0}.control{background:#fffaf4;border:1px solid var(--border);border-radius:18px;padding:15px}.control label{display:block;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:1px;margin-bottom:9px;font-weight:800}.control b{color:var(--accent)}.control input[type=range]{width:100%;accent-color:var(--accent)}.control input[type=number],.control select,.control input[type=text],.control input[type=email],.control textarea{width:100%;background:#fff;border:1px solid var(--border2);border-radius:12px;color:var(--text);padding:11px 12px;outline:none}.control input:focus,.control select:focus,.control textarea:focus{border-color:var(--accent);box-shadow:var(--ring)}.actions{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}.actions .btn{padding:12px 18px}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}.progress-wrap{display:none;height:10px;border-radius:999px;background:#f1e6d8;overflow:hidden;margin:12px 0}.progress-bar{width:0%;height:100%;background:linear-gradient(90deg,var(--accent),var(--accent2));transition:width .18s}.results{display:flex;flex-direction:column;gap:11px;margin-top:18px}.result{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--border);border-radius:18px;padding:14px;box-shadow:var(--shadow-sm)}.thumb,.thumb-ph{width:62px;height:62px;border-radius:15px;border:1px solid var(--border);object-fit:cover;display:grid;place-items:center;background:#fffaf4;flex:0 0 auto}.res-info{min-width:0;flex:1}.res-name{font-weight:800;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.res-meta{font-size:12px;color:var(--muted);margin-top:3px}.pill{display:inline-block;background:#e9fbf2;color:var(--green);border-radius:999px;padding:3px 8px;margin-left:6px;font-size:10px;font-weight:800}.summary{display:none;grid-template-columns:repeat(4,1fr);gap:14px;margin:18px 0}.summary div{background:#fff;border:1px solid var(--border);border-radius:18px;padding:17px;text-align:center;box-shadow:var(--shadow-sm)}.summary b{display:block;font-size:23px;font-weight:800}.summary span{font-size:10px;color:var(--muted);letter-spacing:1px;text-transform:uppercase;font-weight:800}.preview{background:linear-gradient(180deg,#fff,#fffaf4);border:1px solid var(--border);border-radius:24px;min-height:280px;display:grid;place-items:center;padding:22px;margin:18px 0;text-align:center;box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}.preview img,.preview canvas{max-width:100%;max-height:440px;border-radius:16px;box-shadow:0 12px 34px rgba(50,38,24,.13)}.preset-row{display:flex;gap:9px;flex-wrap:wrap;margin:16px 0}.preset{background:#fff;border:1px solid var(--border);border-radius:999px;color:var(--muted);padding:8px 14px;cursor:pointer;font-size:12px;font-weight:800;transition:.15s}.preset:hover{color:#111;border-color:#efbd83;background:var(--accent-dark)}.format-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(105px,1fr));gap:12px;margin:18px 0}.format{background:#fff;border:1px solid var(--border);border-radius:18px;padding:16px;text-align:center;cursor:pointer;box-shadow:var(--shadow-sm);transition:.15s}.format:hover,.format.selected{background:var(--accent-dark);border-color:#efbd83;transform:translateY(-2px)}.format b{display:block;font-size:17px;font-weight:800}.format span{font-size:11px;color:var(--muted)}.table{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:1px solid var(--border);border-radius:18px;overflow:hidden;box-shadow:var(--shadow-sm)}.table th,.table td{text-align:left;border-bottom:1px solid var(--border);padding:13px;font-size:13px}.table tr:last-child th,.table tr:last-child td{border-bottom:0}.table th{color:#a24700;font-weight:800}.faq{display:grid;gap:14px}.faq details{background:#fff;border:1px solid var(--border);border-radius:18px;padding:18px;box-shadow:var(--shadow-sm)}.faq summary{cursor:pointer;font-weight:800}.faq p{color:var(--muted);font-size:13px;margin-top:10px}.compare{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:18px}.compare .card{padding:20px}.notice{padding:15px 17px;border:1px solid #f5c58e;border-radius:18px;background:#fff7ed;color:#7c2d12;font-size:13px;margin:18px 0;font-weight:700}.hidden{display:none!important}.footer{background:#fffdf9;border-top:1px solid var(--border);padding:44px 0 24px;margin-top:44px}.footer-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:30px}.footer h4{font-size:12px;color:var(--muted);letter-spacing:2px;text-transform:uppercase;margin-bottom:12px}.footer a{display:block;color:var(--muted);font-size:13px;margin:8px 0}.footer .brand{display:flex}.footer a:hover{color:var(--accent)}.foot-bottom{border-top:1px solid var(--border);margin-top:30px;padding-top:18px;color:var(--muted);font-size:12px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}.toast{position:fixed;right:22px;bottom:22px;background:#fff;border:1px solid var(--border2);border-radius:16px;padding:13px 17px;z-index:999;opacity:0;transform:translateY(40px);transition:.25s;box-shadow:var(--shadow)}.toast.show{opacity:1;transform:translateY(0)}.toast.ok{border-color:#86efac;color:#166534}.price-card{background:#fff;border:1px solid var(--border);border-radius:24px;padding:28px;box-shadow:var(--shadow-sm)}.price-card.featured{border-color:#efbd83;box-shadow:var(--shadow);background:linear-gradient(180deg,#fff,#fff4e7)}.price-amount{font-size:44px;font-weight:800;letter-spacing:-1px}.price-features{list-style:none;display:grid;gap:10px;margin:18px 0}.price-features li{color:var(--muted);font-size:13px}.price-features li:before{content:'✓';color:var(--green);font-weight:900;margin-right:8px}.price-features li.no:before{content:'×';color:var(--muted2)}
@media(max-width:980px){.nav-links,.nav-cta{display:none}.menu-btn{display:block}.mobile-menu.open{display:block}.stats,.summary,.steps,.footer-grid,.compare{grid-template-columns:1fr 1fr}.hero h1{letter-spacing:-2px}.result{align-items:flex-start;flex-wrap:wrap}.result .btn{width:100%}}
@media(max-width:560px){.stats,.summary,.steps,.footer-grid,.compare{grid-template-columns:1fr}.hero{min-height:auto}.tool-shell{padding:18px;border-radius:22px}.container{padding:0 16px}.nav-inner{height:64px}.btn{width:100%}.actions{display:grid}.hero h1{font-size:44px}.drop{padding:42px 16px}.section{padding:58px 0}.page-main{padding-top:34px}}


/* ===== SEO + UX/UI Upgrade v3 ===== */
:root{
  --cream:#fffaf1;
  --ink:#12100e;
  --sun:#ff9f1c;
  --sun2:#ffd166;
  --sky:#2563eb;
  --mint:#10b981;
  --rose:#f43f5e;
  --violet:#7c3aed;
}
body{background:
  radial-gradient(circle at 10% -10%, rgba(255,159,28,.18), transparent 32%),
  radial-gradient(circle at 90% 3%, rgba(37,99,235,.08), transparent 30%),
  linear-gradient(180deg,#fffdf8 0%,#fbf7ee 52%,#fff 100%)}
.nav{box-shadow:0 12px 34px rgba(33,26,18,.055)}
.brand{letter-spacing:-.55px}.logo{background:linear-gradient(135deg,#111827,#ff9f1c 58%,#ffd166);color:#fff}
.nav-links a.active,.nav-links a:hover{background:linear-gradient(135deg,#fff3da,#fff);box-shadow:inset 0 0 0 1px rgba(255,159,28,.18)}
.hero h1,.page-title h1,.section-head h2{letter-spacing:-2px}.lead strong{color:var(--ink)}
.seo-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:28px}.seo-chip{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.88);border:1px solid var(--border);border-radius:18px;padding:14px 15px;box-shadow:var(--shadow-sm);font-weight:800;font-size:13px}.seo-chip span{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:var(--accent-dark)}
.tool-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:24px;align-items:center;margin-bottom:28px}.hero-panel{background:linear-gradient(135deg,#fff,#fff5e6);border:1px solid var(--border);border-radius:32px;padding:34px;box-shadow:var(--shadow);position:relative;overflow:hidden}.hero-panel:after{content:'';position:absolute;width:230px;height:230px;border-radius:50%;right:-110px;top:-90px;background:radial-gradient(circle,rgba(255,159,28,.22),transparent 70%)}.hero-panel h1{font-size:clamp(34px,5vw,58px);line-height:1;letter-spacing:-2.4px}.hero-panel p{color:var(--muted);margin-top:14px;font-size:16px}.tool-search-panel{background:#111827;color:#fff;border-radius:32px;padding:28px;box-shadow:0 24px 70px rgba(17,24,39,.25)}.tool-search-panel h2{font-size:24px;margin-bottom:10px}.tool-search{position:relative;margin:15px 0}.tool-search input{width:100%;border:0;border-radius:18px;padding:15px 18px 15px 46px;background:#fff;color:#111;outline:none;font-weight:700}.tool-search:before{content:'⌕';position:absolute;left:18px;top:10px;color:#888;font-size:22px}.tool-cats{display:flex;flex-wrap:wrap;gap:8px}.cat-btn{border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);color:#fff;border-radius:999px;padding:8px 12px;cursor:pointer;font-weight:800;font-size:12px}.cat-btn.active,.cat-btn:hover{background:#fff;color:#111}.tools-showcase{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.tool-card-pro{display:flex;flex-direction:column;min-height:275px;background:rgba(255,255,255,.96);border:1px solid var(--border);border-radius:28px;padding:24px;box-shadow:var(--shadow-sm);position:relative;overflow:hidden;transition:.2s}.tool-card-pro:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:#f4bf82}.tool-card-pro:after{content:'';position:absolute;inset:auto 0 0;height:5px;background:linear-gradient(90deg,var(--sun),var(--sun2),var(--sky));opacity:.9}.tool-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:18px}.tool-card-pro h3{font-size:21px;letter-spacing:-.6px;margin-bottom:8px}.tool-card-pro p{color:var(--muted);font-size:13px}.tool-meta{display:flex;gap:7px;flex-wrap:wrap;margin:15px 0 18px}.mini-pill{background:#f8efe1;border:1px solid #eddcc6;color:#6b4b1d;border-radius:999px;padding:5px 8px;font-size:10px;font-weight:800}.tool-card-pro .btn{margin-top:auto;width:max-content}.tool-icon.big{width:64px;height:64px;border-radius:22px;font-size:29px}.feature-band{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px;margin:28px 0}.feature-box{background:#fff;border:1px solid var(--border);border-radius:24px;padding:22px;box-shadow:var(--shadow-sm)}.feature-box h3{font-size:17px}.feature-box p{color:var(--muted);font-size:13px;margin-top:5px}.faq{display:grid;gap:10px;margin-top:22px}.faq details{background:#fff;border:1px solid var(--border);border-radius:18px;padding:16px 18px;box-shadow:var(--shadow-sm)}.faq summary{font-weight:800;cursor:pointer}.faq p{color:var(--muted);font-size:13px;margin-top:9px}.contact-hero{display:grid;grid-template-columns:.85fr 1.15fr;gap:24px;align-items:start}.contact-card{background:#fff;border:1px solid var(--border);border-radius:28px;padding:26px;box-shadow:var(--shadow-sm)}.contact-card.dark{background:#111827;color:#fff;border-color:#111827;box-shadow:0 24px 70px rgba(17,24,39,.22)}.contact-card.dark p,.contact-card.dark span{color:rgba(255,255,255,.72)}.contact-method{display:flex;gap:14px;padding:15px 0;border-bottom:1px solid rgba(232,223,210,.7)}.contact-method:last-child{border-bottom:0}.method-icon{width:42px;height:42px;border-radius:15px;display:grid;place-items:center;background:var(--accent-dark);font-size:20px;flex:0 0 auto}.contact-card.dark .method-icon{background:rgba(255,255,255,.1)}.contact-method b{display:block}.contact-method span{font-size:13px;color:var(--muted)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-field{margin-bottom:14px}.form-field label{display:block;font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--muted);font-weight:900;margin-bottom:7px}.form-field input,.form-field select,.form-field textarea{width:100%;border:1px solid var(--border2);border-radius:15px;background:#fffaf4;padding:13px 14px;outline:none}.form-field input:focus,.form-field select:focus,.form-field textarea:focus{border-color:var(--accent);box-shadow:var(--ring)}.form-field textarea{min-height:155px;resize:vertical}.trust-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:20px}.trust-item{background:#fffaf4;border:1px solid var(--border);border-radius:18px;padding:15px;text-align:center}.trust-item b{display:block}.trust-item span{font-size:12px;color:var(--muted)}.success-box{display:none;border:1px solid #b7f0d1;background:#ecfdf5;color:#064e3b;border-radius:18px;padding:15px;margin-top:14px;font-weight:800}.breadcrumb{font-size:12px;color:var(--muted);margin-bottom:16px}.breadcrumb a{color:var(--accent);font-weight:800}.tool-shell{border-radius:34px}.drop{box-shadow:inset 0 0 0 1px rgba(255,255,255,.55)}.drop h3{font-size:24px}.result{border-radius:21px}.footer{background:linear-gradient(180deg,#fff,#fff8ed)}
@media(max-width:1100px){.tools-showcase{grid-template-columns:repeat(2,1fr)}.tool-hero,.contact-hero{grid-template-columns:1fr}.seo-strip,.feature-band{grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){body{font-size:14px}.nav-inner{height:66px}.brand{font-size:18px}.logo{width:35px;height:35px}.mobile-menu.open{display:grid;grid-template-columns:1fr 1fr;gap:3px;padding:10px 14px}.mobile-menu a{border-radius:12px;padding:10px 12px}.hero-panel,.tool-search-panel,.contact-card{border-radius:24px;padding:22px}.tool-hero{gap:16px}.tools-showcase,.seo-strip,.feature-band,.form-grid,.trust-row{grid-template-columns:1fr}.tool-card-pro{min-height:auto}.tool-card-pro .btn{width:100%}.contact-hero{gap:16px}.page-main{padding:30px 0 60px}.page-title h1,.hero-panel h1{font-size:36px}.section-head h2{font-size:32px}.cards{grid-template-columns:1fr}.controls{grid-template-columns:1fr}.summary{grid-template-columns:1fr 1fr}.result{display:grid;grid-template-columns:62px 1fr}.result .btn,.result .dl-btn{grid-column:1 / -1;width:100%;text-align:center}.footer-grid{grid-template-columns:1fr}.foot-bottom{display:block;text-align:center}.foot-bottom span{display:block;margin:6px 0}}
@media(max-width:420px){.container{padding:0 14px}.hero-panel h1,.page-title h1{font-size:32px}.summary{grid-template-columns:1fr}.tool-icon.big{width:56px;height:56px}.seo-chip{padding:12px}.btn{padding:12px 16px}.mobile-menu.open{grid-template-columns:1fr}}


/* ===== Final UX/UI + Blog SEO Upgrade ===== */
.nav-links{gap:8px}.nav-links a{padding:10px 15px}.nav-cta{background:linear-gradient(135deg,#111827,#ff9f1c);box-shadow:0 16px 34px rgba(17,24,39,.18)}
.hero,.page-main{position:relative}.hero:before,.page-main:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 12% 12%,rgba(255,159,28,.12),transparent 28%),radial-gradient(circle at 88% 8%,rgba(37,99,235,.07),transparent 26%)}
.hero>.container,.page-main>.container{position:relative;z-index:1}.cards .card,.tool-card-pro,.blog-card,.contact-card,.price-card{backdrop-filter:blur(10px)}
.card:hover,.blog-card:hover,.benefit-card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#f4bf82}.card,.blog-card,.benefit-card{transition:.2s ease}
.footer-badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.footer-badges span{font-size:11px;font-weight:800;border:1px solid var(--border);background:#fff7ea;border-radius:999px;padding:7px 10px;color:#6b4b1d}
.home-blog-band{background:linear-gradient(180deg,rgba(255,255,255,.45),rgba(255,247,234,.75));border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.blog-hero{display:grid;grid-template-columns:1.15fr .85fr;gap:26px;align-items:center;background:linear-gradient(135deg,#fff,#fff2db);border:1px solid var(--border);border-radius:34px;padding:36px;box-shadow:var(--shadow);margin-bottom:28px;overflow:hidden;position:relative}.blog-hero:after{content:"";position:absolute;width:260px;height:260px;border-radius:999px;background:radial-gradient(circle,rgba(255,159,28,.22),transparent 70%);right:-100px;top:-100px}.blog-hero>*{position:relative;z-index:1}.blog-hero h1{font-size:clamp(36px,5vw,64px);line-height:1;letter-spacing:-2.8px;margin-top:8px}.blog-hero p{color:var(--muted);font-size:16px;max-width:620px}.blog-hero-card{background:#111827;color:#fff;border-radius:26px;padding:28px;box-shadow:0 24px 70px rgba(17,24,39,.2)}.blog-hero-card b{font-family:'Syne';font-size:22px;display:block;margin-bottom:8px}.blog-hero-card span{color:rgba(255,255,255,.75)}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:26px}.blog-grid.compact{margin-top:0}.blog-card{background:#fff;border:1px solid var(--border);border-radius:28px;padding:24px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;min-height:245px}.blog-emoji{width:58px;height:58px;border-radius:21px;background:var(--accent-dark);display:grid;place-items:center;font-size:28px;margin-bottom:16px}.blog-kicker{font-size:11px;text-transform:uppercase;letter-spacing:1.4px;color:var(--accent);font-weight:900}.blog-card h3{font-size:22px;line-height:1.15;letter-spacing:-.7px;margin:9px 0}.blog-card p{color:var(--muted);font-size:13px}.read-more{margin-top:auto;color:#111827;font-weight:900;padding-top:16px}.article-wrap{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:28px;align-items:start}.article{background:#fff;border:1px solid var(--border);border-radius:32px;padding:36px;box-shadow:var(--shadow-sm)}.article h1{font-size:clamp(34px,5vw,58px);line-height:1;letter-spacing:-2px;margin:10px 0 16px}.article-lead{font-size:18px;color:var(--muted);line-height:1.75}.article h2{font-size:28px;letter-spacing:-1px;margin:32px 0 10px}.article p{color:var(--muted)}.article-callout{display:flex;gap:12px;align-items:flex-start;background:#fff8ea;border:1px solid #f0d7ae;border-radius:20px;padding:16px;margin:28px 0}.article-callout b{color:#7a4b00}.article-cta{background:linear-gradient(135deg,#111827,#2b3345);color:#fff;border-radius:26px;padding:28px;margin:34px 0}.article-cta p{color:rgba(255,255,255,.76);margin-bottom:18px}.article-sidebar{position:sticky;top:92px;display:grid;gap:16px}.sidebar-card{background:#fff;border:1px solid var(--border);border-radius:24px;padding:22px;box-shadow:var(--shadow-sm)}.sidebar-card h3{font-size:18px;margin-bottom:12px}.sidebar-card a{display:block;color:var(--muted);font-weight:800;border-top:1px solid var(--border);padding:10px 0}.sidebar-card a:hover{color:var(--accent)}
.benefit-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.benefit-card{background:#fff;border:1px solid var(--border);border-radius:26px;padding:24px;box-shadow:var(--shadow-sm)}.benefit-card b{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:16px;background:#111827;color:#fff;margin-bottom:16px}.benefit-card h3{font-size:22px}.benefit-card p{color:var(--muted);font-size:13px}.tools-benefit-row{padding-top:20px}
.contact-card form .btn,.contact-card .btn{width:100%}.contact-method{border-color:rgba(232,223,210,.8)}.form-field input,.form-field textarea,.form-field select{transition:.18s}.form-field input:hover,.form-field textarea:hover,.form-field select:hover{border-color:#f4bf82;background:#fff}
@media(max-width:1050px){.blog-hero,.article-wrap{grid-template-columns:1fr}.article-sidebar{position:static}.blog-grid,.benefit-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){.nav-links,.nav-cta{display:none}.blog-hero,.article{border-radius:24px;padding:22px}.blog-hero h1,.article h1{font-size:34px}.blog-grid,.benefit-grid{grid-template-columns:1fr}.blog-card{min-height:auto}.article h2{font-size:24px}.article-callout{display:block}.article-sidebar{display:none}.footer-badges{justify-content:flex-start}.tools-showcase{gap:14px}.tool-search-panel{padding:22px}.tool-card-pro{padding:21px}.mobile-menu.open{box-shadow:0 20px 40px rgba(17,24,39,.12)}}


/* ===== Premium Smooth UI + Blog Images + Admin Upgrade ===== */
:root{
  --cream:#fffaf3; --paper:#ffffff; --ink:#111827; --soft:#64748b;
  --brand:#5b5cf6; --brand2:#00b4d8; --brand3:#ff9f1c;
  --line:#e9edf5; --line2:#d7deea;
  --shadow:0 28px 80px rgba(15,23,42,.12); --shadow-sm:0 12px 32px rgba(15,23,42,.07);
  --ring:0 0 0 5px rgba(91,92,246,.12);
}
html{scroll-behavior:smooth}
body{background:radial-gradient(circle at 8% 4%,rgba(91,92,246,.12),transparent 27%),radial-gradient(circle at 92% 8%,rgba(0,180,216,.11),transparent 25%),linear-gradient(180deg,#ffffff 0%,#fbfcff 46%,#fff8ef 100%) !important;color:var(--ink);font-family:'Plus Jakarta Sans','DM Sans',system-ui,-apple-system,Segoe UI,Arial,sans-serif !important;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4,.brand,.btn,.stat-n,.price-amount,.summary b,.format b,.table th{font-family:'Sora','Syne','Plus Jakarta Sans',system-ui,sans-serif !important;letter-spacing:-.025em}.lead,p{font-weight:500}.nav{background:rgba(255,255,255,.78)!important;backdrop-filter:blur(22px) saturate(160%);box-shadow:0 1px 0 rgba(15,23,42,.04)}.logo{background:linear-gradient(135deg,var(--brand),var(--brand2))!important;color:#fff!important;box-shadow:0 18px 42px rgba(91,92,246,.26)!important}.brand span:not(.logo){color:var(--brand)!important}.nav-links a:hover,.nav-links a.active{background:#eef2ff!important;color:var(--brand)!important}.nav-cta,.btn.primary{background:linear-gradient(135deg,var(--brand),var(--brand2))!important;color:#fff!important;box-shadow:0 18px 42px rgba(91,92,246,.25)!important}.btn.secondary,.btn{border-color:var(--line)!important}.hero h1 em,.label{background:linear-gradient(135deg,var(--brand),var(--brand2));-webkit-background-clip:text;background-clip:text;color:transparent!important}.badge{border-color:var(--line)!important}.card,.tool-card-pro,.blog-card,.contact-card,.price-card,.article,.sidebar-card,.tool-shell,.step,.stat,.feature-box,.benefit-card{background:rgba(255,255,255,.88)!important;border-color:var(--line)!important;box-shadow:var(--shadow-sm)!important}.card:hover,.tool-card-pro:hover,.blog-card:hover,.benefit-card:hover{border-color:#c7d2fe!important;transform:translateY(-6px);box-shadow:var(--shadow)!important}.tool-icon,.blog-emoji{box-shadow:inset 0 1px 0 rgba(255,255,255,.5)}.yellow{background:#fff7e6!important;color:#c2410c!important}.blue{background:#eef2ff!important;color:var(--brand)!important}.green{background:#e9fbf5!important;color:#059669!important}.red{background:#fff1f2!important;color:#e11d48!important}.drop{background:linear-gradient(180deg,#fff,#f8fbff)!important;border-color:#c7d2fe!important}.drop:hover,.drop.over{background:#eef6ff!important;border-color:var(--brand)!important}.control,.form-field input,.form-field textarea,.form-field select,.control input[type=number],.control select,.control input[type=text],.control input[type=email],.control textarea{background:#fff!important;border-color:var(--line2)!important}.control input:focus,.form-field input:focus,.form-field textarea:focus,.form-field select:focus{border-color:var(--brand)!important;box-shadow:var(--ring)!important}.progress-bar{background:linear-gradient(90deg,var(--brand),var(--brand2))!important}.footer{background:linear-gradient(180deg,#fff,#f8fbff)!important}.mobile-menu.open{background:rgba(255,255,255,.96);backdrop-filter:blur(18px)}
.blog-card{overflow:hidden;padding:0!important;min-height:unset}.blog-card .blog-img,.blog-image{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;background:#eef2ff}.blog-card-body{padding:22px;display:flex;flex-direction:column;min-height:210px}.blog-card h3{font-size:21px}.blog-kicker{color:var(--brand)!important}.read-more{color:var(--brand)!important}.article-cover{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:24px;margin:18px 0 24px;box-shadow:var(--shadow-sm);border:1px solid var(--line)}.blog-hero-card{background:linear-gradient(135deg,#111827,#27324a)!important}.home-blog-band{background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(238,242,255,.7))!important}.admin-wrap{min-height:100vh;padding:42px 18px;background:linear-gradient(135deg,#f8fbff,#fff7ed);display:grid;place-items:start center}.admin-panel{width:min(1040px,100%);background:#fff;border:1px solid var(--line);border-radius:28px;box-shadow:var(--shadow);padding:28px}.admin-top{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-bottom:24px}.admin-top h1{font-size:34px}.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.admin-field{margin-bottom:14px}.admin-field label{display:block;font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--soft);margin-bottom:7px}.admin-field input,.admin-field textarea,.admin-field select{width:100%;border:1px solid var(--line2);border-radius:14px;padding:12px 14px;background:#fff;outline:none}.admin-field textarea{min-height:160px;resize:vertical}.admin-field input:focus,.admin-field textarea:focus{border-color:var(--brand);box-shadow:var(--ring)}.admin-actions{display:flex;gap:10px;flex-wrap:wrap}.admin-note{background:#eef2ff;border:1px solid #c7d2fe;color:#3730a3;border-radius:18px;padding:14px;font-size:13px;font-weight:700}.admin-table{width:100%;border-collapse:collapse;margin-top:18px}.admin-table th,.admin-table td{border-bottom:1px solid var(--line);padding:11px;text-align:left;font-size:13px}.admin-table th{color:var(--soft);text-transform:uppercase;font-size:11px;letter-spacing:.08em}.admin-login{width:min(430px,100%)}.alert{border-radius:14px;padding:12px 14px;margin:12px 0;font-weight:800}.alert.ok{background:#ecfdf5;color:#065f46;border:1px solid #bbf7d0}.alert.err{background:#fff1f2;color:#9f1239;border:1px solid #fecdd3}.post-list{display:grid;gap:10px}.post-row{display:flex;gap:12px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:16px}.post-row img{width:72px;height:48px;object-fit:cover;border-radius:12px;background:#eef2ff}.post-row b{display:block}.post-row span{font-size:12px;color:var(--soft)}
@media(max-width:900px){.admin-grid{grid-template-columns:1fr}.admin-top{align-items:flex-start;flex-direction:column}.blog-card-body{min-height:auto}}
@media(max-width:720px){body{font-size:15px}.container{padding:0 18px}.nav-inner{height:68px}.hero{min-height:auto;padding:58px 0}.hero h1{font-size:clamp(44px,13vw,62px)!important;letter-spacing:-2.4px}.lead{font-size:16px}.stats{grid-template-columns:1fr 1fr!important;gap:10px}.stat{padding:18px}.section{padding:54px 0}.section-head h2,.page-title h1{font-size:34px}.cards{gap:14px}.card{padding:22px}.tool-shell{padding:18px;border-radius:24px}.drop{padding:38px 16px}.controls{grid-template-columns:1fr!important}.actions{display:grid}.actions .btn,.btns .btn{width:100%}.result{grid-template-columns:56px 1fr!important;padding:12px}.thumb,.thumb-ph{width:56px;height:56px}.blog-grid{gap:14px}.blog-card-body{padding:18px}.contact-hero{gap:14px}.contact-card{padding:20px!important;border-radius:22px!important}.admin-panel{padding:18px;border-radius:22px}.admin-top h1{font-size:28px}}


/* ===== Speed + Smooth UX Final Polish ===== */
:root{--brand:#5b5cf6;--brand2:#00b4d8;--surface:#ffffff;--surface2:#f8fbff;--line:#e8edf7;--ink:#101828;--soft:#667085;}
html{scroll-behavior:smooth;text-size-adjust:100%;}
body{font-family:'DM Sans',system-ui,-apple-system,Segoe UI,Arial,sans-serif!important;background:radial-gradient(circle at 10% 0%,rgba(91,92,246,.10),transparent 28%),radial-gradient(circle at 92% 12%,rgba(0,180,216,.09),transparent 26%),linear-gradient(180deg,#fff 0%,#f8fbff 54%,#fff8ef 100%)!important;}
h1,h2,h3,h4,.brand,.btn,.stat-n,.price-amount,.summary b,.format b,.table th{font-family:'Syne','DM Sans',system-ui,sans-serif!important;letter-spacing:-.035em;}
*{ -webkit-tap-highlight-color: transparent; }
img{max-width:100%;height:auto;}
.card,.tool-card-pro,.blog-card,.contact-card,.price-card,.article,.sidebar-card,.tool-shell,.step,.stat,.feature-box,.benefit-card,.admin-panel{transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease;will-change:auto;}
.card:hover,.tool-card-pro:hover,.blog-card:hover,.benefit-card:hover{transform:translateY(-5px)!important;}
.nav{will-change:transform;contain:layout style;}
.hero,.section,.page-main{content-visibility:auto;contain-intrinsic-size:1px 800px;}
.hero{content-visibility:visible;}
.drop{transition:border-color .2s ease,background .2s ease,transform .2s ease;}
.drop:hover{transform:translateY(-2px);}
.btn:active{transform:translateY(0) scale(.99)!important;}
.tool-search-panel,.contact-hero,.blog-hero{background:linear-gradient(135deg,#fff,#f6f9ff 55%,#fff7ed)!important;border-color:var(--line)!important;}
.tools-showcase{align-items:stretch;}
.tool-card-pro{position:relative;overflow:hidden;}
.tool-card-pro:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at top right,rgba(91,92,246,.10),transparent 38%);opacity:0;transition:.22s;pointer-events:none;}
.tool-card-pro:hover:before{opacity:1;}
.blog-img,.article-cover{background:#eef2ff;}
@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}
@media(max-width:720px){.nav{position:sticky}.nav-inner{height:64px}.brand{font-size:18px}.logo{width:34px;height:34px;border-radius:12px}.mobile-menu.open{display:block}.hero,.section,.page-main{content-visibility:visible}.hero{padding:48px 0}.btns{display:grid;grid-template-columns:1fr;}.btn{width:100%;min-height:48px}.tools-showcase,.cards,.blog-grid,.contact-grid,.admin-grid{grid-template-columns:1fr!important}.tool-card-pro,.card,.contact-card,.blog-card{border-radius:22px!important}.footer-grid{gap:22px}.form-row{grid-template-columns:1fr!important}.admin-actions{width:100%}.admin-actions .btn{flex:1}}

/* ===== Blog Post Page Professional Repair ===== */
.blog-post-main{padding-top:34px;}
.post-breadcrumb{display:flex;align-items:center;gap:10px;color:var(--soft, #64748b);font-size:13px;font-weight:800;margin:0 0 18px;}
.post-breadcrumb a{color:var(--brand,#5b5cf6);}
.post-breadcrumb strong{color:var(--ink,#111827);}
.post-hero-clean{display:grid;grid-template-columns:1.02fr .98fr;gap:28px;align-items:center;background:linear-gradient(135deg,#ffffff 0%,#f6f9ff 54%,#fff7ec 100%);border:1px solid var(--line,#e8edf7);border-radius:36px;padding:34px;box-shadow:0 26px 80px rgba(15,23,42,.10);overflow:hidden;position:relative;margin-bottom:30px;}
.post-hero-clean:before{content:"";position:absolute;width:340px;height:340px;border-radius:50%;right:-150px;top:-160px;background:radial-gradient(circle,rgba(91,92,246,.18),transparent 68%);pointer-events:none;}
.post-hero-clean>*{position:relative;z-index:1;}
.post-hero-copy h1{font-size:clamp(38px,5vw,68px);line-height:.98;letter-spacing:-2.7px;margin:10px 0 16px;color:var(--ink,#111827);}
.post-hero-copy p{font-size:18px;line-height:1.75;color:var(--soft,#64748b);max-width:720px;}
.post-meta-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px;}
.post-meta-row span{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--line,#e8edf7);border-radius:999px;padding:8px 12px;color:#475467;font-size:12px;font-weight:900;box-shadow:0 8px 20px rgba(15,23,42,.05);}
.post-hero-image-wrap{background:#fff;border:1px solid var(--line,#e8edf7);border-radius:30px;padding:10px;box-shadow:0 18px 45px rgba(15,23,42,.10);}
.post-hero-image{width:100%;aspect-ratio:16/10;object-fit:cover;display:block;border-radius:22px;background:#eef2ff;}
.post-layout-pro{display:grid;grid-template-columns:190px minmax(0,1fr) 230px;gap:20px;align-items:start;}
.post-sidebar-pro{position:sticky;top:94px;display:grid;gap:14px;}
.post-mini-card{background:rgba(255,255,255,.92);border:1px solid var(--line,#e8edf7);border-radius:22px;padding:18px;box-shadow:0 12px 32px rgba(15,23,42,.07);}
.post-mini-card b{display:block;font-family:'Syne','DM Sans',sans-serif;font-size:16px;margin-bottom:12px;color:var(--ink,#111827);}
.post-mini-card a{display:block;padding:10px 0;border-top:1px solid var(--line,#e8edf7);font-weight:900;color:var(--soft,#64748b);font-size:13px;}
.post-mini-card a:hover{color:var(--brand,#5b5cf6);}
.share-row{display:flex;gap:8px;flex-wrap:wrap;}
.share-row a,.share-row button{width:38px;height:38px;border-radius:13px;border:1px solid var(--line,#e8edf7);background:#f8fbff;color:var(--brand,#5b5cf6);display:grid;place-items:center;font-weight:900;cursor:pointer;transition:.18s;}
.share-row a:hover,.share-row button:hover{background:var(--brand,#5b5cf6);color:#fff;transform:translateY(-2px);}
.post-article-pro{background:#fff;border:1px solid var(--line,#e8edf7);border-radius:30px;box-shadow:0 14px 44px rgba(15,23,42,.07);overflow:hidden;}
.article-body-pro{padding:40px 42px;}
.article-body-pro h2{font-size:clamp(26px,3vw,36px);line-height:1.14;letter-spacing:-1.1px;margin:36px 0 12px;color:var(--ink,#111827);}
.article-body-pro h3{font-size:24px;margin:30px 0 10px;color:var(--ink,#111827);}
.article-body-pro p{font-size:17px;line-height:1.9;color:#475467;margin:0 0 18px;}
.article-body-pro ul,.article-body-pro ol{padding-left:24px;margin:14px 0 22px;color:#475467;line-height:1.85;font-size:16px;}
.article-body-pro li{margin:7px 0;}
.article-body-pro a{color:var(--brand,#5b5cf6);font-weight:900;text-decoration:underline;text-underline-offset:3px;}
.article-body-pro blockquote{border-left:4px solid var(--brand,#5b5cf6);background:#f6f9ff;border-radius:16px;padding:18px 20px;margin:26px 0;color:#344054;font-weight:700;}
.article-body-pro img{border-radius:22px;border:1px solid var(--line,#e8edf7);box-shadow:0 12px 32px rgba(15,23,42,.08);margin:18px 0;}
.post-cta-pro{margin:0 22px 22px;background:linear-gradient(135deg,#111827,#27324a);border-radius:26px;padding:28px;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:20px;}
.post-cta-pro h2{font-size:30px;margin:5px 0 7px;color:#fff;}
.post-cta-pro p{color:rgba(255,255,255,.76);max-width:620px;}
.post-cta-pro .label{color:#9cc9ff!important;background:none!important;-webkit-text-fill-color:initial;}
.toc-card a:first-of-type{border-top:0;}
.related-posts-pro{margin:54px 0 10px;}
.post-empty{min-height:56vh;display:grid;place-items:center;text-align:center;background:#fff;border:1px solid var(--line,#e8edf7);border-radius:32px;padding:42px;box-shadow:0 14px 44px rgba(15,23,42,.07);}
.post-empty h1{font-size:clamp(36px,6vw,64px);line-height:1;margin:8px 0;}
.post-empty p{color:var(--soft,#64748b);margin-bottom:20px;}
@media(max-width:1180px){.post-layout-pro{grid-template-columns:minmax(0,1fr) 240px;}.post-sidebar-pro.left{display:none;}}
@media(max-width:980px){.post-hero-clean{grid-template-columns:1fr;padding:26px;border-radius:28px;}.post-layout-pro{grid-template-columns:1fr;}.post-sidebar-pro.right{position:static;grid-row:auto;}.toc-card{display:none;}.post-cta-pro{display:block}.post-cta-pro .btn{margin-top:18px;width:100%;}}
@media(max-width:720px){.blog-post-main{padding-top:20px}.post-breadcrumb{overflow:auto;white-space:nowrap;padding-bottom:4px}.post-hero-clean{padding:20px;border-radius:24px;gap:18px}.post-hero-copy h1{font-size:34px;letter-spacing:-1.6px}.post-hero-copy p{font-size:16px}.post-meta-row span{width:100%;justify-content:center}.post-hero-image-wrap{border-radius:22px;padding:7px}.post-hero-image{border-radius:16px}.article-body-pro{padding:26px 20px}.article-body-pro p{font-size:16px;line-height:1.82}.article-body-pro h2{font-size:25px}.post-article-pro{border-radius:24px}.post-cta-pro{margin:0 14px 14px;padding:22px;border-radius:22px}.post-cta-pro h2{font-size:25px}.related-posts-pro{margin-top:38px}.hide-mobile{display:none!important;}}

/* === Blog post layout fix: keep breadcrumb full width and article wide === */
.article-wrap{
  display:grid !important;
  grid-template-columns:minmax(0, 1fr) 320px !important;
  gap:28px !important;
  align-items:start !important;
}
.article-wrap > .breadcrumb{
  grid-column:1 / -1 !important;
  margin-bottom:0 !important;
}
.article{
  width:100% !important;
  max-width:none !important;
}
.article-cover{
  width:100% !important;
  max-height:360px !important;
  object-fit:cover !important;
  display:block !important;
  margin:22px 0 !important;
  border-radius:24px !important;
  border:1px solid var(--line, var(--border, #e8edf7)) !important;
  box-shadow:0 16px 44px rgba(15,23,42,.08) !important;
}
.article-sidebar{
  min-width:0 !important;
}
@media(max-width:1050px){
  .article-wrap{grid-template-columns:1fr !important;}
  .article-wrap > .breadcrumb{grid-column:auto !important;}
  .article-sidebar{position:static !important;}
}
@media(max-width:720px){
  .article{padding:22px !important;border-radius:24px !important;}
  .article h1{font-size:34px !important;letter-spacing:-1.4px !important;}
  .article-cover{max-height:260px !important;border-radius:18px !important;}
}


/* ===== ImageCrush Pro Page Polish V7 ===== */
:root{--pro-blue:#2563eb;--pro-cyan:#06b6d4;--pro-violet:#7c3aed;--pro-ink:#0f172a;--pro-soft:#64748b;--pro-line:#e6edf8;--pro-card:#ffffffcc;}
body{background:radial-gradient(circle at 8% 5%,rgba(37,99,235,.10),transparent 28%),radial-gradient(circle at 92% 8%,rgba(6,182,212,.12),transparent 27%),linear-gradient(180deg,#fff 0%,#f8fbff 45%,#fff7ed 100%)!important;}
.nav{box-shadow:0 10px 30px rgba(15,23,42,.05);}
.nav-inner{max-width:1240px;}
.logo{background:linear-gradient(135deg,var(--pro-blue),var(--pro-cyan))!important;color:#fff!important;}
.brand span:not(.logo){background:linear-gradient(135deg,var(--pro-blue),var(--pro-violet));-webkit-background-clip:text;background-clip:text;color:transparent!important;}
.nav-cta,.btn.primary,.btn-gradient{background:linear-gradient(135deg,var(--pro-blue),var(--pro-cyan))!important;color:#fff!important;border-color:transparent!important;box-shadow:0 16px 34px rgba(37,99,235,.22)!important;}
.hero{min-height:auto;padding:92px 0 70px!important;}
.hero:after{content:"";position:absolute;width:420px;height:420px;border-radius:50%;right:-130px;bottom:-160px;background:radial-gradient(circle,rgba(37,99,235,.13),transparent 70%);pointer-events:none;}
.hero .container{position:relative;z-index:2;}
.badge,.stat,.card,.tool-shell,.blog-card,.article,.article-sidebar .sidebar-card,.price-card,.contact-form-card,.contact-intro{backdrop-filter:blur(16px);}
.stats{margin-top:40px!important;}
.stat{border-color:var(--pro-line)!important;}
.section-head h2,.page-title h1{color:var(--pro-ink)!important;}
.page-title{position:relative;background:linear-gradient(135deg,#fff,#f6f9ff 60%,#fff7ed);border:1px solid var(--pro-line);border-radius:32px;padding:34px;margin-bottom:24px;box-shadow:0 20px 60px rgba(15,23,42,.07);overflow:hidden;}
.page-title:after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;right:-110px;top:-110px;background:radial-gradient(circle,rgba(37,99,235,.16),transparent 70%);}
.page-title>*{position:relative;z-index:1;}
.pro-benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:0 0 22px;}
.pro-benefit{background:rgba(255,255,255,.92);border:1px solid var(--pro-line);border-radius:20px;padding:16px 18px;box-shadow:0 12px 30px rgba(15,23,42,.05);display:flex;gap:12px;align-items:flex-start;}
.pro-benefit i{width:34px;height:34px;display:grid;place-items:center;border-radius:12px;background:#eef4ff;font-style:normal;flex:0 0 auto;}
.pro-benefit b{display:block;color:var(--pro-ink);font-size:14px;line-height:1.15;}
.pro-benefit span{display:block;color:var(--pro-soft);font-size:12px;margin-top:3px;line-height:1.45;}
.tool-shell{border-color:var(--pro-line)!important;background:linear-gradient(180deg,#ffffff,#fbfdff)!important;}
.notice{background:linear-gradient(135deg,#eff6ff,#fff7ed)!important;border:1px solid var(--pro-line)!important;color:#334155!important;border-radius:18px!important;padding:14px 16px!important;font-weight:800;}
.drop{background:linear-gradient(135deg,#f8fbff,#fff 52%,#fff7ed)!important;border-color:#bcd7ff!important;}
.drop:hover,.drop.over{border-color:var(--pro-blue)!important;background:#eff6ff!important;}
.controls{gap:16px!important;}
.control{background:#fbfdff!important;border-color:var(--pro-line)!important;}
.result{border-color:var(--pro-line)!important;}
.blog-hero{border-radius:36px!important;box-shadow:0 24px 70px rgba(15,23,42,.08)!important;}
.blog-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))!important;gap:22px!important;}
.blog-card{border-color:var(--pro-line)!important;border-radius:28px!important;overflow:hidden!important;background:#fff!important;box-shadow:0 16px 44px rgba(15,23,42,.07)!important;}
.blog-card:hover{transform:translateY(-7px)!important;box-shadow:0 26px 70px rgba(15,23,42,.12)!important;}
.blog-card-body{padding:22px!important;}
.blog-img{height:190px!important;object-fit:cover!important;width:100%!important;}
.blog-kicker{display:inline-flex!important;align-items:center!important;gap:6px!important;color:var(--pro-blue)!important;background:#eef4ff!important;border:1px solid #dbeafe!important;border-radius:999px!important;padding:7px 10px!important;font-size:11px!important;font-weight:900!important;letter-spacing:1px!important;text-transform:uppercase!important;}
.read-more{color:var(--pro-blue)!important;font-weight:900!important;}
.category-pills,.popular-searches{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:22px 0 42px;}
.category-pills a,.popular-searches a{background:#fff;border:1px solid var(--pro-line);color:#475569;border-radius:999px;padding:10px 14px;font-size:13px;font-weight:900;box-shadow:0 8px 20px rgba(15,23,42,.04);}
.category-pills a:hover,.popular-searches a:hover{background:var(--pro-blue);color:#fff;transform:translateY(-2px);}
.article-wrap{max-width:1240px!important;}
.article{background:#fff!important;border:1px solid var(--pro-line)!important;border-radius:32px!important;padding:38px!important;box-shadow:0 20px 60px rgba(15,23,42,.08)!important;}
.article h1{font-size:clamp(38px,5.2vw,72px)!important;line-height:.98!important;letter-spacing:-2.8px!important;color:var(--pro-ink)!important;margin:18px 0!important;max-width:900px;}
.article-lead{font-size:19px!important;line-height:1.85!important;color:#475569!important;background:#f8fbff;border:1px solid var(--pro-line);border-radius:22px;padding:20px;margin-top:20px!important;}
.article h2{font-size:clamp(26px,3vw,38px)!important;color:var(--pro-ink)!important;margin-top:38px!important;}
.article p{font-size:17px!important;line-height:1.9!important;color:#475569!important;}
.article-callout,.article-summary-box{border:1px solid #dbeafe!important;background:linear-gradient(135deg,#eff6ff,#ffffff)!important;border-radius:22px!important;padding:18px 20px!important;margin:24px 0!important;color:#334155!important;}
.article-summary-box h3{font-size:18px!important;margin:0 0 10px!important;color:var(--pro-ink)!important;}
.article-summary-box ul{display:grid;gap:8px;margin:0!important;padding-left:20px!important;color:#475569!important;}
.article-cta{background:linear-gradient(135deg,#0f172a,#1e3a8a)!important;color:#fff!important;border-radius:28px!important;padding:30px!important;margin:36px 0!important;}
.article-cta h2,.article-cta p{color:#fff!important;}
.sidebar-card{border-color:var(--pro-line)!important;border-radius:24px!important;box-shadow:0 14px 40px rgba(15,23,42,.06)!important;}
.sidebar-card h3{color:var(--pro-ink)!important;}
.sidebar-card a{border-radius:12px;padding:9px 10px!important;}
.sidebar-card a:hover{background:#eff6ff;color:var(--pro-blue)!important;}
.seo-tools-strip{padding-top:38px!important;}
.seo-strip-box{background:linear-gradient(135deg,#0f172a,#1e293b);border-radius:34px;padding:34px;color:#fff;box-shadow:0 28px 80px rgba(15,23,42,.18);display:grid;grid-template-columns:1.15fr .85fr;gap:24px;align-items:center;}
.seo-strip-box h2{font-size:clamp(30px,4vw,52px);line-height:1.04;margin:8px 0;color:#fff;}
.seo-strip-box p{color:rgba(255,255,255,.75);font-size:16px;}
.seo-strip-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;}
.seo-strip-item{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:16px;}
.seo-strip-item b{display:block;color:#fff;margin-bottom:4px;}
.seo-strip-item span{color:rgba(255,255,255,.68);font-size:13px;}
.footer{background:#0f172a!important;color:#fff!important;border-top:0!important;}
.footer a,.footer h4,.footer .brand{color:#fff!important;}.footer p,.foot-bottom,.footer-badges span{color:rgba(255,255,255,.68)!important;}.footer-badges span{background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.10)!important;}
@media(max-width:900px){.pro-benefits,.seo-strip-box{grid-template-columns:1fr!important}.article{padding:26px!important}.blog-img{height:170px!important}.seo-strip-grid{grid-template-columns:1fr!important}}
@media(max-width:640px){.page-title{padding:24px;border-radius:24px}.pro-benefits{gap:10px}.article h1{font-size:34px!important;letter-spacing:-1.5px!important}.article{padding:20px!important;border-radius:24px!important}.category-pills,.popular-searches{justify-content:flex-start;overflow:auto;flex-wrap:nowrap;padding-bottom:6px}.category-pills a,.popular-searches a{white-space:nowrap}.seo-strip-box{padding:24px;border-radius:26px}.stats{grid-template-columns:repeat(2,1fr)!important}.stat{padding:18px!important}}


/* === V6 Typography + Page Polish Upgrade === */
:root{
  --font-ui:'Inter', system-ui, -apple-system, Segoe UI, Arial, sans-serif;
  --font-display:'Space Grotesk','Inter',system-ui,sans-serif;
  --font-blog:'Literata', Georgia, 'Times New Roman', serif;
}
html{scroll-behavior:smooth;}
body{font-family:var(--font-ui)!important;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;}

/* Home page: modern SaaS/tool font */
body.home-page,
body.home-page p,
body.home-page .lead,
body.home-page .card p,
body.home-page .step p,
body.home-page .seo-strip-item span{
  font-family:var(--font-ui)!important;
}
body.home-page h1,
body.home-page h2,
body.home-page h3,
body.home-page .brand,
body.home-page .btn,
body.home-page .stat-n{
  font-family:var(--font-display)!important;
}
body.home-page .hero h1{
  font-weight:700!important;
  letter-spacing:-5.5px!important;
  line-height:.88!important;
}
body.home-page .lead{
  font-size:20px!important;
  line-height:1.75!important;
  font-weight:500!important;
  color:#526071!important;
}
body.home-page .hero{
  background:
    radial-gradient(circle at 8% 18%, rgba(99,102,241,.18), transparent 28%),
    radial-gradient(circle at 88% 15%, rgba(14,165,233,.18), transparent 26%),
    linear-gradient(180deg,#fbfdff 0%,#ffffff 45%,#f7f9ff 100%)!important;
}
body.home-page .badge{
  font-family:var(--font-ui)!important;
  letter-spacing:.02em;
  color:#3f4a5f!important;
}
body.home-page .card h3,
body.home-page .blog-card h3,
body.home-page .seo-strip-item b{
  font-family:var(--font-display)!important;
  letter-spacing:-.04em!important;
}
body.home-page .section-head h2,
body.home-page .page-title h1{
  font-family:var(--font-display)!important;
  letter-spacing:-.055em!important;
}

/* Blog pages: real blog/article reading font */
body.blog-page{
  font-family:var(--font-ui)!important;
  background:
    radial-gradient(circle at 4% 12%, rgba(255,122,26,.08), transparent 30%),
    radial-gradient(circle at 94% 10%, rgba(99,102,241,.10), transparent 30%),
    linear-gradient(180deg,#ffffff 0%,#f8fbff 100%)!important;
}
body.blog-page .blog-card h3,
body.blog-page .page-title h1,
body.blog-page .section-head h2,
body.blog-page .article h1,
body.blog-page .article h2,
body.blog-page .article h3,
body.blog-page .post-hero-copy h1,
body.blog-page .article-body-pro h2,
body.blog-page .article-body-pro h3{
  font-family:var(--font-blog)!important;
  letter-spacing:-.035em!important;
}
body.blog-page .blog-card p,
body.blog-page .page-title p,
body.blog-page .article p,
body.blog-page .article-lead,
body.blog-page .article-body-pro p,
body.blog-page .article-body-pro li,
body.blog-page .post-hero-copy p{
  font-family:var(--font-blog)!important;
  font-weight:400!important;
  color:#3f4b5f!important;
}
body.blog-page .article{
  max-width:900px!important;
  padding:46px!important;
  border-radius:34px!important;
  background:rgba(255,255,255,.96)!important;
}
body.blog-page .article h1{
  font-size:clamp(42px,5vw,68px)!important;
  line-height:1.02!important;
  color:#101828!important;
  margin-bottom:20px!important;
}
body.blog-page .article h2{
  font-size:clamp(28px,3vw,38px)!important;
  line-height:1.18!important;
  margin-top:42px!important;
  color:#111827!important;
}
body.blog-page .article p{
  font-size:19px!important;
  line-height:2.02!important;
  margin-bottom:20px!important;
}
body.blog-page .article-lead{
  font-size:21px!important;
  line-height:1.9!important;
  color:#475467!important;
}
body.blog-page .blog-kicker,
body.blog-page .breadcrumb,
body.blog-page .read-more,
body.blog-page .sidebar-card a,
body.blog-page .sidebar-card h3{
  font-family:var(--font-ui)!important;
}
body.blog-page .blog-kicker{
  letter-spacing:.16em!important;
  font-size:12px!important;
}
body.blog-page .article-cover{
  border-radius:28px!important;
  margin:24px 0 30px!important;
  box-shadow:0 24px 70px rgba(15,23,42,.10)!important;
}
body.blog-page .article-callout{
  background:linear-gradient(135deg,#f8fbff,#eef2ff)!important;
  border-color:#dbe4ff!important;
  border-radius:22px!important;
  font-family:var(--font-ui)!important;
}
body.blog-page .article-callout span,
body.blog-page .article-callout b{font-family:var(--font-ui)!important;}
body.blog-page .article-sidebar .sidebar-card{
  border-radius:26px!important;
  background:rgba(255,255,255,.9)!important;
}
body.blog-page .blog-card{
  border-radius:30px!important;
}
body.blog-page .blog-card h3{
  font-size:25px!important;
  line-height:1.22!important;
}
body.blog-page .blog-card p{
  font-size:16px!important;
  line-height:1.75!important;
}

/* Improve general pages without changing structure */
.nav-inner{max-width:1180px;}
.card,.blog-card,.tool-shell,.article,.sidebar-card,.price-card,.contact-card{backdrop-filter:saturate(130%) blur(8px);}
.page-main{padding-top:66px!important;}
.footer{border-top:1px solid rgba(226,232,240,.9)!important;}

@media(max-width:720px){
  body.home-page .hero h1{letter-spacing:-2.6px!important;line-height:.95!important;}
  body.home-page .lead{font-size:17px!important;line-height:1.65!important;}
  body.blog-page .article{padding:24px!important;border-radius:24px!important;}
  body.blog-page .article h1{font-size:36px!important;letter-spacing:-1.3px!important;}
  body.blog-page .article p{font-size:17px!important;line-height:1.85!important;}
  body.blog-page .article-lead{font-size:18px!important;line-height:1.78!important;}
}


/* ===== Final Blog Redesign V10 - clean magazine style ===== */
body.pro-blog-theme{font-family:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif!important;background:radial-gradient(circle at 10% 0%,rgba(37,99,235,.10),transparent 30%),radial-gradient(circle at 90% 0%,rgba(124,58,237,.10),transparent 28%),linear-gradient(180deg,#ffffff 0%,#f8fbff 45%,#fff 100%)!important;color:#101828!important;}
body:not(.blog-page) h1,body:not(.blog-page) h2,body:not(.blog-page) h3,.nav,.btn{font-family:'Space Grotesk','Inter',system-ui,sans-serif!important;}
.pro-blog-main{padding-bottom:70px;}
.pro-blog-hero{padding:72px 0 46px;}
.pro-blog-hero-grid{display:grid;grid-template-columns:minmax(0,1.08fr) 420px;gap:34px;align-items:center;}
.pro-eyebrow{display:inline-flex;align-items:center;gap:8px;margin-bottom:16px;padding:8px 12px;border-radius:999px;background:#eef4ff;color:#2563eb;font-size:12px;font-weight:900;letter-spacing:.11em;text-transform:uppercase;}
.pro-blog-hero h1{font-family:'Space Grotesk','Inter',sans-serif!important;font-size:clamp(44px,7vw,86px);line-height:.95;letter-spacing:-3.4px;margin:0 0 20px;color:#0f172a;max-width:820px;}
.pro-blog-hero p{font-size:19px;line-height:1.75;color:#667085;max-width:720px;margin:0;}
.pro-hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px;}
.pro-featured{background:rgba(255,255,255,.86);border:1px solid #e6edf8;border-radius:34px;padding:18px;box-shadow:0 24px 70px rgba(15,23,42,.10);backdrop-filter:blur(18px);}
.pro-featured span{display:inline-block;margin:6px 0 12px;color:#7c3aed;font-weight:900;font-size:12px;text-transform:uppercase;letter-spacing:.11em;}
.pro-featured img{width:100%;border-radius:24px;border:1px solid #e6edf8;background:#f8fbff;display:block;}
.pro-featured h2{font-family:'Space Grotesk','Inter',sans-serif!important;font-size:28px;line-height:1.08;letter-spacing:-1px;margin:18px 0 8px;color:#0f172a;}
.pro-featured p{font-size:15px;color:#667085;margin-bottom:14px;}
.pro-featured a{display:inline-flex;color:#2563eb;font-weight:900;}
.pro-blog-section{padding:28px 24px 54px;}
.pro-section-title{max-width:720px;margin-bottom:24px;}
.pro-section-title h2{font-family:'Space Grotesk','Inter',sans-serif!important;font-size:clamp(34px,4.6vw,58px);line-height:1;letter-spacing:-2.2px;margin:0 0 12px;color:#0f172a;}
.pro-section-title p{color:#667085;font-size:17px;}
.pro-blog-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;}
.pro-blog-card{display:flex;flex-direction:column;background:#fff;border:1px solid #e6edf8;border-radius:30px;overflow:hidden;box-shadow:0 16px 48px rgba(15,23,42,.07);transition:.22s ease;min-height:100%;}
.pro-blog-card:hover{transform:translateY(-8px);box-shadow:0 28px 80px rgba(15,23,42,.13);border-color:#c7d7fe;}
.pro-blog-img{height:188px;background:linear-gradient(135deg,#f8fbff,#eef4ff);display:grid;place-items:center;border-bottom:1px solid #e6edf8;}
.pro-blog-img img{width:100%;height:100%;object-fit:cover;display:block;}
.pro-blog-card-body{padding:22px;display:flex;flex-direction:column;gap:10px;flex:1;}
.pro-blog-card-body span{color:#2563eb;font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.08em;}
.pro-blog-card-body h3{font-family:'Space Grotesk','Inter',sans-serif!important;font-size:23px;line-height:1.12;letter-spacing:-.7px;color:#0f172a;margin:0;}
.pro-blog-card-body p{color:#667085;font-size:14.5px;line-height:1.65;margin:0;}
.pro-blog-card-body b{margin-top:auto;color:#0f172a;font-size:14px;}
.pro-topic-strip{display:flex;gap:10px;flex-wrap:wrap;background:#fff;border:1px solid #e6edf8;border-radius:28px;padding:16px;box-shadow:0 14px 40px rgba(15,23,42,.06);}
.pro-topic-strip a{border:1px solid #dbeafe;background:#f8fbff;color:#2563eb;font-weight:900;border-radius:999px;padding:10px 14px;font-size:13px;}

.pro-post-main{padding:38px 0 80px;}
.pro-breadcrumb{display:flex;gap:9px;align-items:center;color:#667085;font-size:13px;font-weight:800;margin:10px 0 22px;}
.pro-breadcrumb a{color:#2563eb;}.pro-breadcrumb b{color:#0f172a;}
.pro-post-hero{display:grid;grid-template-columns:minmax(0,1fr) 430px;gap:34px;align-items:center;background:linear-gradient(135deg,#fff,#f8fbff 62%,#f3f0ff);border:1px solid #e6edf8;border-radius:38px;padding:34px;box-shadow:0 24px 80px rgba(15,23,42,.09);}
.pro-post-hero h1{font-family:'Space Grotesk','Inter',sans-serif!important;font-size:clamp(42px,6vw,74px);line-height:.96;letter-spacing:-3px;color:#0f172a;margin:0 0 18px;}
.pro-post-hero p{font-size:18px;line-height:1.75;color:#667085;margin:0;max-width:760px;}
.pro-post-meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px;}
.pro-post-meta span{background:#fff;border:1px solid #e6edf8;border-radius:999px;padding:9px 12px;color:#344054;font-weight:800;font-size:13px;box-shadow:0 8px 22px rgba(15,23,42,.05);}
.pro-post-cover{background:#fff;border:1px solid #e6edf8;border-radius:30px;padding:10px;box-shadow:0 18px 50px rgba(15,23,42,.10);}
.pro-post-cover img{width:100%;aspect-ratio:16/11;object-fit:cover;border-radius:22px;display:block;background:#eef4ff;}
.pro-post-layout{display:grid;grid-template-columns:220px minmax(0,760px) 250px;gap:26px;align-items:start;margin-top:34px;}
.pro-toc,.pro-related{position:sticky;top:96px;display:grid;gap:16px;}
.pro-toc>div,.pro-related>div{background:#fff;border:1px solid #e6edf8;border-radius:24px;padding:18px;box-shadow:0 14px 38px rgba(15,23,42,.06);}
.pro-toc b,.pro-related b{display:block;font-family:'Space Grotesk','Inter',sans-serif!important;font-size:16px;margin-bottom:10px;color:#0f172a;}
.pro-toc a,.pro-related a{display:block;padding:10px 0;border-top:1px solid #edf2fb;color:#667085;font-weight:800;font-size:13px;line-height:1.45;}
.pro-toc a:hover,.pro-related a:hover{color:#2563eb;}
.pro-side-cta{background:linear-gradient(135deg,#0f172a,#27324a)!important;color:#fff!important;}
.pro-side-cta p{color:rgba(255,255,255,.74);font-size:13px;margin:6px 0 12px;line-height:1.5;}.pro-side-cta a{color:#93c5fd!important;border-top-color:rgba(255,255,255,.12)!important;}
.pro-article{background:#fff;border:1px solid #e6edf8;border-radius:30px;padding:44px 48px;box-shadow:0 16px 54px rgba(15,23,42,.07);}
.pro-article,.pro-article p,.pro-article li{font-family:'Literata',Georgia,serif!important;}
.pro-article .pro-lead{font-size:22px;line-height:1.75;color:#344054;margin-bottom:28px;}
.pro-article p{font-size:18px;line-height:1.95;color:#3f4a5a;margin:0 0 21px;}
.pro-article h2{font-family:'Space Grotesk','Inter',sans-serif!important;font-size:clamp(28px,3vw,38px);line-height:1.14;letter-spacing:-1.3px;color:#0f172a;margin:42px 0 12px;}
.pro-article h2:first-of-type{margin-top:24px;}
.pro-note{font-family:'Inter',system-ui,sans-serif!important;border-left:4px solid #2563eb;background:#f4f8ff;border-radius:18px;padding:18px 20px;color:#344054;font-size:15px;line-height:1.7;margin:28px 0;font-weight:600;}
.pro-note b{font-family:'Space Grotesk','Inter',sans-serif!important;color:#0f172a;}
.pro-article-cta{margin-top:44px;background:linear-gradient(135deg,#0f172a,#27324a);border-radius:26px;padding:30px;color:#fff;}
.pro-article-cta h2{color:#fff!important;margin:0 0 8px!important;font-size:30px;}.pro-article-cta p{color:rgba(255,255,255,.76)!important;font-family:'Inter',sans-serif!important;font-size:16px;line-height:1.65;}
.pro-post-theme .faq{margin-top:32px;}.pro-post-theme details{background:#f8fbff!important;border:1px solid #e6edf8!important;border-radius:18px!important;padding:16px 18px!important;margin:10px 0!important;}.pro-post-theme summary{font-family:'Space Grotesk','Inter',sans-serif!important;font-weight:900;color:#0f172a;cursor:pointer;}.pro-post-theme details p{font-family:'Inter',sans-serif!important;font-size:15px;line-height:1.7;margin-top:10px;color:#667085;}
@media(max-width:1180px){.pro-blog-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.pro-post-layout{grid-template-columns:minmax(0,1fr) 250px;}.pro-toc{display:none;}.pro-post-hero{grid-template-columns:1fr;}.pro-post-cover{max-width:620px;}}
@media(max-width:900px){.pro-blog-hero-grid{grid-template-columns:1fr;}.pro-post-layout{grid-template-columns:1fr;}.pro-related{position:static;}.pro-post-hero{padding:24px;border-radius:28px;}.pro-post-hero h1{letter-spacing:-2px}.pro-article{padding:32px 26px;}.pro-blog-hero{padding-top:44px;}}
@media(max-width:640px){.pro-blog-grid{grid-template-columns:1fr;}.pro-blog-hero h1{font-size:42px;letter-spacing:-1.8px;}.pro-blog-hero p{font-size:16px;}.pro-post-main{padding-top:20px;}.pro-post-hero h1{font-size:36px;}.pro-post-hero p{font-size:16px;}.pro-post-meta span{width:100%;text-align:center;justify-content:center;}.pro-article{border-radius:24px;padding:26px 20px;}.pro-article .pro-lead{font-size:19px;}.pro-article p{font-size:16.5px;line-height:1.85;}.pro-article h2{font-size:27px;}.pro-featured{border-radius:24px;}.pro-topic-strip{border-radius:20px;}.pro-topic-strip a{width:100%;text-align:center;}}

/* =========================================================
   SIMPLE CLEAN BLOG DESIGN FIX - final override
   Goal: consistent colors, readable text, simple cards
   ========================================================= */
:root{
  --clean-bg:#f6f8fb;
  --clean-card:#ffffff;
  --clean-text:#111827;
  --clean-heading:#0f172a;
  --clean-muted:#5f6b7a;
  --clean-line:#e5e7eb;
  --clean-brand:#2563eb;
  --clean-brand-dark:#1d4ed8;
  --clean-soft:#f3f6fb;
  --clean-shadow:0 10px 28px rgba(15,23,42,.07);
  --clean-shadow-hover:0 16px 36px rgba(15,23,42,.10);
}

body.pro-blog-theme{
  background:var(--clean-bg)!important;
  color:var(--clean-text)!important;
  font-family:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif!important;
}
body.pro-blog-theme .nav{
  background:rgba(255,255,255,.94)!important;
  border-bottom:1px solid var(--clean-line)!important;
  box-shadow:0 4px 18px rgba(15,23,42,.04)!important;
}
body.pro-blog-theme .nav-links a,
body.pro-blog-theme .mobile-menu a{
  color:#475569!important;
}
body.pro-blog-theme .nav-links a.active,
body.pro-blog-theme .mobile-menu a.active{
  color:var(--clean-brand)!important;
  background:#eef4ff!important;
  border-color:#dbeafe!important;
}

/* Blog listing page */
.pro-blog-main{padding-bottom:64px!important;}
.pro-blog-hero{padding:54px 0 34px!important;}
.pro-blog-hero-grid{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 360px!important;
  gap:28px!important;
  align-items:center!important;
  background:var(--clean-card)!important;
  border:1px solid var(--clean-line)!important;
  border-radius:28px!important;
  padding:38px!important;
  box-shadow:var(--clean-shadow)!important;
}
.pro-eyebrow{
  background:#eef4ff!important;
  color:var(--clean-brand)!important;
  border:1px solid #dbeafe!important;
  padding:7px 11px!important;
  font-size:11px!important;
  letter-spacing:.08em!important;
}
.pro-blog-hero h1{
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-size:clamp(40px,5.5vw,68px)!important;
  line-height:1.02!important;
  letter-spacing:-2.2px!important;
  color:var(--clean-heading)!important;
  margin:0 0 16px!important;
}
.pro-blog-hero p,
.pro-section-title p{
  color:var(--clean-muted)!important;
  font-size:17px!important;
  line-height:1.7!important;
}
.pro-featured{
  background:#ffffff!important;
  border:1px solid var(--clean-line)!important;
  border-radius:22px!important;
  padding:16px!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
.pro-featured span,
.pro-blog-card-body span{
  color:#64748b!important;
  background:transparent!important;
  border:0!important;
  padding:0!important;
  letter-spacing:.06em!important;
}
.pro-featured img{
  border-radius:16px!important;
  border:1px solid var(--clean-line)!important;
  background:#f8fafc!important;
}
.pro-featured h2{
  font-family:'Inter',system-ui,sans-serif!important;
  color:var(--clean-heading)!important;
  font-size:23px!important;
  line-height:1.2!important;
  letter-spacing:-.5px!important;
  margin:16px 0 8px!important;
}
.pro-featured p{color:var(--clean-muted)!important;font-size:14px!important;line-height:1.55!important;}
.pro-featured a{color:var(--clean-brand)!important;font-weight:800!important;}
.pro-blog-section{padding:34px 24px 46px!important;}
.pro-section-title{max-width:760px!important;margin-bottom:22px!important;}
.pro-section-title h2{
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-size:clamp(32px,4vw,48px)!important;
  line-height:1.08!important;
  letter-spacing:-1.5px!important;
  color:var(--clean-heading)!important;
}
.pro-blog-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:20px!important;
}
.pro-blog-card{
  background:var(--clean-card)!important;
  border:1px solid var(--clean-line)!important;
  border-radius:22px!important;
  box-shadow:var(--clean-shadow)!important;
  overflow:hidden!important;
  transform:none!important;
  transition:.18s ease!important;
}
.pro-blog-card:hover{
  transform:translateY(-3px)!important;
  box-shadow:var(--clean-shadow-hover)!important;
  border-color:#cbd5e1!important;
}
.pro-blog-img{
  height:160px!important;
  background:#f8fafc!important;
  border-bottom:1px solid var(--clean-line)!important;
}
.pro-blog-img img{object-fit:cover!important;}
.pro-blog-card-body{
  padding:18px!important;
  gap:8px!important;
  min-height:190px!important;
}
.pro-blog-card-body h3{
  font-family:'Inter',system-ui,sans-serif!important;
  color:var(--clean-heading)!important;
  font-size:19px!important;
  line-height:1.28!important;
  letter-spacing:-.3px!important;
  margin:0!important;
}
.pro-blog-card-body p{
  color:var(--clean-muted)!important;
  font-size:14px!important;
  line-height:1.6!important;
  margin:0!important;
}
.pro-blog-card-body b{
  color:var(--clean-brand)!important;
  font-size:14px!important;
  font-weight:800!important;
}
.pro-topic-strip{
  background:#fff!important;
  border:1px solid var(--clean-line)!important;
  border-radius:18px!important;
  padding:14px!important;
  box-shadow:var(--clean-shadow)!important;
}
.pro-topic-strip a{
  background:#f8fafc!important;
  border:1px solid var(--clean-line)!important;
  color:#334155!important;
  border-radius:999px!important;
  font-weight:700!important;
}
.pro-topic-strip a:hover{color:var(--clean-brand)!important;border-color:#bfdbfe!important;}

/* Blog post pages */
.pro-post-main{padding:34px 0 70px!important;}
.pro-breadcrumb{
  color:#64748b!important;
  margin:8px 0 18px!important;
}
.pro-breadcrumb a{color:var(--clean-brand)!important;}
.pro-breadcrumb b{color:var(--clean-heading)!important;}
.pro-post-hero{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 360px!important;
  gap:26px!important;
  align-items:center!important;
  background:#fff!important;
  border:1px solid var(--clean-line)!important;
  border-radius:28px!important;
  padding:34px!important;
  box-shadow:var(--clean-shadow)!important;
}
.pro-post-hero h1{
  font-family:'Space Grotesk','Inter',sans-serif!important;
  font-size:clamp(38px,5vw,64px)!important;
  line-height:1.04!important;
  letter-spacing:-2px!important;
  color:var(--clean-heading)!important;
  margin:0 0 14px!important;
}
.pro-post-hero p{
  color:var(--clean-muted)!important;
  font-size:17px!important;
  line-height:1.7!important;
}
.pro-post-meta{gap:8px!important;margin-top:20px!important;}
.pro-post-meta span{
  background:#f8fafc!important;
  border:1px solid var(--clean-line)!important;
  color:#334155!important;
  box-shadow:none!important;
  font-size:12.5px!important;
}
.pro-post-cover{
  background:#f8fafc!important;
  border:1px solid var(--clean-line)!important;
  border-radius:20px!important;
  padding:8px!important;
  box-shadow:none!important;
}
.pro-post-cover img{border-radius:14px!important;background:#f8fafc!important;}
.pro-post-layout{
  grid-template-columns:210px minmax(0,780px) 230px!important;
  gap:22px!important;
  margin-top:28px!important;
}
.pro-toc>div,.pro-related>div{
  background:#fff!important;
  border:1px solid var(--clean-line)!important;
  border-radius:18px!important;
  padding:16px!important;
  box-shadow:var(--clean-shadow)!important;
}
.pro-toc b,.pro-related b{
  font-family:'Inter',system-ui,sans-serif!important;
  color:var(--clean-heading)!important;
  font-size:15px!important;
}
.pro-toc a,.pro-related a{
  color:#475569!important;
  border-top:1px solid #eef2f7!important;
  font-size:13px!important;
  font-weight:700!important;
}
.pro-toc a:hover,.pro-related a:hover{color:var(--clean-brand)!important;}
.pro-side-cta{
  background:#f8fafc!important;
  color:var(--clean-heading)!important;
}
.pro-side-cta p{color:var(--clean-muted)!important;}
.pro-side-cta a{color:var(--clean-brand)!important;border-top-color:#eef2f7!important;}
.pro-article{
  background:#fff!important;
  border:1px solid var(--clean-line)!important;
  border-radius:24px!important;
  padding:42px 46px!important;
  box-shadow:var(--clean-shadow)!important;
}
.pro-article,.pro-article p,.pro-article li{
  font-family:'Literata',Georgia,serif!important;
}
.pro-article .pro-lead{
  color:#374151!important;
  font-size:21px!important;
  line-height:1.75!important;
}
.pro-article p{
  color:#374151!important;
  font-size:18px!important;
  line-height:1.9!important;
}
.pro-article h2{
  font-family:'Inter',system-ui,sans-serif!important;
  color:var(--clean-heading)!important;
  font-size:32px!important;
  line-height:1.22!important;
  letter-spacing:-.7px!important;
  margin:38px 0 12px!important;
}
.pro-note{
  background:#f8fafc!important;
  border:1px solid var(--clean-line)!important;
  border-left:4px solid var(--clean-brand)!important;
  color:#334155!important;
  border-radius:14px!important;
  font-family:'Inter',system-ui,sans-serif!important;
}
.pro-article-cta{
  background:#0f172a!important;
  border-radius:20px!important;
  padding:26px!important;
}
.pro-article-cta h2{font-family:'Inter',system-ui,sans-serif!important;color:#fff!important;}
.pro-article-cta p{font-family:'Inter',system-ui,sans-serif!important;color:#d1d5db!important;}
.pro-post-theme details{
  background:#fff!important;
  border:1px solid var(--clean-line)!important;
  border-radius:14px!important;
}
.pro-post-theme summary{
  font-family:'Inter',system-ui,sans-serif!important;
  color:var(--clean-heading)!important;
}
.pro-post-theme details p{
  font-family:'Inter',system-ui,sans-serif!important;
  color:var(--clean-muted)!important;
}

@media(max-width:1180px){
  .pro-blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .pro-blog-hero-grid,.pro-post-hero{grid-template-columns:1fr!important;}
  .pro-featured,.pro-post-cover{max-width:520px!important;}
  .pro-post-layout{grid-template-columns:minmax(0,1fr) 250px!important;}
  .pro-toc{display:none!important;}
}
@media(max-width:900px){
  .pro-blog-hero-grid{padding:28px!important;border-radius:24px!important;}
  .pro-post-layout{grid-template-columns:1fr!important;}
  .pro-related{position:static!important;}
  .pro-post-hero{padding:26px!important;border-radius:24px!important;}
  .pro-article{padding:32px 26px!important;}
}
@media(max-width:640px){
  .pro-blog-grid{grid-template-columns:1fr!important;}
  .pro-blog-hero{padding-top:24px!important;}
  .pro-blog-hero-grid{padding:22px!important;}
  .pro-blog-hero h1{font-size:38px!important;letter-spacing:-1.4px!important;}
  .pro-blog-hero p{font-size:15.5px!important;}
  .pro-blog-img{height:150px!important;}
  .pro-blog-card-body{min-height:auto!important;}
  .pro-post-main{padding-top:20px!important;}
  .pro-post-hero h1{font-size:34px!important;letter-spacing:-1.2px!important;}
  .pro-post-hero p{font-size:15.5px!important;}
  .pro-post-meta span{width:100%!important;text-align:center!important;}
  .pro-article{padding:26px 20px!important;border-radius:20px!important;}
  .pro-article .pro-lead{font-size:18px!important;}
  .pro-article p{font-size:16.5px!important;line-height:1.85!important;}
  .pro-article h2{font-size:26px!important;}
  .pro-topic-strip a{width:100%!important;text-align:center!important;}
}


/* Clean blog comment section */
.comment-section{
  margin-top:34px;
  padding-top:30px;
  border-top:1px solid #e5e7eb;
  font-family:'Inter',system-ui,sans-serif!important;
}
.comment-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  margin-bottom:18px;
}
.comment-label{
  display:inline-flex;
  align-items:center;
  font-size:12px;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#2563eb;
  margin-bottom:8px;
}
.comment-head h2{
  font-family:'Inter',system-ui,sans-serif!important;
  color:#0f172a!important;
  font-size:28px!important;
  line-height:1.2!important;
  letter-spacing:-.5px!important;
  margin:0 0 8px!important;
}
.comment-head p{
  font-family:'Inter',system-ui,sans-serif!important;
  color:#64748b!important;
  font-size:15px!important;
  line-height:1.7!important;
  margin:0!important;
  max-width:620px;
}
.comment-count{
  flex:0 0 auto;
  border:1px solid #e5e7eb;
  background:#f8fafc;
  color:#334155;
  border-radius:999px;
  padding:8px 12px;
  font-size:13px;
  font-weight:700;
}
.comment-form{
  background:#f8fafc;
  border:1px solid #e5e7eb;
  border-radius:20px;
  padding:20px;
}
.comment-form-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.comment-form label{
  display:block;
  color:#0f172a;
  font-size:13px;
  font-weight:800;
  margin-bottom:14px;
}
.comment-form input,.comment-form textarea{
  width:100%;
  margin-top:8px;
  border:1px solid #dbe3ef;
  border-radius:14px;
  background:#fff;
  color:#0f172a;
  font:500 15px/1.5 'Inter',system-ui,sans-serif;
  padding:12px 14px;
  outline:none;
  transition:border-color .2s ease, box-shadow .2s ease;
}
.comment-form textarea{resize:vertical;min-height:130px;}
.comment-form input:focus,.comment-form textarea:focus{
  border-color:#2563eb;
  box-shadow:0 0 0 4px rgba(37,99,235,.12);
}
.comment-actions{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
}
.comment-actions small{color:#64748b;font-size:13px;}
.comment-list{display:grid;gap:14px;margin-top:20px;}
.comment-item{
  border:1px solid #e5e7eb;
  background:#fff;
  border-radius:18px;
  padding:16px 18px;
}
.comment-item-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:8px;
}
.comment-author{
  display:flex;
  align-items:center;
  gap:10px;
  color:#0f172a;
  font-weight:800;
  font-size:15px;
}
.comment-avatar{
  width:34px;height:34px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  background:#eaf1ff;color:#2563eb;font-weight:900;
}
.comment-date{color:#94a3b8;font-size:12px;font-weight:700;}
.comment-item p{
  font-family:'Inter',system-ui,sans-serif!important;
  color:#475569!important;
  font-size:15px!important;
  line-height:1.7!important;
  margin:0!important;
}
.comment-empty{
  color:#64748b;
  background:#fff;
  border:1px dashed #cbd5e1;
  border-radius:16px;
  padding:16px;
  font-size:14px;
}
@media(max-width:640px){
  .comment-head{display:block;}
  .comment-count{display:inline-flex;margin-top:12px;}
  .comment-form-grid{grid-template-columns:1fr;gap:0;}
  .comment-form{padding:16px;border-radius:18px;}
  .comment-actions .btn{width:100%;justify-content:center;}
  .comment-item-head{align-items:flex-start;flex-direction:column;}
}