*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:Arial,Helvetica,sans-serif;background:radial-gradient(circle at top right,rgba(124,58,237,.18),transparent 35%),radial-gradient(circle at top left,rgba(34,211,238,.18),transparent 30%),#f8fbff;color:#0f172a;line-height:1.6}a{text-decoration:none;color:inherit}.site-header{width:100%;padding:18px 7%;display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.88);backdrop-filter:blur(14px);border-bottom:1px solid rgba(226,232,240,.8);position:sticky;top:0;z-index:10}.logo{display:flex;align-items:center;gap:10px;font-weight:900}.logo-mark{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;position:relative;background:linear-gradient(135deg,#18b6ff,#6d5dfc 55%,#8b3dff);box-shadow:0 14px 30px rgba(37,99,255,.28)}.logo-mark:before{content:"";position:absolute;top:-7px;width:10px;height:10px;border-radius:50%;background:#fbbf24;box-shadow:0 0 0 4px rgba(251,191,36,.18)}.logo-mark:after{content:"↗";position:absolute;right:-6px;bottom:-7px;width:24px;height:24px;border-radius:999px;display:grid;place-items:center;color:white;font-size:14px;font-weight:900;background:linear-gradient(135deg,#22d3ee,#7c3aed);border:3px solid white}.robot-face{width:29px;height:22px;border-radius:10px;background:#0f172a;display:flex;align-items:center;justify-content:center;gap:6px}.robot-face span{width:5px;height:8px;border-radius:999px;background:#67e8f9}.logo-text{font-size:28px;letter-spacing:-1px;color:#0f172a}.logo-text span{background:linear-gradient(135deg,#2563ff,#7c3aed);-webkit-background-clip:text;color:transparent}.nav{display:flex;gap:24px;font-size:15px;font-weight:700;color:#334155}.nav a:hover{color:#2563ff}.header-button,.primary-button{color:white;background:linear-gradient(135deg,#2563ff,#7c3aed);box-shadow:0 12px 25px rgba(124,58,237,.25)}.header-button{padding:12px 20px;border-radius:12px;font-weight:800}.hero-section{max-width:1200px;margin:0 auto;padding:90px 7% 70px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:60px}.hero-badge{display:inline-block;padding:10px 18px;border-radius:999px;color:#2563ff;font-weight:800;background:rgba(124,58,237,.1);margin-bottom:24px}.hero-content h1{font-size:64px;line-height:1.05;letter-spacing:-3px;margin-bottom:24px;background:linear-gradient(135deg,#2563ff,#7c3aed);-webkit-background-clip:text;color:transparent}.hero-content h1 span{color:#0f172a;background:none;-webkit-text-fill-color:#0f172a}.hero-description{font-size:20px;color:#475569;max-width:560px;margin-bottom:28px}.hero-points{display:flex;flex-wrap:wrap;gap:16px;margin-bottom:34px;color:#334155;font-weight:700}.hero-points span{background:white;padding:9px 13px;border-radius:999px;box-shadow:0 8px 18px rgba(15,23,42,.06)}.hero-buttons{display:flex;gap:16px;flex-wrap:wrap}.button{display:inline-block;padding:16px 24px;border-radius:14px;font-weight:900;transition:.2s ease}.secondary-button{color:#2563ff;background:white;border:1px solid rgba(37,99,255,.35)}.button:hover,.blog-card:hover{transform:translateY(-3px)}.hero-card{position:relative}.hero-card:before{content:"";position:absolute;inset:-35px;background:linear-gradient(135deg,rgba(34,211,238,.22),rgba(124,58,237,.25));border-radius:40px;filter:blur(6px);z-index:-1}.calculator-preview,.content-page,.audience-card,.tool-card,.side-card{background:rgba(255,255,255,.94);border:1px solid rgba(226,232,240,.8);box-shadow:0 18px 45px rgba(15,23,42,.08)}.calculator-preview{border-radius:28px;padding:32px}.preview-header{display:flex;gap:16px;align-items:center;margin-bottom:30px}.preview-icon{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,#2563ff,#7c3aed);color:white;font-size:24px}.preview-header h2{font-size:24px;margin-bottom:4px}.preview-header p,.preview-note,.content-page p,.tool-card p,.blog-card p,.audience-card p{color:#475569}.preview-row{display:flex;justify-content:space-between;font-weight:800;margin-top:18px;margin-bottom:10px}.preview-row strong{background:#f8fafc;padding:8px 14px;border-radius:10px}.preview-bar{height:10px;background:#e2e8f0;border-radius:999px;overflow:hidden}.preview-bar div{height:100%;border-radius:999px;background:linear-gradient(135deg,#2563ff,#60a5fa)}.preview-bar.purple div{background:linear-gradient(135deg,#2563ff,#7c3aed)}.preview-bar.cyan div{background:linear-gradient(135deg,#22d3ee,#2563ff)}.preview-results,.result-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:30px}.preview-results div,.result-card{background:linear-gradient(135deg,rgba(37,99,255,.08),rgba(124,58,237,.08));border-radius:18px;padding:20px}.preview-results p,.result-card p{font-weight:800;color:#2563ff;margin-bottom:6px}.preview-results strong,.result-card strong{font-size:32px;color:#7c3aed}.audience-section,.tools-section,.latest-section{max-width:1200px;margin:0 auto;padding:30px 7% 70px}.audience-section{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.audience-card,.tool-card,.blog-card{border-radius:24px;padding:28px}.audience-icon,.tool-icon{width:64px;height:64px;border-radius:22px;display:grid;place-items:center;font-size:30px;background:linear-gradient(135deg,rgba(37,99,255,.13),rgba(124,58,237,.13));margin-bottom:22px}.section-heading{text-align:center;margin-bottom:34px}.section-heading p{color:#7c3aed;font-weight:900;margin-bottom:8px}.section-heading h2{font-size:38px;letter-spacing:-1px}.tools-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.tool-icon{width:52px;height:52px;font-size:24px}.green{background:#dcfce7}.orange{background:#ffedd5}.purple-icon{background:#ede9fe}.blue{background:#dbeafe}.tool-card span,.blog-card span{display:inline-block;padding:6px 12px;border-radius:999px;background:#eef2ff;color:#2563ff;font-weight:900;font-size:13px}.latest-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:32px}.center-action{text-align:center;margin-top:30px}.page-container{max-width:1000px;margin:60px auto;padding:0 24px}.content-page{padding:42px;border-radius:24px}.content-page h1{font-size:42px;line-height:1.15;margin-bottom:18px}.content-page h2{margin-top:32px;margin-bottom:14px;font-size:28px}.content-page h3{margin-top:20px;margin-bottom:10px}.content-page p{margin-bottom:18px}.content-page ul,.side-card ul{margin:18px 0 24px 24px;color:#475569}.content-page li,.side-card li{margin-bottom:10px}.blog-list{display:grid;grid-template-columns:1fr;gap:22px;margin-top:32px}.blog-card{display:block;background:linear-gradient(135deg,rgba(37,99,255,.07),rgba(124,58,237,.08));border:1px solid rgba(124,58,237,.16);transition:.2s ease}.blog-category{color:#7c3aed!important;font-weight:900;margin-bottom:8px!important}.blog-card h2{margin-top:0;margin-bottom:12px;color:#0f172a}.cta-box,.contact-box{margin:35px 0;padding:28px;border-radius:22px;background:linear-gradient(135deg,rgba(37,99,255,.1),rgba(124,58,237,.12));border:1px solid rgba(124,58,237,.18)}.contact-box{background:linear-gradient(135deg,rgba(37,99,255,.08),rgba(34,211,238,.1))}.calculator-layout{display:grid;grid-template-columns:1.5fr .9fr;gap:24px;align-items:start}.calculator-form{margin-top:28px}input{width:100%;padding:14px;margin-top:8px;margin-bottom:20px;border:1px solid #dbe3ef;border-radius:12px;font-size:16px}button{width:100%;padding:16px;background:linear-gradient(135deg,#2563ff,#7c3aed);color:white;border:none;border-radius:14px;font-size:16px;font-weight:900;cursor:pointer}.result{margin-top:30px}.error{color:#dc2626;margin-top:15px;font-weight:900}.note{background:#fff7ed;padding:16px;border-radius:10px;color:#9a3412!important;margin-top:24px}.calculator-side{display:grid;gap:20px}.side-card{border-radius:24px;padding:26px}.side-card a{display:block;color:#2563ff;font-weight:800;margin-top:12px}.seo-section{margin-top:26px}.footer{padding:35px 7%;border-top:1px solid #e2e8f0;background:white;display:flex;justify-content:space-between;gap:20px;color:#64748b}.footer a{margin-left:18px;color:#2563ff;font-weight:800}@media(max-width:1000px){.site-header{flex-wrap:wrap;gap:16px}.nav{order:3;width:100%;justify-content:center;flex-wrap:wrap;gap:16px}.hero-section,.calculator-layout{grid-template-columns:1fr;padding-top:60px}.hero-content h1{font-size:46px}.audience-section,.latest-grid{grid-template-columns:1fr}.tools-grid{grid-template-columns:1fr 1fr}}@media(max-width:600px){.hero-content h1{font-size:38px}.hero-description{font-size:17px}.preview-results,.result-grid,.tools-grid{grid-template-columns:1fr}.header-button{display:none}.content-page{padding:28px}.footer{flex-direction:column}.footer a{margin-left:0;margin-right:14px}}


.tools-page-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 22px;
    margin-top: 32px;
}

.tool-page-card {
    display: block;
    padding: 28px;
    border-radius: 24px;
    background: linear-gradient(135deg, rgba(37, 99, 255, 0.07), rgba(124, 58, 237, 0.08));
    border: 1px solid rgba(124, 58, 237, 0.16);
    transition: 0.2s ease;
}

.tool-page-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.08);
}

.tool-page-card h2 {
    margin-top: 0;
    margin-bottom: 12px;
}

.tool-page-card p {
    color: #475569;
}

.tool-page-card span {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 999px;
    background: #eef2ff;
    color: #2563ff;
    font-weight: 900;
    font-size: 13px;
}

.active-tool {
    border: 1px solid rgba(37, 99, 255, 0.35);
    box-shadow: 0 18px 40px rgba(37, 99, 255, 0.1);
}

@media (max-width: 900px) {
    .tools-page-grid {
        grid-template-columns: 1fr;
    }
}
