:root {
--primary: #5850ec;
--secondary: #06B6D4;
--background: #fdfdfd;
--surface: #FFFFFF;
--text-main: #111827;
--text-muted: #6B7280;
--border: #f3f4f6;
--radius: 16px;
--shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.03), 0 2px 4px -1px rgba(0, 0, 0, 0.03);
}
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
body {
font-family: 'Inter', sans-serif;
background-color: var(--background);
color: var(--text-main);
line-height: 1.6;
display: flex;
flex-direction: column;
min-height: 100vh;
}
h1, h2, h3, h4, .logo a {
font-family: 'Poppins', sans-serif;
}
.text-center { text-align: center; }
.text-left { text-align: left; }
.mt-4 { margin-top: 2rem; }
.main-header {
background: var(--surface);
border-bottom: 1px solid var(--border);
padding: 1.2rem 0;
}
.header-container {
max-width: 1300px;
margin: 0 auto;
padding: 0 1.5rem;
display: flex;
justify-content: space-between;
align-items: center;
}
.logo a {
color: var(--text-main);
text-decoration: none;
font-size: 1.4rem;
font-weight: 700;
}
.top-nav {
display: flex;
align-items: center;
flex: 1;
justify-content: flex-end;
}
.top-nav ul {
list-style: none;
display: flex;
gap: 1.5rem;
}
.top-nav li a {
color: var(--text-main);
text-decoration: none;
font-weight: 600;
font-size: 0.95rem;
display: flex;
align-items: center;
gap: 0.4rem;
}
.top-nav li a:hover {
color: var(--primary);
}
.search-container {
position: relative;
width: 320px;
display: flex;
align-items: center;
margin-right: 2rem;
}
.search-input {
width: 100%;
height: 42px;
padding: 0 1rem 0 3rem;
border-radius: 50px;
border: 1.5px solid #e2e8f0;
background: #f8fafc;
font-size: 0.95rem;
font-family: inherit;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
outline: none;
box-shadow: inset 0 1px 2px rgba(0,0,0,0.02);
}
.search-input:focus {
border-color: #5850ec;
background: white;
box-shadow: 0 0 0 4px rgba(88,80,236,0.1), 0 4px 12px rgba(88,80,236,0.05);
}
.search-container i {
position: absolute;
left: 12px;
color: #64748b;
font-size: 1rem;
pointer-events: none;
z-index: 10;
}
.content-container {
max-width: 1300px;
margin: 0 auto;
padding: 2rem 1.5rem;
flex: 1;
width: 100%;
}
.hero {
padding: 3rem 1rem;
margin-bottom: 0;
}
.hero-badge {
display: inline-block;
background: #eff6ff;
color: var(--primary);
padding: 0.4rem 1rem;
border-radius: 99px;
font-size: 0.8rem;
font-weight: 600;
letter-spacing: 0.5px;
margin-bottom: 1.5rem;
}
.gradient-text {
font-size: 3.5rem;
font-weight: 900;
color: var(--text-main);
margin-bottom: 1rem;
letter-spacing: -1px;
}
.gradient-text {
background: linear-gradient(90deg, #111827, #4F46E5, #b435df);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.hero p {
color: var(--text-muted);
font-size: 1.05rem;
max-width: 550px;
margin: 0 auto;
}
.badge-tag {
display: inline-flex;
align-items: center;
background: #f5f3ff;
color: #7c3aed;
padding: 0.3rem 1rem;
border-radius: 99px;
font-size: 0.82rem;
font-weight: 700;
margin-left: auto;
box-shadow: 0 2px 8px rgba(124, 58, 237, 0.08);
border: 1.5px solid rgba(124, 58, 237, 0.15);
white-space: nowrap;
}
.categories-wrapper {
margin-bottom: 4rem;
margin-top: 1rem;
}
.category-section {
margin-bottom: 2.5rem;
background: var(--surface);
border-radius: var(--radius);
padding: 1rem 2rem 2rem 2rem;
box-shadow: 0 4px 15px rgba(0,0,0,0.02);
box-sizing: border-box !important;
width: 100% !important;
max-width: 100% !important;
overflow: hidden;
}
.category-title {
font-size: 1.25rem;
font-weight: 700;
color: var(--text-main);
cursor: pointer;
list-style: none;
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
padding: 1.2rem 0;
margin: 0;
transition: all 0.3s ease;
width: 100%;
}
.category-title > div {
display: flex;
align-items: center;
gap: 0.5rem;
}
.category-title:hover {
color: var(--primary);
}
.category-title::-webkit-details-marker {
display: none;
}
details[open] .category-title {
border-bottom: 1px solid var(--border);
margin-bottom: 2rem;
}
.tool-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
grid-auto-rows: 1fr;
gap: 1.5rem;
margin-top: 1.5rem;
box-sizing: border-box !important;
width: 100% !important;
}
.tool-card {
padding: 1.8rem 1.5rem;
border-radius: var(--radius);
transition: transform 0.2s, box-shadow 0.2s, background 0.2s;
display: flex;
flex-direction: column;
border: none;
background: #ffffff;
border: 1px solid #f9fafb;
box-shadow: 0 4px 20px rgba(0,0,0,0.03);
height: 100% !important;
box-sizing: border-box !important;
position: relative;
cursor: pointer;
}
.tool-card:hover {
transform: translateY(-5px);
box-shadow: 0 10px 25px rgba(0,0,0,0.06);
}
.category-section:nth-child(even) .tool-card:nth-child(4n+1) { background: linear-gradient(to bottom right, #fdf4f6, #fce7ec); }
.category-section:nth-child(even) .tool-card:nth-child(4n+2) { background: linear-gradient(to bottom right, #f0fdf4, #dcfce7); }
.category-section:nth-child(even) .tool-card:nth-child(4n+3) { background: linear-gradient(to bottom right, #eff6ff, #dbeafe); }
.category-section:nth-child(even) .tool-card:nth-child(4n+4) { background: linear-gradient(to bottom right, #fffbeb, #fef08a); }
.category-section:nth-child(odd) .tool-card:nth-child(4n+1) { background: linear-gradient(to bottom right, #eff6ff, #dbeafe); }
.category-section:nth-child(odd) .tool-card:nth-child(4n+2) { background: linear-gradient(to bottom right, #fff7ed, #ffedd5); }
.category-section:nth-child(odd) .tool-card:nth-child(4n+3) { background: linear-gradient(to bottom right, #fdf4f6, #fce7ec); }
.category-section:nth-child(odd) .tool-card:nth-child(4n+4) { background: linear-gradient(to bottom right, #f0fdf4, #dcfce7); }
.card-title {
font-size: 1.15rem;
font-weight: 700;
color: var(--text-main);
margin-bottom: 0.5rem;
display: flex;
align-items: center;
min-height: 3.5rem;
}
.icon-margin {
margin-right: 0.8rem;
color: #5850ec;
background: white;
width: 42px;
height: 42px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
font-size: 1.2rem;
box-shadow: 0 4px 10px rgba(0,0,0,0.06);
flex-shrink: 0;
}
.card-desc {
color: #4b5563;
font-size: 0.85em;
margin-bottom: 1.5rem;
flex-grow: 1;
line-height: 1.6;
display: block !important;
overflow: visible !important;
white-space: normal !important;
}
.use-btn {
align-self: flex-start;
text-decoration: none;
color: var(--primary);
font-weight: 700;
font-size: 0.85rem;
transition: color 0.2s;
margin-top: auto;
}
.use-btn::after {
content: "";
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1;
}
.use-btn:hover {
color: #4338ca;
}
.page-container {
max-width: 800px;
margin: 0 auto;
padding: 2rem 0;
}
.badge-tag {
display: inline-block;
background: #f3e8ff;
color: #9333ea;
padding: 0.4rem 1rem;
border-radius: 99px;
font-size: 0.75rem;
font-weight: 700;
letter-spacing: 0.5px;
margin-bottom: 1.5rem;
}
.page-title {
font-size: 2.2rem;
font-weight: 900;
color: var(--text-main);
margin-bottom: 1rem;
}
.page-subtitle {
color: var(--text-muted);
font-size: 1.1rem;
margin-bottom: 2rem;
}
.info-card {
background: var(--surface);
padding: 2.5rem;
border-radius: var(--radius);
box-shadow: 0 5px 20px rgba(0,0,0,0.03);
border: 1px solid rgba(0,0,0,0.02);
}
.info-card h2, .info-card h3 {
font-weight: 700;
margin-bottom: 1rem;
}
.info-card p {
color: #4b5563;
margin-bottom: 1rem;
line-height: 1.7;
}
.about-grid, .contact-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 1.5rem;
margin-top: 1.5rem;
}
.about-feature-card {
background: var(--surface);
padding: 2.5rem 2rem;
border-radius: var(--radius);
box-shadow: 0 5px 20px rgba(0,0,0,0.03);
border: 1px solid rgba(0,0,0,0.02);
text-align: center;
}
.about-feature-card i {
display: block;
font-size: 2.5rem;
margin-bottom: 1.5rem;
}
.about-feature-card h4 {
font-size: 1.1rem;
margin-bottom: 0.5rem;
margin-top: 1rem;
}
.about-feature-card p {
color: var(--text-muted);
font-size: 0.9rem;
}
.primary-btn {
display: inline-block;
background: var(--primary);
color: white;
padding: 0.75rem 2rem;
border-radius: 99px;
text-decoration: none;
font-weight: 600;
transition: background 0.2s;
}
.primary-btn:hover { background: #4338ca; }
.features-section {
background: var(--surface);
padding: 3.5rem 2rem;
border-radius: var(--radius);
text-align: center;
box-shadow: 0 5px 20px rgba(0,0,0,0.03);
border: 1px solid #f9fafb;
max-width: 1000px;
margin: 0 auto;
}
.features-section h3 {
font-size: 1.5rem;
margin-bottom: 2.5rem;
font-weight: 700;
}
.features-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 2rem;
}
.feature-icon-1 { color: #f59e0b; margin-bottom: 1rem; }
.feature-icon-2 { color: #f59e0b; margin-bottom: 1rem; }
.feature-icon-3 { color: #8b5cf6; margin-bottom: 1rem; }
.feature h4 {
font-size: 1.1rem;
margin-bottom: 0.5rem;
}
.feature p {
color: var(--text-muted);
font-size: 0.85rem;
}
.tool-page-container {
max-width: 600px;
margin: 1rem auto;
}
.tool-main-card {
background: var(--surface);
padding: 3rem;
border-radius: var(--radius);
box-shadow: 0 10px 30px rgba(0,0,0,0.04);
}
.tool-header {
text-align: center;
margin-bottom: 0.5rem;
}
.tool-page-icon {
font-size: 2.5rem;
color: #f59e0b;
margin-bottom: 1rem;
background: #fffbeb;
padding: 1rem;
border-radius: 12px;
}
.tool-title {
font-size: 2rem;
font-weight: 900;
color: var(--text-main);
}
.tool-subtitle {
text-align: center;
color: var(--text-muted);
margin-bottom: 2.5rem;
font-size: 1rem;
}
.input-group {
margin-bottom: 1.5rem;
}
.input-group label {
display: block;
margin-bottom: 0.5rem;
font-weight: 600;
color: var(--text-muted);
font-size: 0.85rem;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.tool-input {
width: 100%;
padding: 1rem 1rem;
border: 1px solid var(--border);
border-radius: 8px;
font-size: 1rem;
transition: all 0.2s;
background: #f9fafb;
font-family: inherit;
font-weight: 600;
}
.tool-input:focus {
outline: none;
border-color: var(--primary);
background: var(--surface);
}
.calc-btn {
width: 100%;
padding: 1.1rem;
background: var(--primary);
color: white;
border: none;
border-radius: 8px;
font-size: 1.1rem;
font-weight: 600;
cursor: pointer;
transition: opacity 0.2s, transform 0.1s;
margin-top: 1rem;
font-family: 'Inter', sans-serif;
display:flex;
justify-content:center;
align-items:center;
gap: 0.5rem;
}
.calc-btn:hover {
opacity: 0.9;
}
.result-box {
margin-top: 2rem;
padding: 1.5rem;
background: rgba(16, 185, 129, 0.05);
border: 1px dashed rgba(16, 185, 129, 0.4);
border-radius: 8px;
text-align: center;
font-size: 1.1rem;
font-weight: 600;
color: #10b981;
min-height: 80px;
display: flex;
align-items: center;
justify-content: center;
}
.seo-paragraph {
margin-top: 2rem;
background: var(--surface);
padding: 2.5rem;
border-radius: var(--radius);
box-shadow: 0 10px 30px rgba(0,0,0,0.04);
}
.seo-paragraph h2 {
font-size: 1.3rem;
margin-bottom: 1rem;
}
.seo-paragraph p {
color: var(--text-muted);
font-size: 0.95rem;
line-height: 1.7;
}
.main-footer {
border-top: 1px solid var(--border);
padding: 3rem 1rem;
margin-top: auto;
}
.footer-container {
max-width: 1300px;
margin: 0 auto;
text-align: center;
}
.footer-links {
margin-bottom: 1.5rem;
display: flex;
justify-content: center;
gap: 1.5rem;
flex-wrap: wrap;
}
.footer-links a {
color: var(--text-muted);
text-decoration: none;
font-size: 0.9rem;
font-weight: 600;
}
.footer-links a:hover {
color: var(--primary);
}
.footer-container p {
color: #9ca3af;
font-size: 0.85rem;
}
.nav-menu {
display: flex;
align-items: center;
gap: 1.5rem;
list-style: none;
margin: 0;
padding: 0;
}
.nav-btn-main {
all: unset;
display: inline-flex;
align-items: center;
gap: 0.5rem;
padding: 0.6rem 1.2rem;
border-radius: 99px;
font-weight: 600;
font-size: 0.9rem;
cursor: pointer;
transition: all 0.2s ease;
background: #f1f5f9;
color: var(--text-main);
text-decoration: none;
}
.nav-btn-main:hover {
background: #e2e8f0;
transform: translateY(-1px);
}
#theme-toggle.nav-btn-main {
background: var(--primary);
color: white;
}
.nav-text {
display: inline-block;
}
@media (max-width: 768px) {
.gradient-text { font-size: 2.5rem; }
.features-grid {
grid-template-columns: repeat(3, 1fr);
gap: 0.5rem;
}
.features-section {
padding: 2rem 0.5rem;
}
.feature h4 {
font-size: 0.8rem;
}
.feature p {
font-size: 0.7rem;
line-height: 1.3;
}
.feature i {
font-size: 1.5rem;
}
.tool-main-card { padding: 1.5rem; }
.header-container {
padding: 0.6rem 1rem;
}
.nav-btn-main {
padding: 8px 18px;
font-size: 14px;
}
.tool-grid {
grid-template-columns: repeat(2, 1fr);
gap: 0.8rem;
}
.tool-card {
padding: 1.2rem 1rem;
min-height: 150px;
}
.card-title {
font-size: 0.95rem;
}
.card-desc {
font-size: 0.78rem !important;
}
}
:root {
--primary-gradient: linear-gradient(135deg, #a855f7 0%, #ec4899 100%);
--soft-shadow: 0 20px 50px rgba(0,0,0,0.04);
--border-radius-xl: 30px;
--border-radius-lg: 20px;
--card-bg: #ffffff;
}
body {
background-color: #f8fafc;
color: #1e293b;
font-family: 'Inter', 'Poppins', sans-serif;
}
.premium-title {
font-size: 3.5rem;
font-weight: 900;
margin-bottom: 0.5rem;
letter-spacing: -2px;
}
.premium-subtitle {
color: #64748b;
font-size: 1.1rem;
margin-bottom: 3rem;
max-width: 700px;
margin-left: auto;
margin-right: auto;
line-height: 1.6;
}
.premium-huge-card {
background: var(--card-bg);
border-radius: var(--border-radius-xl);
box-shadow: 0 10px 40px rgba(0,0,0,0.03);
padding: 4rem 2rem;
text-align: center;
margin-bottom: 3rem;
border: 1.5px solid #e2e8f0;
position: relative;
overflow: hidden;
}
.premium-gradient-text {
background: var(--primary-gradient);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
display: inline-block;
}
#result-box:not(:empty) {
border: 3px solid #a855f7 !important;
border-radius: var(--border-radius-xl) !important;
padding: 3rem 1.5rem !important;
background: #f4f7ff !important;
box-shadow: none !important;
margin-top: 4.5rem !important;
position: relative;
overflow: hidden;
}
.premium-dashboard-grid {
display: grid !important;
grid-template-columns: repeat(3, 1fr);
gap: 1.5rem;
margin: 0 auto !important;
width: 100% !important;
max-width: 100%;
}
@media (max-width: 900px) {
.premium-dashboard-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
html, body { overflow-x: hidden; width: 100%; }
.content-container { padding: 1rem 0.8rem; width: 100%; box-sizing: border-box; }
.main-header { padding: 8px 0 !important; height: auto !important; }
.header-container {
height: auto;
padding: 0 12px !important;
gap: 12px !important;
flex-direction: row !important;
justify-content: space-between !important;
align-items: center !important;
}
.logo img { height: 24px !important; }
.logo span { font-size: 0.8rem !important; font-weight: 700 !important; margin-left: 6px !important; }
.top-nav {
flex: 1;
display: flex !important;
justify-content: flex-end !important;
align-items: center !important;
gap: 8px !important;
}
.search-container {
display: flex !important;
align-items: center !important;
flex: 1 1 auto !important;
max-width: 130px !important;
margin: 0 5px !important;
position: relative !important;
}
.search-input {
padding: 0.4rem 0.5rem 0.4rem 1.8rem !important;
font-size: 0.75rem !important;
width: 100% !important;
height: 32px !important;
border-radius: 20px !important;
border: 1px solid #e2e8f0 !important;
background: #f8fafc !important;
outline: none !important;
position: relative !important;
z-index: 5 !important;
}
.search-trigger-mobile {
position: absolute !important;
left: 8px !important;
font-size: 0.8rem !important;
color: #64748b !important;
pointer-events: none !important;
}
.page-container > .info-card,
.page-container > .about-feature-card,
.page-container > .contact-grid {
width: 100% !important;
max-width: 100% !important;
margin: 0 !important;
padding: 1.5rem !important;
border-radius: 16px !important;
box-sizing: border-box !important;
}
.search-input {
padding: 0 0.5rem 0 2rem !important;
font-size: 0.75rem !important;
width: 100% !important;
height: 100% !important;
border-radius: 50px !important;
border: 1.5px solid #e2e8f0 !important;
background: #f8fafc !important;
outline: none !important;
box-shadow: inset 0 1px 2px rgba(0,0,0,0.02) !important;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
.search-input:focus {
border-color: #5850ec !important;
background: #fff !important;
box-shadow: 0 0 0 4px rgba(88,80,236,0.1), 0 4px 12px rgba(88,80,236,0.05) !important;
}
.search-container i {
position: absolute !important;
left: 12px !important;
font-size: 0.85rem !important;
height: 100% !important;
display: flex !important;
align-items: center !important;
color: #64748b !important;
pointer-events: none !important;
}
.nav-menu { gap: 8px !important; display: flex !important; }
.nav-text { display: none !important; }
.nav-btn-main {
width: 34px !important;
height: 34px !important;
padding: 0 !important;
border-radius: 50% !important;
justify-content: center !important;
display: flex !important;
align-items: center !important;
background: #f1f5f9 !important;
border: 1px solid #e2e8f0 !important;
}
#theme-toggle.nav-btn-main { background: #5850ec !important; color: white !important; border-color: #5850ec !important; }
.nav-btn-main i { font-size: 1rem !important; margin: 0 !important; }
.premium-dashboard-grid {
grid-template-columns: 1fr;
gap: 1.5rem !important;
}
.category-section {
padding: 1.2rem 0.6rem !important;
margin-bottom: 1.5rem !important;
width: 100% !important;
box-sizing: border-box !important;
overflow: hidden !important;
}
.tool-grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
grid-auto-rows: 1fr !important;
gap: 0.6rem !important;
width: 100% !important;
display: grid !important;
justify-content: center !important;
box-sizing: border-box !important;
}
.tool-card {
padding: 1rem 0.6rem !important;
border-radius: 16px !important;
min-height: 200px !important;
height: 100% !important;
display: flex;
flex-direction: column !important;
justify-content: flex-start !important;
border: 1px solid rgba(0,0,0,0.03) !important;
box-shadow: 0 4px 15px rgba(0,0,0,0.02) !important;
min-width: 0 !important;
box-sizing: border-box !important;
}
.card-title {
font-size: 0.82rem !important;
font-weight: 800 !important;
color: #0f172a !important;
margin-bottom: 0.6rem !important;
display: flex !important;
flex-direction: row !important;
align-items: center !important;
gap: 0.4rem !important;
line-height: 1.2 !important;
min-height: 2.8rem !important;
word-break: break-word !important;
}
.icon-margin {
flex-shrink: 0 !important;
width: 38px !important;
height: 38px !important;
font-size: 1.1rem !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 12px !important;
background: white !important;
box-shadow: 0 4px 10px rgba(0,0,0,0.05) !important;
}
.card-desc {
font-size: 0.78rem !important;
color: #4b5563 !important;
line-height: 1.5 !important;
margin-bottom: 1rem !important;
opacity: 0.9 !important;
display: block !important;
}
.use-btn {
font-size: 0.85rem !important;
font-weight: 700 !important;
margin-top: auto !important;
}
.result-box table, .premium-huge-card table {
width: 100% !important;
display: block !important;
overflow-x: auto !important;
-webkit-overflow-scrolling: touch !important;
margin-top: 15px !important;
margin-bottom: 15px !important;
}
select.tool-input {
max-height: 200px !important;
overflow-y: auto !important;
}
.result-box {
width: 100% !important;
margin: 2rem 0 !important;
padding: 2rem 1.2rem !important;
border-radius: 20px !important;
}
.premium-mini-card {
margin: 0.5rem auto !important;
min-height: 110px !important;
height: auto !important;
padding: 1rem !important;
padding-top: 55px !important;
width: 90% !important;
max-width: 320px !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
align-items: center !important;
text-align: center !important;
box-sizing: border-box !important;
box-shadow: none !important;
}
.mini-card-icon {
top: 12px !important;
width: 36px !important;
height: 36px !important;
font-size: 0.9rem !important;
left: 50% !important;
transform: translateX(-50%) !important;
}
.mini-card-value {
font-size: 1.4rem !important;
word-break: break-all !important;
line-height: 1.2 !important;
}
.mini-card-label {
font-size: 0.75rem !important;
margin-bottom: 0.3rem !important;
}
.premium-huge-card {
padding: 1.5rem 1rem !important;
border-radius: 20px !important;
margin: 0 auto 1.5rem auto !important;
overflow: hidden !important;
width: 95% !important;
max-width: 340px !important;
display: block !important;
box-sizing: border-box !important;
box-shadow: none !important;
}
.premium-huge-card .premium-gradient-text {
font-size: 2rem !important;
line-height: 1.1 !important;
}
.premium-huge-card .mini-card-icon {
margin-bottom: 0.8rem !important;
position: relative !important;
top: 0 !important;
left: 0 !important;
transform: none !important;
}
.premium-title {
font-size: 2.3rem !important;
line-height: 1.1 !important;
word-break: break-word !important;
overflow-wrap: break-word !important;
max-width: 100% !important;
letter-spacing: -1.5px !important;
}
}
@media (min-width: 601px) {
.premium-mini-card {
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: center !important;
text-align: center !important;
padding-top: 90px !important;
position: relative !important;
min-height: 210px !important;
}
.mini-card-icon {
position: absolute !important;
top: 20px !important;
left: 50% !important;
transform: translateX(-50%) !important;
}
}
.premium-mini-card {
background: var(--card-bg);
border-radius: var(--border-radius-lg);
padding: 1.8rem;
box-shadow: 0 10px 25px rgba(0,0,0,0.02);
border: 1px solid #f1f5f9;
border-left: 5px solid #cbd5e1;
text-align: left;
transition: transform 0.3s ease;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.premium-mini-card:nth-child(4n+1) { border-left-color: #10b981 !important; }
.premium-mini-card:nth-child(4n+2) { border-left-color: #3b82f6 !important; }
.premium-mini-card:nth-child(4n+3) { border-left-color: #f59e0b !important; }
.premium-mini-card:nth-child(4n+4) { border-left-color: #a855f7 !important; }
.premium-mini-card:hover {
transform: translateY(-5px);
box-shadow: 0 15px 35px rgba(0,0,0,0.05);
}
.mini-card-header {
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 1.5rem;
}
.mini-card-icon {
width: 40px;
height: 40px;
border-radius: 12px;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.1rem;
}
.mini-card-label {
font-size: 0.85rem;
font-weight: 700;
color: #64748b;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.mini-card-value {
font-size: 2.2rem;
font-weight: 900;
color: #0f172a;
letter-spacing: -1px;
}
.mini-card-subtext {
font-size: 0.9rem;
color: #94a3b8;
margin-top: 0.5rem;
}
.seo-article {
margin-top: 6rem;
text-align: left;
max-width: 800px;
margin-left: auto;
margin-right: auto;
}
.seo-article p {
margin-bottom: 2rem;
line-height: 1.8;
color: #475569;
font-size: 1.1rem;
}
.seo-article a {
color: var(--primary);
text-decoration: underline;
font-weight: 600;
}
.seo-article h2 {
font-size: 2rem;
font-weight: 700;
margin-bottom: 1.5rem;
color: #0f172a;
}
.back-link:hover {
color: var(--primary) !important;
transform: translateX(-3px);
}
.bmt-value {
cursor: pointer;
text-decoration: underline dashed;
text-underline-offset: 4px;
transition: all 0.2s ease;
display: inline-block;
}
.bmt-value:hover {
color: var(--primary);
transform: scale(1.05);
}
.bmt-value:active {
transform: scale(0.95);
}
.calculator-box#calc-angel-number-calculator #result-box {
display: flex !important;
justify-content: center !important;
align-items: center !important;
flex-direction: column !important;
}
.calculator-box#calc-angel-number-calculator #result-box:not(:empty) {
background: rgba(239, 68, 68, 0.12) !important;
}
@media (max-width: 600px) {
.calculator-box#calc-angel-number-calculator #result-box:not(:empty) {
padding: 1.5rem 0.8rem !important;
margin-top: 2.5rem !important;
}
.calculator-box#calc-angel-number-calculator #result-box .premium-gradient-text {
font-size: 1.8rem !important;
line-height: 1.2 !important;
display: block !important;
word-break: break-word !important;
overflow-wrap: break-word !important;
max-width: 100% !important;
}
.calculator-box#calc-angel-number-calculator #result-box .premium-huge-card {
padding: 2rem 1rem !important;
width: 100% !important;
max-width: 100% !important;
box-sizing: border-box !important;
}
.calculator-box#calc-angel-number-calculator #result-box p[style*="font-size:1.4rem"] {
font-size: 1rem !important;
}
}
.calculator-box#calc-zodiac-love-compatibility #result-box .premium-mini-card,
.calculator-box#calc-zodiac-love-compatibility #result-box .premium-huge-card {
position: relative !important;
padding-top: 75px !important;
padding-bottom: 2rem !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
align-items: center !important;
text-align: center !important;
box-sizing: border-box !important;
border-radius: 24px !important;
}
.calculator-box#calc-zodiac-love-compatibility #result-box .mini-card-icon {
position: absolute !important;
top: 15px !important;
left: 50% !important;
transform: translateX(-50%) !important;
width: 50px !important;
height: 50px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 14px !important;
font-size: 1.35rem !important;
z-index: 10 !important;
}
.calculator-box#calc-zodiac-love-compatibility #result-box .mini-card-label {
margin-top: 18px !important;
font-weight: 700 !important;
}
.calculator-box#calc-zodiac-love-compatibility #result-box .premium-huge-card:last-child {
padding-top: 2rem !important;
text-align: left !important;
align-items: flex-start !important;
}
@media (max-width: 600px) {
.calculator-box#calc-zodiac-love-compatibility #result-box .premium-dashboard-grid {
display: flex !important;
flex-direction: column !important;
gap: 1.5rem !important;
align-items: center !important;
}
.calculator-box#calc-zodiac-love-compatibility #result-box .premium-mini-card,
.calculator-box#calc-zodiac-love-compatibility #result-box .premium-huge-card {
min-height: 200px !important;
width: 100% !important;
max-width: 100% !important;
}
.calculator-box#calc-zodiac-love-compatibility #result-box .premium-gradient-text {
font-size: 3rem !important;
margin: 0.5rem 0 !important;
}
.calculator-box#calc-zodiac-love-compatibility #result-box .mini-card-value {
font-size: 2.5rem !important;
margin-bottom: 0.5rem !important;
}
}
.calculator-box#calc-life-path-number-calculator #result-box .premium-mini-card,
.calculator-box#calc-life-path-number-calculator #result-box .premium-huge-card {
position: relative !important;
padding-top: 75px !important;
padding-bottom: 2rem !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
align-items: center !important;
text-align: center !important;
box-sizing: border-box !important;
border-radius: 24px !important;
}
.calculator-box#calc-life-path-number-calculator #result-box .mini-card-icon {
position: absolute !important;
top: 15px !important;
left: 50% !important;
transform: translateX(-50%) !important;
width: 50px !important;
height: 50px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 14px !important;
font-size: 1.35rem !important;
z-index: 10 !important;
}
.calculator-box#calc-life-path-number-calculator #result-box .mini-card-label {
margin-top: 18px !important;
font-weight: 700 !important;
}
@media (max-width: 600px) {
.calculator-box#calc-life-path-number-calculator #result-box .premium-dashboard-grid {
display: flex !important;
flex-direction: column !important;
gap: 1.5rem !important;
align-items: center !important;
}
.calculator-box#calc-life-path-number-calculator #result-box .premium-mini-card,
.calculator-box#calc-life-path-number-calculator #result-box .premium-huge-card {
min-height: 200px !important;
width: 100% !important;
max-width: 100% !important;
}
.calculator-box#calc-life-path-number-calculator #result-box .premium-gradient-text {
font-size: 4rem !important;
margin: 0.5rem 0 !important;
}
}
.calculator-box#calc-gpa-calculator #result-box .premium-mini-card,
.calculator-box#calc-gpa-calculator #result-box .premium-huge-card {
position: relative !important;
padding-top: 75px !important;
padding-bottom: 2rem !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
align-items: center !important;
text-align: center !important;
box-sizing: border-box !important;
border-radius: 24px !important;
}
.calculator-box#calc-gpa-calculator #result-box .mini-card-icon {
position: absolute !important;
top: 15px !important;
left: 50% !important;
transform: translateX(-50%) !important;
width: 50px !important;
height: 50px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 14px !important;
font-size: 1.35rem !important;
z-index: 10 !important;
}
.calculator-box#calc-gpa-calculator #result-box .mini-card-label {
margin-top: 18px !important;
font-weight: 700 !important;
}
@media (max-width: 600px) {
.calculator-box#calc-gpa-calculator #result-box .premium-dashboard-grid {
display: flex !important;
flex-direction: column !important;
gap: 1.5rem !important;
align-items: center !important;
}
.calculator-box#calc-gpa-calculator #result-box .premium-huge-card {
min-height: 200px !important;
width: 100% !important;
max-width: 100% !important;
}
.gpa-input-container {
padding: 1.5rem !important;
border-radius: 20px !important;
}
.calculator-box#calc-gpa-calculator #result-box .premium-gradient-text {
font-size: 3.5rem !important;
margin: 0.5rem 0 !important;
}
}
.calculator-box#calc-citation-generator #result-box .premium-mini-card,
.calculator-box#calc-citation-generator #result-box .premium-huge-card {
position: relative !important;
padding-top: 75px !important;
padding-bottom: 2rem !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
align-items: center !important;
text-align: center !important;
box-sizing: border-box !important;
border-radius: 24px !important;
}
.calculator-box#calc-citation-generator #result-box .mini-card-icon {
position: absolute !important;
top: 15px !important;
left: 50% !important;
transform: translateX(-50%) !important;
width: 50px !important;
height: 50px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 14px !important;
font-size: 1.35rem !important;
z-index: 10 !important;
}
.calculator-box#calc-citation-generator #result-box .mini-card-label {
margin-top: 18px !important;
font-weight: 700 !important;
}
@media (max-width: 600px) {
.calculator-box#calc-citation-generator #result-box .premium-dashboard-grid {
display: flex !important;
flex-direction: column !important;
gap: 1.5rem !important;
align-items: center !important;
}
.calculator-box#calc-citation-generator #result-box .premium-mini-card,
.calculator-box#calc-citation-generator #result-box .premium-huge-card {
min-height: 180px !important;
width: 100% !important;
max-width: 100% !important;
}
}
.calculator-box#calc-words-to-pages #result-box .premium-mini-card,
.calculator-box#calc-words-to-pages #result-box .premium-huge-card {
position: relative !important;
padding-top: 75px !important;
padding-bottom: 2rem !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
align-items: center !important;
text-align: center !important;
box-sizing: border-box !important;
border-radius: 24px !important;
}
.calculator-box#calc-words-to-pages #result-box .mini-card-icon {
position: absolute !important;
top: 15px !important;
left: 50% !important;
transform: translateX(-50%) !important;
width: 50px !important;
height: 50px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 14px !important;
font-size: 1.35rem !important;
z-index: 10 !important;
}
.calculator-box#calc-words-to-pages #result-box .mini-card-label {
margin-top: 18px !important;
font-weight: 700 !important;
}
@media (max-width: 600px) {
.calculator-box#calc-words-to-pages #result-box .premium-dashboard-grid {
display: flex !important;
flex-direction: column !important;
gap: 1.5rem !important;
align-items: center !important;
}
.calculator-box#calc-words-to-pages #result-box .premium-mini-card,
.calculator-box#calc-words-to-pages #result-box .premium-huge-card {
min-height: 200px !important;
width: 100% !important;
max-width: 100% !important;
}
.calculator-box#calc-words-to-pages #result-box .premium-gradient-text {
font-size: 5rem !important;
margin: 0.5rem 0 !important;
}
}
.calculator-box#calc-plagiarism-stats #result-box .premium-mini-card,
.calculator-box#calc-plagiarism-stats #result-box .premium-huge-card {
position: relative !important;
padding-top: 75px !important;
padding-bottom: 2rem !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
align-items: center !important;
text-align: center !important;
box-sizing: border-box !important;
border-radius: 24px !important;
}
.calculator-box#calc-plagiarism-stats #result-box .mini-card-icon {
position: absolute !important;
top: 15px !important;
left: 50% !important;
transform: translateX(-50%) !important;
width: 50px !important;
height: 50px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 14px !important;
font-size: 1.35rem !important;
z-index: 10 !important;
}
.calculator-box#calc-plagiarism-stats #result-box .mini-card-label {
margin-top: 18px !important;
font-weight: 700 !important;
}
@media (max-width: 600px) {
.calculator-box#calc-plagiarism-stats #result-box .premium-dashboard-grid {
display: flex !important;
flex-direction: column !important;
gap: 1.5rem !important;
align-items: center !important;
}
.calculator-box#calc-plagiarism-stats #result-box .premium-mini-card,
.calculator-box#calc-plagiarism-stats #result-box .premium-huge-card {
min-height: 200px !important;
width: 100% !important;
max-width: 100% !important;
}
.calculator-box#calc-plagiarism-stats #result-box .premium-gradient-text {
font-size: 3.5rem !important;
margin: 0.5rem 0 !important;
}
}
.calculator-box#calc-scholarship-estimator #result-box .premium-mini-card,
.calculator-box#calc-scholarship-estimator #result-box .premium-huge-card {
position: relative !important;
padding-top: 75px !important;
padding-bottom: 2rem !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
align-items: center !important;
text-align: center !important;
box-sizing: border-box !important;
border-radius: 24px !important;
}
.calculator-box#calc-scholarship-estimator #result-box .mini-card-icon {
position: absolute !important;
top: 15px !important;
left: 50% !important;
transform: translateX(-50%) !important;
width: 50px !important;
height: 50px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 14px !important;
font-size: 1.35rem !important;
z-index: 10 !important;
}
.calculator-box#calc-scholarship-estimator #result-box .mini-card-label {
margin-top: 18px !important;
font-weight: 700 !important;
}
@media (max-width: 600px) {
.calculator-box#calc-scholarship-estimator #result-box .premium-dashboard-grid {
display: flex !important;
flex-direction: column !important;
gap: 1.5rem !important;
align-items: center !important;
}
.calculator-box#calc-scholarship-estimator #result-box .premium-mini-card,
.calculator-box#calc-scholarship-estimator #result-box .premium-huge-card {
min-height: 200px !important;
width: 100% !important;
max-width: 100% !important;
}
.calculator-box#calc-scholarship-estimator #result-box .premium-gradient-text {
font-size: 3.5rem !important;
margin: 0.5rem 0 !important;
}
}
.calculator-box#calc-sip-calculator #result-box .premium-mini-card,
.calculator-box#calc-sip-calculator #result-box .premium-huge-card {
position: relative !important;
padding-top: 75px !important;
padding-bottom: 2rem !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
align-items: center !important;
text-align: center !important;
box-sizing: border-box !important;
border-radius: 24px !important;
}
.calculator-box#calc-sip-calculator #result-box .mini-card-icon {
position: absolute !important;
top: 15px !important;
left: 50% !important;
transform: translateX(-50%) !important;
width: 50px !important;
height: 50px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 14px !important;
font-size: 1.35rem !important;
z-index: 10 !important;
}
.calculator-box#calc-sip-calculator #result-box .mini-card-label {
margin-top: 18px !important;
font-weight: 700 !important;
}
@media (max-width: 600px) {
.calculator-box#calc-sip-calculator #result-box .premium-dashboard-grid {
display: flex !important;
flex-direction: column !important;
gap: 1.5rem !important;
align-items: center !important;
}
.calculator-box#calc-sip-calculator #result-box .premium-mini-card,
.calculator-box#calc-sip-calculator #result-box .premium-huge-card {
min-height: 200px !important;
width: 100% !important;
max-width: 100% !important;
}
.calculator-box#calc-sip-calculator #result-box .premium-gradient-text {
font-size: 3.5rem !important;
margin: 0.5rem 0 !important;
}
}
.calculator-box#calc-lumpsum-calculator #result-box .premium-mini-card,
.calculator-box#calc-lumpsum-calculator #result-box .premium-huge-card {
position: relative !important;
padding-top: 75px !important;
padding-bottom: 2rem !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
align-items: center !important;
text-align: center !important;
box-sizing: border-box !important;
border-radius: 24px !important;
}
.calculator-box#calc-lumpsum-calculator #result-box .mini-card-icon {
position: absolute !important;
top: 15px !important;
left: 50% !important;
transform: translateX(-50%) !important;
width: 50px !important;
height: 50px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 14px !important;
font-size: 1.35rem !important;
z-index: 10 !important;
}
.calculator-box#calc-lumpsum-calculator #result-box .mini-card-label {
margin-top: 18px !important;
margin-bottom: 12px !important;
font-weight: 700 !important;
}
@media (max-width: 600px) {
.calculator-box#calc-lumpsum-calculator #result-box .premium-dashboard-grid {
display: flex !important;
flex-direction: column !important;
gap: 1.5rem !important;
align-items: center !important;
}
.calculator-box#calc-lumpsum-calculator #result-box .premium-mini-card,
.calculator-box#calc-lumpsum-calculator #result-box .premium-huge-card {
min-height: 240px !important;
width: 100% !important;
max-width: 100% !important;
padding-left: 1rem !important;
padding-right: 1rem !important;
}
.calculator-box#calc-lumpsum-calculator #result-box .premium-gradient-text {
font-size: 1.8rem !important;
margin: 1rem 0 !important;
white-space: normal !important;
word-break: break-all !important;
overflow-wrap: break-word !important;
display: block !important;
width: 100% !important;
background: none !important;
-webkit-background-clip: initial !important;
-webkit-text-fill-color: initial !important;
color: #8b5cf6 !important;
opacity: 1 !important;
visibility: visible !important;
}
.calculator-box#calc-lumpsum-calculator #result-box .mini-card-value {
font-size: 1.5rem !important;
white-space: normal !important;
word-break: break-all !important;
}
}
.calculator-box#calc-gst-calculator #result-box .premium-mini-card,
.calculator-box#calc-gst-calculator #result-box .premium-huge-card {
position: relative !important;
padding-top: 75px !important;
padding-bottom: 2rem !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
align-items: center !important;
text-align: center !important;
box-sizing: border-box !important;
border-radius: 24px !important;
}
.calculator-box#calc-gst-calculator #result-box .mini-card-icon {
position: absolute !important;
top: 15px !important;
left: 50% !important;
transform: translateX(-50%) !important;
width: 50px !important;
height: 50px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 14px !important;
font-size: 1.35rem !important;
z-index: 10 !important;
}
.calculator-box#calc-gst-calculator #result-box .mini-card-label {
margin-top: 18px !important;
font-weight: 700 !important;
}
@media (max-width: 600px) {
.calculator-box#calc-gst-calculator #result-box .premium-dashboard-grid {
display: flex !important;
flex-direction: column !important;
gap: 1.5rem !important;
align-items: center !important;
}
.calculator-box#calc-gst-calculator #result-box .premium-mini-card,
.calculator-box#calc-gst-calculator #result-box .premium-huge-card {
min-height: 240px !important;
width: 100% !important;
max-width: 100% !important;
padding-left: 1rem !important;
padding-right: 1rem !important;
}
.calculator-box#calc-gst-calculator #result-box .premium-gradient-text {
font-size: 1.8rem !important;
margin: 1rem 0 !important;
white-space: normal !important;
word-break: break-all !important;
overflow-wrap: break-word !important;
display: block !important;
width: 100% !important;
background: none !important;
-webkit-background-clip: initial !important;
-webkit-text-fill-color: initial !important;
color: #f59e0b !important;
opacity: 1 !important;
visibility: visible !important;
}
.calculator-box#calc-gst-calculator #result-box .mini-card-value {
font-size: 1.5rem !important;
white-space: normal !important;
word-break: break-all !important;
}
}
.calculator-box#calc-credit-card-payoff #result-box .premium-mini-card,
.calculator-box#calc-credit-card-payoff #result-box .premium-huge-card {
position: relative !important;
padding-top: 75px !important;
padding-bottom: 2rem !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
align-items: center !important;
text-align: center !important;
box-sizing: border-box !important;
border-radius: 24px !important;
}
.calculator-box#calc-credit-card-payoff #result-box .mini-card-icon {
position: absolute !important;
top: 15px !important;
left: 50% !important;
transform: translateX(-50%) !important;
width: 50px !important;
height: 50px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 14px !important;
font-size: 1.35rem !important;
z-index: 10 !important;
}
.calculator-box#calc-credit-card-payoff #result-box .mini-card-label {
margin-top: 25px !important;
margin-bottom: 10px !important;
font-weight: 700 !important;
}
@media (max-width: 600px) {
.calculator-box#calc-credit-card-payoff #result-box .premium-dashboard-grid {
display: flex !important;
flex-direction: column !important;
gap: 1.5rem !important;
align-items: center !important;
}
.calculator-box#calc-credit-card-payoff #result-box .premium-mini-card,
.calculator-box#calc-credit-card-payoff #result-box .premium-huge-card {
min-height: 240px !important;
width: 100% !important;
max-width: 100% !important;
padding-left: 1rem !important;
padding-right: 1rem !important;
}
.calculator-box#calc-credit-card-payoff #result-box .premium-gradient-text {
font-size: 1.8rem !important;
margin: 1rem 0 !important;
white-space: normal !important;
word-break: break-all !important;
overflow-wrap: break-word !important;
display: block !important;
width: 100% !important;
background: none !important;
-webkit-background-clip: initial !important;
-webkit-text-fill-color: initial !important;
color: #f43f5e !important;
opacity: 1 !important;
visibility: visible !important;
}
.calculator-box#calc-credit-card-payoff #result-box .mini-card-value {
font-size: 1.5rem !important;
white-space: normal !important;
word-break: break-all !important;
}
}
.calculator-box#calc-calorie-calculator #result-box .premium-mini-card,
.calculator-box#calc-calorie-calculator #result-box .premium-huge-card {
position: relative !important;
padding-top: 75px !important;
padding-bottom: 2rem !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
align-items: center !important;
text-align: center !important;
box-sizing: border-box !important;
border-radius: 24px !important;
}
.calculator-box#calc-calorie-calculator #result-box .mini-card-icon {
position: absolute !important;
top: 15px !important;
left: 50% !important;
transform: translateX(-50%) !important;
width: 50px !important;
height: 50px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 14px !important;
font-size: 1.35rem !important;
z-index: 10 !important;
}
.calculator-box#calc-calorie-calculator #result-box .mini-card-label {
margin-top: 25px !important;
margin-bottom: 10px !important;
font-weight: 700 !important;
}
@media (max-width: 600px) {
.calculator-box#calc-calorie-calculator #result-box .premium-dashboard-grid {
display: flex !important;
flex-direction: column !important;
gap: 1.5rem !important;
align-items: center !important;
}
.calculator-box#calc-calorie-calculator #result-box .premium-mini-card,
.calculator-box#calc-calorie-calculator #result-box .premium-huge-card {
min-height: 240px !important;
width: 100% !important;
max-width: 100% !important;
padding-left: 1rem !important;
padding-right: 1rem !important;
}
.calculator-box#calc-calorie-calculator #result-box .premium-gradient-text {
font-size: 1.8rem !important;
margin: 1rem 0 !important;
white-space: normal !important;
word-break: break-all !important;
overflow-wrap: break-word !important;
display: block !important;
width: 100% !important;
background: none !important;
-webkit-background-clip: initial !important;
-webkit-text-fill-color: initial !important;
color: #f59e0b !important;
opacity: 1 !important;
visibility: visible !important;
}
.calculator-box#calc-calorie-calculator #result-box .mini-card-value {
font-size: 1.5rem !important;
white-space: normal !important;
word-break: break-all !important;
}
.calculator-box#calc-calorie-calculator #result-box .unit-kcal-huge {
display: block !important;
margin-top: 5px !important;
font-size: 1.2rem !important;
opacity: 0.8 !important;
}
}
.calculator-box#calc-water-intake-calculator #result-box .premium-huge-card,
.calculator-box#calc-water-intake-calculator #result-box .premium-mini-card {
padding-top: 100px !important;
}
@media (max-width: 600px) {
.calculator-box#calc-water-intake-calculator #result-box .premium-huge-card,
.calculator-box#calc-water-intake-calculator #result-box .premium-mini-card {
position: relative !important;
padding-top: 75px !important;
padding-bottom: 2rem !important;
min-height: 200px !important;
text-align: center !important;
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: center !important;
width: 100% !important;
box-sizing: border-box !important;
}
.calculator-box#calc-water-intake-calculator #result-box .mini-card-icon {
position: absolute !important;
top: 15px !important;
left: 50% !important;
transform: translateX(-50%) !important;
width: 50px !important;
height: 50px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 14px !important;
font-size: 1.35rem !important;
z-index: 10 !important;
}
.calculator-box#calc-water-intake-calculator #result-box .mini-card-label {
margin-top: 18px !important;
font-weight: 700 !important;
}
.calculator-box#calc-water-intake-calculator #result-box .premium-gradient-text {
color: #3b82f6 !important;
background: none !important;
-webkit-text-fill-color: initial !important;
font-size: 2.8rem !important;
word-break: break-all !important;
line-height: 1.2 !important;
}
.calculator-box#calc-water-intake-calculator #result-box .mini-card-value {
font-size: 1.5rem !important;
white-space: normal !important;
word-break: break-all !important;
}
.calculator-box#calc-water-intake-calculator #result-box .unit-text-water {
display: block !important;
margin-top: 5px !important;
font-size: 1.3rem !important;
opacity: 0.8 !important;
}
}
@media (max-width: 600px) {
.calculator-box#calc-body-fat-calculator #result-box .premium-huge-card,
.calculator-box#calc-body-fat-calculator #result-box .premium-mini-card {
position: relative !important;
padding-top: 75px !important;
padding-bottom: 2rem !important;
min-height: 200px !important;
text-align: center !important;
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: center !important;
width: 100% !important;
box-sizing: border-box !important;
}
.calculator-box#calc-body-fat-calculator #result-box .mini-card-icon {
position: absolute !important;
top: 15px !important;
left: 50% !important;
transform: translateX(-50%) !important;
margin: 0 !important;
}
.calculator-box#calc-body-fat-calculator #result-box .mini-card-label {
margin-top: 18px !important;
font-weight: 700 !important;
}
.calculator-box#calc-body-fat-calculator #result-box .premium-gradient-text {
color: inherit !important;
background: none !important;
-webkit-text-fill-color: initial !important;
font-size: 2.8rem !important;
word-break: break-all !important;
line-height: 1.2 !important;
}
.calculator-box#calc-body-fat-calculator #result-box .mini-card-value {
font-size: 1.5rem !important;
white-space: normal !important;
word-break: break-all !important;
}
}
.calculator-box#calc-body-fat-calculator #result-box .premium-mini-card {
min-height: 180px !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
}
@media (max-width: 600px) {
.calculator-box#calc-body-fat-calculator #result-box .premium-mini-card {
text-align: center !important;
}
}
.calculator-box#calc-ideal-weight-calculator #result-box .premium-mini-card {
min-height: 180px !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
}
@media (max-width: 600px) {
.calculator-box#calc-ideal-weight-calculator #result-box .premium-huge-card,
.calculator-box#calc-ideal-weight-calculator #result-box .premium-mini-card {
position: relative !important;
padding-top: 60px !important;
padding-bottom: 2rem !important;
min-height: 200px !important;
text-align: center !important;
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: center !important;
width: 100% !important;
box-sizing: border-box !important;
}
.calculator-box#calc-ideal-weight-calculator #result-box .mini-card-icon {
position: absolute !important;
top: 15px !important;
left: 50% !important;
transform: translateX(-50%) !important;
margin: 0 !important;
}
.calculator-box#calc-ideal-weight-calculator #result-box .mini-card-label {
margin-top: 12px !important;
font-weight: 700 !important;
}
.calculator-box#calc-ideal-weight-calculator #result-box .mini-card-subtext {
font-size: 0.85rem !important;
white-space: nowrap !important;
line-height: 1.2 !important;
}
.calculator-box#calc-ideal-weight-calculator #result-box .premium-gradient-text {
font-size: 2.2rem !important;
word-break: normal !important;
white-space: nowrap !important;
color: #8b5cf6 !important;
}
}
.calculator-box#calc-bmr-calculator #result-box .premium-mini-card {
height: 220px !important;
min-height: 220px !important;
max-height: 220px !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
align-items: center !important;
box-sizing: border-box !important;
}
@media (max-width: 600px) {
.calculator-box#calc-bmr-calculator #result-box .premium-huge-card,
.calculator-box#calc-bmr-calculator #result-box .premium-mini-card {
position: relative !important;
padding-top: 60px !important;
padding-bottom: 2rem !important;
min-height: 200px !important;
text-align: center !important;
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: center !important;
width: 100% !important;
box-sizing: border-box !important;
}
.calculator-box#calc-bmr-calculator #result-box .mini-card-icon {
position: absolute !important;
top: 15px !important;
left: 50% !important;
transform: translateX(-50%) !important;
margin: 0 !important;
}
.calculator-box#calc-bmr-calculator #result-box .mini-card-label {
margin-top: 12px !important;
font-weight: 700 !important;
}
.calculator-box#calc-bmr-calculator #result-box .mini-card-subtext {
font-size: 0.85rem !important;
white-space: nowrap !important;
}
.calculator-box#calc-bmr-calculator #result-box .premium-gradient-text {
font-size: 3rem !important;
color: #ef4444 !important;
}
}
.calculator-box#calc-protein-intake-calculator #result-box .premium-mini-card {
box-sizing: border-box !important;
}
@media (max-width: 600px) {
.calculator-box#calc-protein-intake-calculator #result-box .premium-huge-card,
.calculator-box#calc-protein-intake-calculator #result-box .premium-mini-card {
position: relative !important;
padding-top: 60px !important;
padding-bottom: 2rem !important;
min-height: 200px !important;
text-align: center !important;
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: center !important;
width: 100% !important;
box-sizing: border-box !important;
}
.calculator-box#calc-protein-intake-calculator #result-box .mini-card-icon {
position: absolute !important;
top: 15px !important;
left: 50% !important;
transform: translateX(-50%) !important;
margin: 0 !important;
}
.calculator-box#calc-protein-intake-calculator #result-box .mini-card-label {
margin-top: 12px !important;
font-weight: 700 !important;
}
}
@media (max-width: 600px) {
.calculator-box#calc-pregnancy-due-date-calculator #result-box {
display: flex !important;
flex-direction: column !important;
align-items: center !important;
width: 100% !important;
}
.calculator-box#calc-pregnancy-due-date-calculator #result-box .premium-dashboard-grid {
display: flex !important;
flex-direction: column !important;
align-items: center !important;
width: 100% !important;
gap: 1.5rem !important;
}
.calculator-box#calc-pregnancy-due-date-calculator #result-box .premium-huge-card,
.calculator-box#calc-pregnancy-due-date-calculator #result-box .premium-mini-card {
position: relative !important;
padding-top: 75px !important;
padding-bottom: 2rem !important;
min-height: 200px !important;
text-align: center !important;
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: flex-start !important;
width: 100% !important;
box-sizing: border-box !important;
}
.calculator-box#calc-pregnancy-due-date-calculator #result-box .premium-mini-card {
width: 100% !important;
max-width: 300px !important;
height: auto !important;
min-height: 180px !important;
margin: 0.5rem auto !important;
}
.calculator-box#calc-pregnancy-due-date-calculator #result-box .mini-card-icon {
position: absolute !important;
top: 15px !important;
left: 50% !important;
transform: translateX(-50%) !important;
margin: 0 !important;
display: flex !important;
}
.calculator-box#calc-pregnancy-due-date-calculator #result-box .mini-card-label {
margin-top: 12px !important;
font-weight: 700 !important;
}
.calculator-box#calc-pregnancy-due-date-calculator #result-box .mini-card-subtext {
font-size: 0.8rem !important;
white-space: nowrap !important;
}
.calculator-box#calc-pregnancy-due-date-calculator #result-box .premium-gradient-text {
font-size: 2rem !important;
line-height: 1.2 !important;
white-space: normal !important;
word-wrap: break-word !important;
overflow-wrap: break-word !important;
color: #d946ef !important;
width: 100% !important;
display: block !important;
}
}
.calculator-box#calc-brand-name-generator #result-box {
box-sizing: border-box !important;
}
@media (max-width: 600px) {
.calculator-box#calc-brand-name-generator #result-box {
display: flex !important;
flex-direction: column !important;
align-items: center !important;
width: 100% !important;
}
.calculator-box#calc-brand-name-generator #result-box .premium-dashboard-grid {
display: flex !important;
flex-direction: column !important;
align-items: center !important;
width: 100% !important;
gap: 1.5rem !important;
}
.calculator-box#calc-brand-name-generator #result-box .premium-huge-card,
.calculator-box#calc-brand-name-generator #result-box .premium-mini-card {
position: relative !important;
padding-top: 75px !important;
padding-bottom: 2rem !important;
min-height: 200px !important;
text-align: center !important;
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: flex-start !important;
width: 100% !important;
box-sizing: border-box !important;
}
.calculator-box#calc-brand-name-generator #result-box .premium-mini-card {
max-width: 300px !important;
height: auto !important;
min-height: 180px !important;
margin: 0.5rem auto !important;
}
.calculator-box#calc-brand-name-generator #result-box .mini-card-icon {
position: absolute !important;
top: 15px !important;
left: 50% !important;
transform: translateX(-50%) !important;
margin: 0 !important;
display: flex !important;
}
.calculator-box#calc-brand-name-generator #result-box .mini-card-subtext {
font-size: 0.85rem !important;
white-space: nowrap !important;
}
.calculator-box#calc-brand-name-generator #result-box .premium-gradient-text {
font-size: 2rem !important;
white-space: normal !important;
color: #6366f1 !important;
line-height: 1.3 !important;
}
}
.calculator-box#calc-fd-calculator #result-box .premium-mini-card,
.calculator-box#calc-fd-calculator #result-box .premium-huge-card {
position: relative !important;
padding-top: 75px !important;
padding-bottom: 2rem !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
align-items: center !important;
text-align: center !important;
box-sizing: border-box !important;
border-radius: 24px !important;
}
.calculator-box#calc-fd-calculator #result-box .mini-card-icon {
position: absolute !important;
top: 15px !important;
left: 50% !important;
transform: translateX(-50%) !important;
width: 50px !important;
height: 50px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 14px !important;
font-size: 1.35rem !important;
z-index: 10 !important;
}
.calculator-box#calc-fd-calculator #result-box .mini-card-label {
margin-top: 25px !important;
margin-bottom: 10px !important;
font-weight: 700 !important;
}
@media (max-width: 600px) {
.calculator-box#calc-fd-calculator #result-box .premium-dashboard-grid {
display: flex !important;
flex-direction: column !important;
gap: 1.5rem !important;
align-items: center !important;
}
.calculator-box#calc-fd-calculator #result-box .premium-mini-card,
.calculator-box#calc-fd-calculator #result-box .premium-huge-card {
min-height: 240px !important;
width: 100% !important;
max-width: 100% !important;
padding-left: 1rem !important;
padding-right: 1rem !important;
}
.calculator-box#calc-fd-calculator #result-box .premium-gradient-text {
font-size: 1.8rem !important;
margin: 1rem 0 !important;
white-space: normal !important;
word-break: break-all !important;
overflow-wrap: break-word !important;
display: block !important;
width: 100% !important;
background: none !important;
-webkit-background-clip: initial !important;
-webkit-text-fill-color: initial !important;
color: #10b981 !important;
opacity: 1 !important;
visibility: visible !important;
}
.calculator-box#calc-cv-generator #result-box {
box-sizing: border-box !important;
}
@media (max-width: 600px) {
.calculator-box#calc-cv-generator #result-box {
display: flex !important;
flex-direction: column !important;
align-items: center !important;
width: 100% !important;
}
.calculator-box#calc-cv-generator #result-box .premium-dashboard-grid {
display: flex !important;
flex-direction: column !important;
align-items: center !important;
width: 100% !important;
gap: 1.5rem !important;
}
.calculator-box#calc-cv-generator #result-box .premium-huge-card {
width: 100% !important;
max-width: 100% !important;
margin: 0 auto !important;
padding: 1.5rem !important;
text-align: left !important;
box-sizing: border-box !important;
}
.calculator-box#calc-cv-generator #result-box .premium-mini-card {
width: 240px !important;
height: 240px !important;
min-height: 240px !important;
max-height: 240px !important;
aspect-ratio: 1 / 1 !important;
display: flex !important;
flex-direction: column !important;
justify-content: flex-start !important;
align-items: center !important;
padding-top: 2rem !important;
margin: 0 auto !important;
overflow: hidden !important;
text-align: center !important;
box-sizing: border-box !important;
border-top: none !important;
border-left: 5px solid #6366f1 !important;
}
.calculator-box#calc-cv-generator #result-box .mini-card-icon {
margin: 0 auto 1.2rem auto !important;
display: flex !important;
}
.calculator-box#calc-cv-generator #result-box .mini-card-subtext {
font-size: 0.85rem !important;
white-space: nowrap !important;
}
.calculator-box#calc-cv-generator #result-box .premium-huge-card h1 {
font-size: 1.8rem !important;
}
}
.calculator-box#calc-invoice-generator #result-box {
box-sizing: border-box !important;
}
@media (max-width: 600px) {
.calculator-box#calc-invoice-generator #result-box {
display: flex !important;
flex-direction: column !important;
align-items: center !important;
width: 100% !important;
}
.calculator-box#calc-invoice-generator #result-box .premium-dashboard-grid {
display: flex !important;
flex-direction: column !important;
align-items: center !important;
width: 100% !important;
gap: 1.5rem !important;
}
.calculator-box#calc-invoice-generator #result-box .premium-huge-card {
width: 100% !important;
max-width: 100% !important;
margin: 0 auto !important;
padding: 1rem !important;
text-align: left !important;
box-sizing: border-box !important;
overflow-x: auto !important;
}
.calculator-box#calc-invoice-generator #result-box .premium-mini-card {
width: 240px !important;
height: 240px !important;
min-height: 240px !important;
max-height: 240px !important;
aspect-ratio: 1 / 1 !important;
display: flex !important;
flex-direction: column !important;
justify-content: flex-start !important;
align-items: center !important;
padding-top: 2rem !important;
margin: 0 auto !important;
overflow: hidden !important;
text-align: center !important;
box-sizing: border-box !important;
border-top: none !important;
border-left: 5px solid #3b82f6 !important;
}
.calculator-box#calc-invoice-generator #result-box .mini-card-icon {
margin: 0 auto 1.2rem auto !important;
display: flex !important;
}
.calculator-box#calc-invoice-generator #result-box .mini-card-subtext {
font-size: 0.85rem !important;
white-space: nowrap !important;
}
.calculator-box#calc-invoice-generator #result-box table {
font-size: 0.75rem !important;
}
.invoice-header {
flex-direction: column !important;
align-items: center !important;
text-align: center !important;
gap: 1.5rem !important;
}
.invoice-header div {
text-align: center !important;
}
.calculator-box#calc-business-name-generator #result-box .premium-dashboard-grid {
display: flex !important;
flex-direction: column !important;
gap: 1.5rem !important;
align-items: center !important;
justify-content: center !important;
}
.calculator-box#calc-business-name-generator #result-box .premium-huge-card {
width: 100% !important;
max-width: 100% !important;
padding: 2rem !important;
box-sizing: border-box !important;
}
.calculator-box#calc-business-name-generator #result-box .premium-mini-card {
width: 240px !important;
height: 240px !important;
min-height: 240px !important;
max-height: 240px !important;
aspect-ratio: 1 / 1 !important;
display: flex !important;
flex-direction: column !important;
justify-content: flex-start !important;
align-items: center !important;
padding-top: 2rem !important;
margin: 0 auto !important;
overflow: hidden !important;
text-align: center !important;
box-sizing: border-box !important;
border-top: none !important;
}
.calculator-box#calc-business-name-generator #result-box .mini-card-icon {
margin: 0 auto 1.2rem auto !important;
display: flex !important;
}
.calculator-box#calc-business-name-generator #result-box h1 {
font-size: 2.5rem !important;
word-break: break-word !important;
}
.calculator-box#calc-business-name-generator #result-box p {
font-size: 0.9rem !important;
letter-spacing: 1px !important;
}
.calculator-box#calc-business-name-generator #result-box .premium-huge-card {
padding: 2.5rem 1rem !important;
}
.calculator-box#calc-business-name-generator #result-box .premium-huge-card div[style*="grid-template-columns"] {
grid-template-columns: 1fr !important;
}
.calculator-box#calc-what-is-my-ip #result-box .premium-dashboard-grid {
display: flex !important;
flex-direction: column !important;
gap: 1.5rem !important;
align-items: center !important;
justify-content: center !important;
}
.calculator-box#calc-what-is-my-ip #result-box .premium-huge-card,
.calculator-box#calc-what-is-my-ip #result-box .premium-mini-card {
position: relative !important;
padding-top: 75px !important;
padding-bottom: 2rem !important;
min-height: 180px !important;
text-align: center !important;
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: flex-start !important;
width: 100% !important;
box-sizing: border-box !important;
}
.calculator-box#calc-what-is-my-ip #result-box .premium-mini-card {
max-width: 300px !important;
margin: 0.5rem auto !important;
}
.calculator-box#calc-what-is-my-ip #result-box .mini-card-icon {
position: absolute !important;
top: 15px !important;
left: 50% !important;
transform: translateX(-50%) !important;
margin: 0 !important;
display: flex !important;
}
.calculator-box#calc-what-is-my-ip #result-box .premium-gradient-text {
font-size: 1.3rem !important;
word-break: break-all !important;
}
.calculator-box#calc-word-counter #result-box .premium-huge-card,
.calculator-box#calc-character-counter #result-box .premium-huge-card,
.calculator-box#calc-paragraph-counter #result-box .premium-huge-card,
.calculator-box#calc-text-sorter #result-box .premium-huge-card,
.calculator-box#calc-remove-duplicate-lines #result-box .premium-huge-card,
.calculator-box#calc-text-uniqueness-checker #result-box .premium-huge-card,
.calculator-box#calc-image-to-pdf #result-box .premium-huge-card,
.calculator-box#calc-png-to-jpg-converter #result-box .premium-huge-card,
.calculator-box#calc-jpg-to-png-converter #result-box .premium-huge-card,
.calculator-box#calc-case-converter #result-box .premium-huge-card {
width: 100% !important;
max-width: 100% !important;
padding: 2.5rem 1rem !important;
text-align: center !important;
box-sizing: border-box !important;
margin: 0 auto 1.5rem auto !important;
}
.calculator-box#calc-word-counter #result-box .premium-gradient-text,
.calculator-box#calc-character-counter #result-box .premium-gradient-text,
.calculator-box#calc-paragraph-counter #result-box .premium-gradient-text,
.calculator-box#calc-text-sorter #result-box .premium-gradient-text,
.calculator-box#calc-remove-duplicate-lines #result-box .premium-gradient-text,
.calculator-box#calc-text-uniqueness-checker #result-box .premium-gradient-text {
font-size: 3rem !important;
font-weight: 900 !important;
}
.calculator-box#calc-word-counter #result-box .premium-mini-card,
.calculator-box#calc-character-counter #result-box .premium-mini-card,
.calculator-box#calc-paragraph-counter #result-box .premium-mini-card,
.calculator-box#calc-text-sorter #result-box .premium-mini-card,
.calculator-box#calc-remove-duplicate-lines #result-box .premium-mini-card,
.calculator-box#calc-text-uniqueness-checker #result-box .premium-mini-card,
.calculator-box#calc-png-to-jpg-converter #result-box .premium-mini-card,
.calculator-box#calc-jpg-to-png-converter #result-box .premium-mini-card,
.calculator-box#calc-case-converter #result-box .premium-mini-card,
.calculator-box#calc-image-to-pdf #result-box .premium-mini-card,
.calculator-box#calc-png-to-jpg-converter #result-box .premium-mini-card,
.calculator-box#calc-jpg-to-png-converter #result-box .premium-mini-card {
position: relative !important;
padding-top: 75px !important;
padding-bottom: 2rem !important;
min-height: 180px !important;
text-align: center !important;
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: flex-start !important;
width: 100% !important;
box-sizing: border-box !important;
max-width: 300px !important;
margin: 0.5rem auto !important;
}
.calculator-box#calc-what-is-my-ip #result-box .mini-card-icon,
.calculator-box#calc-word-counter #result-box .mini-card-icon,
.calculator-box#calc-character-counter #result-box .mini-card-icon,
.calculator-box#calc-paragraph-counter #result-box .mini-card-icon,
.calculator-box#calc-text-sorter #result-box .mini-card-icon,
.calculator-box#calc-remove-duplicate-lines #result-box .mini-card-icon,
.calculator-box#calc-text-uniqueness-checker #result-box .mini-card-icon,
.calculator-box#calc-image-to-pdf #result-box .mini-card-icon,
.calculator-box#calc-png-to-jpg-converter #result-box .mini-card-icon,
.calculator-box#calc-jpg-to-png-converter #result-box .mini-card-icon,
.calculator-box#calc-case-converter #result-box .mini-card-icon {
position: absolute !important;
top: 15px !important;
left: 50% !important;
transform: translateX(-50%) !important;
margin: 0 !important;
display: flex !important;
}
.calculator-box#calc-what-is-my-ip #result-box .mini-card-label,
.calculator-box#calc-word-counter #result-box .mini-card-label,
.calculator-box#calc-character-counter #result-box .mini-card-label,
.calculator-box#calc-paragraph-counter #result-box .mini-card-label,
.calculator-box#calc-text-sorter #result-box .mini-card-label,
.calculator-box#calc-remove-duplicate-lines #result-box .mini-card-label,
.calculator-box#calc-text-uniqueness-checker #result-box .mini-card-label,
.calculator-box#calc-image-to-pdf #result-box .mini-card-label,
.calculator-box#calc-png-to-jpg-converter #result-box .mini-card-label,
.calculator-box#calc-jpg-to-png-converter #result-box .mini-card-label,
.calculator-box#calc-case-converter #result-box .mini-card-label {
margin-bottom: 0.5rem !important;
font-size: 0.85rem !important;
font-weight: 700 !important;
color: #64748b !important;
text-transform: uppercase !important;
letter-spacing: 1.5px !important;
}
.calculator-box#calc-what-is-my-ip #result-box .mini-card-value {
font-size: 1.8rem !important;
font-weight: 800 !important;
color: #0f172a !important;
line-height: 1.1 !important;
margin: 0 !important;
word-break: break-word !important;
}
.calculator-box#calc-word-counter #result-box .mini-card-value,
.calculator-box#calc-character-counter #result-box .mini-card-value,
.calculator-box#calc-paragraph-counter #result-box .mini-card-value,
.calculator-box#calc-text-sorter #result-box .mini-card-value,
.calculator-box#calc-remove-duplicate-lines #result-box .mini-card-value,
.calculator-box#calc-text-uniqueness-checker #result-box .mini-card-value {
font-size: 3rem !important;
font-weight: 900 !important;
color: #0f172a !important;
line-height: 1 !important;
margin: 0 !important;
}
.calculator-box#calc-png-to-jpg-converter #result-box .mini-card-value,
.calculator-box#calc-jpg-to-png-converter #result-box .mini-card-value {
font-size: 2.5rem !important;
font-weight: 900 !important;
color: #0f172a !important;
line-height: 1 !important;
margin: 0 !important;
}
.calculator-box#calc-case-converter #result-box .mini-card-value,
.calculator-box#calc-text-uniqueness-checker #result-box .mini-card-value,
.calculator-box#calc-image-to-pdf #result-box .mini-card-value,
.calculator-box#calc-png-to-jpg-converter #result-box .mini-card-value,
.calculator-box#calc-jpg-to-png-converter #result-box .mini-card-value {
font-size: 1.8rem !important;
font-weight: 800 !important;
color: #0f172a !important;
line-height: 1.1 !important;
margin: 0 !important;
word-break: break-word !important;
}
}
.vpn-ip-text {
font-size: 1.6rem !important;
}
}
.calculator-box#calc-fd-calculator #result-box .mini-card-value {
font-size: 1.5rem !important;
white-space: normal !important;
word-break: break-all !important;
}
}
.calculator-box#calc-bmi-calculator #result-box .premium-mini-card,
.calculator-box#calc-bmi-calculator #result-box .premium-huge-card {
position: relative !important;
padding-top: 90px !important;
padding-bottom: 2rem !important;
display: flex !important;
flex-direction: column !important;
justify-content: flex-start !important;
align-items: center !important;
text-align: center !important;
box-sizing: border-box !important;
border-radius: 24px !important;
}
.calculator-box#calc-bmi-calculator #result-box .mini-card-icon {
position: absolute !important;
top: 15px !important;
left: 50% !important;
transform: translateX(-50%) !important;
width: 50px !important;
height: 50px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 14px !important;
font-size: 1.35rem !important;
z-index: 10 !important;
}
.calculator-box#calc-bmi-calculator #result-box .mini-card-label {
margin-top: 18px !important;
font-weight: 700 !important;
}
@media (max-width: 600px) {
.calculator-box#calc-bmi-calculator #result-box .premium-dashboard-grid {
display: flex !important;
flex-direction: column !important;
gap: 1.5rem !important;
align-items: center !important;
}
.calculator-box#calc-bmi-calculator #result-box .premium-mini-card,
.calculator-box#calc-bmi-calculator #result-box .premium-huge-card {
position: relative !important;
min-height: 250px !important;
width: 100% !important;
max-width: 100% !important;
padding-top: 95px !important;
padding-left: 1rem !important;
padding-right: 1rem !important;
justify-content: flex-start !important;
}
.calculator-box#calc-bmi-calculator #result-box .mini-card-label {
margin-top: 15px !important;
margin-bottom: 10px !important;
}
.calculator-box#calc-bmi-calculator #result-box .bmi-score-value {
font-size: 3.2rem !important;
margin: 0.5rem 0 !important;
}
}
.calculator-box#calc-age-calculator #result-box .age-grid {
display: grid;
gap: 1.5rem;
grid-template-columns: repeat(3, 1fr);
width: 100%;
}
.calculator-box#calc-age-calculator #result-box .age-huge {
grid-column: 1 / -1;
border-top: 10px solid #10b981;
position: relative;
padding: 5.5rem 1.5rem 3rem 1.5rem;
text-align: center;
background: white;
border-radius: 25px;
box-shadow: 0 10px 40px rgba(0,0,0,0.04);
}
.calculator-box#calc-age-calculator #result-box .age-card {
background: white;
border-radius: 20px;
box-shadow: 0 5px 20px rgba(0,0,0,0.03);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
position: relative;
height: 240px;
padding: 4.5rem 1rem 2rem 1rem;
text-align: center;
transition: transform 0.3s ease;
}
.calculator-box#calc-age-calculator #result-box .age-card:hover { transform: translateY(-5px); }
.calculator-box#calc-age-calculator #result-box .age-card i { position: absolute; top: 35px; font-size: 2.2rem; }
.calculator-box#calc-age-calculator #result-box .age-huge i { position: absolute; top: 30px; left: 50%; transform: translateX(-50%); font-size: 3rem; color: #10b981; }
.calculator-box#calc-age-calculator #result-box .age-val { font-size: 4.5rem; font-weight: 900; margin: 1.5rem 0; }
@media (max-width: 1024px) {
.calculator-box#calc-age-calculator #result-box .age-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
.calculator-box#calc-age-calculator #result-box .age-card { height: 200px !important; padding-top: 3.5rem !important; }
.calculator-box#calc-age-calculator #result-box .age-card i { top: 25px !important; font-size: 1.8rem !important; }
.calculator-box#calc-age-calculator #result-box .age-huge { padding-top: 4.5rem !important; }
.calculator-box#calc-age-calculator #result-box .age-huge i { top: 25px !important; font-size: 2.2rem !important; }
.calculator-box#calc-age-calculator #result-box .age-val { font-size: 2.1rem !important; letter-spacing: -1px; }
.calculator-box#calc-age-calculator #result-box .age-grid { display: flex !important; flex-direction: column !important; }
}