/* Tool page (pixel-to-inch-conversion) and homepage */
h1{font-family:var(--font-head);font-size:clamp(1.6rem,3.2vw,2.4rem);font-weight:800;line-height:1.2;color:var(--text);margin-bottom:1rem;letter-spacing:-.02em}
.theme-cyberpunk h1{color:var(--neon-green);text-shadow:0 0 20px rgba(0,255,204,0.4);letter-spacing:.04em}
/* Hero */
.hero{padding:4rem 0 3rem;background:var(--bg-alt);border-bottom:1px solid var(--border);position:relative;z-index:1}
.hero .container{display:flex;align-items:center;gap:3rem;flex-wrap:wrap}
.hero-content{flex:1;max-width:600px}
.hero-visual{flex:0 0 300px}
.hero-eyebrow{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--accent);background:var(--accent-soft);padding:.28rem .85rem;border-radius:50px;margin-bottom:1rem}
.theme-cyberpunk .hero-eyebrow{color:var(--neon-pink);background:rgba(255,0,170,0.1);border-radius:2px;text-shadow:0 0 8px var(--neon-pink)}
.hero-sub{font-size:1.05rem;color:var(--text-muted);margin-bottom:2rem;line-height:1.65}
.hero-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:1.75rem;box-shadow:var(--shadow)}
.theme-cyberpunk .hero-card{border-color:rgba(0,255,204,0.2);box-shadow:0 0 30px rgba(0,255,204,0.1)}
.hero-card-row{display:flex;align-items:center;justify-content:space-between;padding:.6rem 0;border-bottom:1px solid var(--border);gap:.5rem}
.hero-card-row:last-of-type{border-bottom:none}
.hc-label{font-family:var(--font-mono);font-size:.95rem;color:var(--text-muted)}
.hc-arrow{color:var(--accent);font-weight:700;font-size:1.1rem}
.theme-cyberpunk .hc-arrow{color:var(--neon-pink);text-shadow:0 0 6px var(--neon-pink)}
.hc-val{font-family:var(--font-mono);font-size:1rem;color:var(--text);font-weight:700}
.theme-cyberpunk .hc-val{color:var(--neon-green)}
.hc-dpi{margin-top:.75rem;font-size:.75rem;font-family:var(--font-mono);color:var(--text-muted);text-align:right}
/* Tool section */
.tool-section{padding:3.5rem 0;position:relative;z-index:1}
.tool-container{display:grid;grid-template-columns:200px 1fr 200px;gap:2rem;align-items:start}
.ad-sidebar,.ad-sidebar-right{position:sticky;top:90px}
.tool-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:2rem;box-shadow:var(--shadow)}
.theme-cyberpunk .tool-card{border-color:rgba(0,255,204,0.15);box-shadow:0 0 30px rgba(0,255,204,0.06)}
.tool-card-centered{max-width:640px;margin:0 auto}
.tool-title{font-family:var(--font-head);font-size:1.4rem;font-weight:800;color:var(--text);margin-bottom:1.5rem;letter-spacing:-.01em}
.theme-cyberpunk .tool-title{color:var(--neon-green);text-shadow:0 0 10px rgba(0,255,204,0.3)}
/* Tabs */
.tool-tabs{display:flex;gap:.5rem;background:var(--bg-alt);border-radius:calc(var(--radius) - 2px);padding:.3rem;margin-bottom:1.5rem}
.tab-btn{flex:1;padding:.6rem .85rem;border-radius:calc(var(--radius) - 4px);font-size:.875rem;font-weight:600;color:var(--text-muted);transition:all var(--transition);text-align:center;font-family:inherit;background:var(--bg);border:1px solid var(--border);cursor:pointer}
.tab-btn.active{background:var(--accent-btn,var(--accent));color:#fff;border-color:var(--accent-btn,var(--accent));box-shadow:0 2px 8px rgba(74,92,240,0.4)}
.tab-btn:not(.active):hover{background:var(--accent-soft);color:var(--accent);border-color:var(--accent)}
.theme-light .tab-btn{background:#e8e7e3;border-color:#d0ceca;color:#5a5e70}
.theme-light .tab-btn.active{background:var(--accent-btn,var(--accent));color:#fff;border-color:var(--accent-btn,var(--accent))}
.theme-dark .tab-btn{background:rgba(255,255,255,0.05);border-color:rgba(255,255,255,0.1);color:#c8cdde}
.theme-dark .tab-btn.active{background:var(--accent-btn,var(--accent));color:#fff;border-color:var(--accent-btn,var(--accent));box-shadow:0 2px 12px rgba(74,92,240,0.5)}
.theme-cyberpunk .tab-btn{background:rgba(0,255,204,0.04);border-color:rgba(0,255,204,0.15);color:rgba(0,255,204,0.55);font-family:var(--font-mono);font-size:.8rem;letter-spacing:.05em}
.theme-cyberpunk .tab-btn.active{background:var(--neon-green);color:#000;border-color:var(--neon-green);box-shadow:0 0 16px rgba(0,255,204,0.5)}
.theme-cyberpunk .tab-btn:not(.active):hover{background:rgba(0,255,204,0.1);color:var(--neon-green);border-color:rgba(0,255,204,0.35)}
/* Fields */
.dpi-row{margin-bottom:1.25rem;display:flex;flex-direction:column;gap:.5rem}
.custom-dpi-row{margin-top:.5rem}
.field-group{margin-bottom:1.25rem}
.field-label{display:block;font-size:.82rem;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:.45rem}
.theme-cyberpunk .field-label{font-family:var(--font-mono);color:var(--neon-green);letter-spacing:.12em}
/* Result box */
.result-box{background:var(--bg-alt);border:1px solid var(--border);border-radius:calc(var(--radius) - 2px);padding:1rem 1.25rem;margin-bottom:1.25rem;display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;min-height:70px;transition:border-color var(--transition),background var(--transition)}
.result-label{font-size:.78rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;width:100%}
.result-value{font-family:var(--font-mono);font-size:2rem;font-weight:700;color:var(--text-light);transition:color var(--transition);line-height:1}
.result-value.has-value{color:var(--accent)}
.theme-cyberpunk .result-value.has-value{color:var(--neon-green);text-shadow:0 0 10px rgba(0,255,204,0.4)}
.result-unit{font-size:.9rem;color:var(--text-muted);font-family:var(--font-mono)}
.tool-actions{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1.25rem}
.tool-note{font-size:.82rem;color:var(--text-muted);font-style:italic;padding-top:.75rem;border-top:1px solid var(--border)}
/* Content sections (SEO blocks below tool) */
.content-section{padding:3.5rem 0 4rem;position:relative;z-index:1}
.content-container{max-width:900px}
.content-container.narrow{max-width:740px}
.content-block{margin-bottom:2.5rem}
.content-block:last-child{margin-bottom:0}
.content-block h2{font-family:'DM Sans',system-ui,sans-serif;font-size:clamp(1.3rem,2.5vw,1.75rem);font-weight:800;color:var(--text);margin-bottom:1rem;letter-spacing:-.01em;text-align:left;line-height:1.5;overflow:visible}
.theme-cyberpunk .content-block h2{color:var(--neon-green)}
.content-block h3{font-family:'DM Sans',system-ui,sans-serif;font-size:1.05rem;font-weight:700;color:var(--text);margin:1.25rem 0 .6rem;text-align:left;line-height:1.5;overflow:visible}
.theme-cyberpunk .content-block h3{color:var(--neon-green);opacity:.85}
.content-block p{color:var(--text-muted);margin-bottom:1rem;font-size:.97rem;line-height:1.75;text-align:justify;hyphens:auto;-webkit-hyphens:auto}
.content-block p:last-child{margin-bottom:0}
.content-block p a{color:var(--accent)}
.content-block p a:hover{text-decoration:underline}
.content-block li{font-size:.95rem;color:var(--text-muted);line-height:1.6}
.content-list{list-style:disc;margin:.75rem 0 1rem 1.5rem;display:flex;flex-direction:column;gap:.45rem}
.content-list li strong{color:var(--text)}
.steps-list{list-style:decimal;margin:.75rem 0 1rem 1.5rem;display:flex;flex-direction:column;gap:.6rem}
.steps-list li{font-size:.95rem;color:var(--text-muted);line-height:1.65}
.steps-list li strong{color:var(--text)}
.formula-box{background:var(--bg-card);border:1px solid var(--border-strong);border-radius:var(--radius);padding:1.25rem 1.75rem;margin:1.25rem 0;text-align:center}
.formula-text{font-family:var(--font-mono);font-size:1.3rem;font-weight:700;color:var(--accent)}
.theme-cyberpunk .formula-text{color:var(--neon-green);text-shadow:0 0 10px rgba(0,255,204,0.4)}
.example-grid,.usecase-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem;margin:1.25rem 0}
.example-card,.usecase-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem}
.theme-cyberpunk .example-card{border-color:rgba(0,255,204,0.1)}
.ex-title{font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin-bottom:.5rem}
.ex-calc{font-family:var(--font-mono);font-size:.875rem;color:var(--text-muted);margin-bottom:.35rem}
.ex-result{font-family:var(--font-mono);font-size:1rem;font-weight:700;color:var(--accent)}
.theme-cyberpunk .ex-result{color:var(--neon-green)}
.usecase-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-hover)}
.theme-cyberpunk .usecase-card{border-color:rgba(255,0,170,0.15)}
.uc-icon{font-size:1.75rem;margin-bottom:.6rem}
.usecase-card h3{font-family:var(--font-head);font-size:.95rem;font-weight:700;color:var(--text);margin:0 0 .4rem}
.theme-cyberpunk .usecase-card h3{color:var(--neon-pink)}
.usecase-card p{font-size:.82rem;color:var(--text-muted);margin:0;line-height:1.55}
/* FAQ */
.faq-section{padding:0;border:none}
.faq-list{display:flex;flex-direction:column;gap:.5rem;margin-top:1.25rem}
.faq-item{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;transition:border-color var(--transition)}
.faq-item[open]{border-color:var(--accent)}
.theme-cyberpunk .faq-item{border-color:rgba(0,255,204,0.1)}
.theme-cyberpunk .faq-item[open]{border-color:var(--neon-green)}
.faq-q{padding:1rem 1.25rem;font-size:.95rem;font-weight:600;color:var(--text);cursor:pointer;user-select:none;list-style:none;display:flex;justify-content:space-between;align-items:center}
.faq-q::-webkit-details-marker{display:none}
.faq-q::after{content:'+';font-size:1.2rem;color:var(--accent);flex-shrink:0;transition:transform .2s}
.faq-item[open] .faq-q::after{transform:rotate(45deg)}
.theme-cyberpunk .faq-q{font-family:var(--font-mono);font-size:.88rem;letter-spacing:.03em}
.theme-cyberpunk .faq-q::after{color:var(--neon-green)}
.faq-a{padding:0 1.25rem 1rem;font-size:.9rem;color:var(--text-muted);line-height:1.7}
.faq-a p{margin:0}
.faq-a a{color:var(--accent)}
.theme-cyberpunk .content-block p,.theme-cyberpunk .content-block li{color:#8ecfb0!important}
.theme-cyberpunk .content-block h2,.theme-cyberpunk .content-block h3,.theme-cyberpunk .content-block h4{color:#00ffcc!important}
.theme-cyberpunk .content-block a{color:#00ffcc}
.theme-dark .content-block p,.theme-dark .content-block li{color:var(--text-muted)}
/* Conversion tables */
.common-conversions-section{padding:3rem 0 2.5rem}
.common-conv-main-title{text-align:center;font-size:1.6rem;font-weight:700;margin-bottom:2rem;color:var(--text)}
.common-conv-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem;align-items:start}
.conv-table-card-wide{grid-column:1 / -1}
.conv-table-card{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;overflow:hidden;transition:box-shadow var(--transition),border-color var(--transition)}
.conv-table-card:hover{box-shadow:0 6px 24px rgba(0,0,0,0.12);border-color:var(--border-strong)}
.theme-cyberpunk .conv-table-card:hover{border-color:rgba(0,255,204,0.35);box-shadow:0 6px 24px rgba(0,255,204,0.08)}
.conv-table-header{display:flex;align-items:center;gap:.85rem;padding:1rem 1.25rem;border-bottom:1px solid var(--border)}
.conv-header-screen{background:rgba(59,130,246,0.07)}
.conv-header-print{background:rgba(16,185,129,0.07)}
.conv-header-sizes{background:rgba(139,92,246,0.07)}
.theme-cyberpunk .conv-header-screen{background:rgba(0,200,255,0.06)}
.theme-cyberpunk .conv-header-print{background:rgba(0,255,204,0.06)}
.theme-cyberpunk .conv-header-sizes{background:rgba(180,100,255,0.06)}
.conv-table-icon{font-size:1.4rem;line-height:1;flex-shrink:0}
.conv-table-title{font-size:.95rem;font-weight:700;color:var(--text);margin:0 0 .15rem}
.conv-table-subtitle{font-size:.78rem;color:var(--text-muted);margin:0}
.conv-table{width:100%;border-collapse:collapse;font-size:.875rem}
.conv-table thead tr{background:var(--bg-alt)}
.theme-light .conv-table thead tr{background:rgba(0,0,0,0.04)}
.theme-dark .conv-table thead tr{background:rgba(255,255,255,0.04)}
.theme-cyberpunk .conv-table thead tr{background:rgba(0,255,204,0.04)}
.conv-table th{padding:.6rem 1.25rem;text-align:left;font-weight:600;font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted)}
.conv-table td{padding:.6rem 1.25rem;color:var(--text);border-top:1px solid var(--border);font-variant-numeric:tabular-nums}
.conv-table tbody tr:hover{background:rgba(59,130,246,0.04)}
.theme-cyberpunk .conv-table tbody tr:hover{background:rgba(0,255,204,0.04)}
.conv-table td:last-child,.conv-table th:last-child{text-align:right;font-weight:600;color:var(--accent)}
.theme-cyberpunk .conv-table td:last-child{color:var(--neon-green)}
/* Homepage */
.home-hero{padding:4rem 0 3.5rem;background:var(--bg-alt);border-bottom:1px solid var(--border);position:relative;z-index:1}
.home-hero .container{display:flex;align-items:center;gap:3rem}
.home-hero-content{flex:1;max-width:620px}
.home-hero-visual{flex:0 0 340px}
.home-hero h1{font-family:var(--font-head);font-size:clamp(1.6rem,3.2vw,2.4rem);font-weight:800;line-height:1.2;color:var(--text);margin-bottom:1.25rem;letter-spacing:-.02em}
.theme-cyberpunk .home-hero h1{color:var(--neon-green);text-shadow:0 0 20px rgba(0,255,204,0.45);letter-spacing:.04em}
.hero-stats-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:0}
.theme-cyberpunk .hero-stats-card{border-color:rgba(0,255,204,0.25);box-shadow:0 0 30px rgba(0,255,204,0.08)}
.stat-row{display:flex;align-items:center;gap:1rem;padding:.85rem 0;border-bottom:1px solid var(--border)}
.stat-row:last-child{border-bottom:none}
.stat-icon{font-size:1.5rem;width:40px;text-align:center;flex-shrink:0}
.stat-info strong{display:block;font-size:1.1rem;font-weight:800;font-family:var(--font-head);color:var(--accent);line-height:1}
.theme-cyberpunk .stat-info strong{color:var(--neon-green);text-shadow:0 0 8px var(--neon-green)}
.stat-info span{font-size:.78rem;color:var(--text-muted)}
.section-eyebrow{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--accent);background:var(--accent-soft);padding:.28rem .85rem;border-radius:50px;margin-bottom:.85rem}
.theme-cyberpunk .section-eyebrow{color:var(--neon-pink);background:rgba(255,0,170,0.1);border-radius:2px;text-shadow:0 0 8px var(--neon-pink)}
.section-heading{font-family:'DM Sans',system-ui,sans-serif;font-size:clamp(1.4rem,2.8vw,2rem);font-weight:800;color:var(--text);margin-bottom:.75rem;letter-spacing:-.01em;line-height:1.5;overflow:visible}
.theme-cyberpunk .section-heading{color:var(--neon-green);text-shadow:0 0 12px rgba(0,255,204,0.3)}
.section-sub{font-size:1rem;color:var(--text-muted);max-width:520px;margin:0 auto}
.section-header-block{text-align:center;margin-bottom:2.5rem}
.section-header-block,.section-header-block .section-heading,.section-header-block .section-eyebrow,.section-header-block .section-sub{text-align:center}
.tools-section{padding:4rem 0;position:relative;z-index:1}
.tools-grid-home{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.25rem}
.tool-card-home{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;display:flex;flex-direction:column;gap:.85rem;transition:transform .2s,box-shadow .2s,border-color .2s;text-decoration:none;color:inherit}
.tool-card-home:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover);border-color:var(--accent)}
.theme-cyberpunk .tool-card-home{border-color:rgba(0,255,204,0.15)}
.theme-cyberpunk .tool-card-home:hover{border-color:var(--neon-green);box-shadow:0 0 30px rgba(0,255,204,0.18)}
.tool-card-icon-wrap{width:52px;height:52px;background:var(--accent-soft);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.6rem;flex-shrink:0}
.theme-cyberpunk .tool-card-icon-wrap{background:rgba(0,255,204,0.08);border-radius:4px}
.tool-card-body-home h3{font-family:'DM Sans',system-ui,sans-serif;font-size:1.05rem;font-weight:700;color:var(--text);margin-bottom:.35rem;line-height:1.5;overflow:visible}
.theme-cyberpunk .tool-card-body-home h3{color:var(--neon-green)}
.tool-card-body-home p{font-size:.85rem;color:var(--text-muted);margin:0;line-height:1.55}
.theme-cyberpunk .tool-card-body-home p{color:#8ecfb0}
.tool-card-footer-home{display:flex;align-items:center;justify-content:space-between;padding-top:.75rem;border-top:1px solid var(--border);font-size:.78rem;margin-top:auto}
.tool-badge-live{background:var(--accent);color:#fff;padding:.2rem .65rem;border-radius:50px;font-weight:700;font-size:.7rem;text-transform:uppercase;letter-spacing:.06em}
.theme-cyberpunk .tool-badge-live{background:rgba(0,255,204,0.1);color:var(--neon-green);border-radius:2px}
.tool-badge-soon{background:var(--border);color:var(--text-muted);padding:.2rem .65rem;border-radius:50px;font-weight:700;font-size:.7rem;text-transform:uppercase;letter-spacing:.06em}
.tool-cta-arrow{color:var(--accent);font-weight:700;font-size:.85rem;display:flex;align-items:center;gap:.2rem;transition:gap .15s}
.tool-card-home:hover .tool-cta-arrow{gap:.45rem}
.theme-cyberpunk .tool-cta-arrow{color:var(--neon-green)}
.why-section{padding:4rem 0;position:relative;z-index:1}
.why-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-top:1.5rem}
.why-item{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;transition:transform .2s,box-shadow .2s}
.why-item:hover{transform:translateY(-2px);box-shadow:var(--shadow-hover)}
.theme-cyberpunk .why-item{border-color:rgba(255,0,170,0.2)}
.why-item-icon{font-size:2rem;margin-bottom:.75rem;display:block}
.why-item h3{font-family:var(--font-head);font-size:1rem;font-weight:700;margin:0 0 .5rem;color:var(--text)}
.theme-cyberpunk .why-item h3{color:var(--neon-green)}
.why-item p{font-size:.875rem;color:var(--text-muted);margin:0;line-height:1.6}
.content-section p{text-align:justify}
/* Responsive */
@media(max-width:1100px){.tool-container{grid-template-columns:1fr}.ad-sidebar,.ad-sidebar-right{display:none}}
@media(max-width:900px){.hero .container,.home-hero .container{flex-direction:column}.hero-visual,.home-hero-visual{width:100%;max-width:400px}.hero-content,.home-hero-content{max-width:100%}}
@media(max-width:768px){.common-conv-grid{grid-template-columns:1fr}.conv-table-card-wide{grid-column:auto}.common-conv-main-title{font-size:1.3rem}}
@media(max-width:600px){.hero,.home-hero{padding:2.5rem 0 2rem}.tools-grid-home{grid-template-columns:1fr}.why-grid{grid-template-columns:1fr}.example-grid,.usecase-grid{grid-template-columns:1fr 1fr}.tool-actions{flex-direction:column}.action-btn{width:100%;text-align:center}}
@media(max-width:480px){.conv-table th,.conv-table td{padding:.5rem .9rem;font-size:.825rem}.conv-table-header{padding:.85rem 1rem}}
@media(max-width:400px){.example-grid,.usecase-grid{grid-template-columns:1fr}}
