/* EVERYDAYKIT AGE CALCULATOR — performance-optimized */
.ekac{--c:#4f46e5;--c2:#7c3aed;--acc:#f59e0b;--pink:#ec4899;--bg:#fff;--soft:#f8f9ff;--soft2:#f1f3ff;--bd:#e2e5f0;--tx:#111827;--tx2:#334155;--mu:#64748b;--success:#059669;--danger:#dc2626;--r:18px;max-width:1000px;margin:0 auto;padding:0 14px 40px;color:var(--tx);background:#fff;line-height:1.65;font-size:16px;font-family:inherit;-webkit-font-smoothing:antialiased}
.ekac *,.ekac ::before,.ekac ::after{box-sizing:border-box}
.ekac ::selection{background:#c7d2fe;color:#312e81}

/* HEADER — static gradients, no blur/backdrop filters */
.ekac-head{position:relative;overflow:hidden;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);text-align:center;color:#fff;background:radial-gradient(circle at 10% 15%,rgba(255,255,255,.2),transparent 32%),radial-gradient(circle at 90% 10%,rgba(251,191,36,.28),transparent 30%),linear-gradient(135deg,#312e81 0%,#4f46e5 42%,#7c3aed 72%,#a21caf 100%);border-radius:0 0 42px 42px;padding:58px 22px 120px;contain:paint}
.ekac-head>*{position:relative;z-index:1}
.ekac-head h1{color:#fff;font-size:clamp(2.1rem,6vw,3.5rem);line-height:1.05;margin:.35em 0;font-weight:850;letter-spacing:-.035em}
.ekac-head p{max-width:650px;margin:0 auto;font-size:clamp(1rem,2.5vw,1.18rem);line-height:1.65;opacity:.96}
.ekac-badge{display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.35);padding:7px 17px;border-radius:999px;font-size:.76rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.ekac-chips{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:9px;margin:22px 0 0;padding:0}
.ekac-chips li{background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.25);padding:7px 15px;border-radius:999px;font-size:.86rem;font-weight:600}

/* CARDS — hover animates transform only (GPU-friendly) */
.ekac-card{position:relative;max-width:100%;background:#fff;border:1px solid var(--bd);border-radius:22px;padding:30px;margin:0 auto 25px;box-shadow:0 2px 4px rgba(15,23,42,.04),0 8px 24px rgba(15,23,42,.07);transition:transform .2s ease}
.ekac-card:hover{transform:translateY(-2px)}
.ekac-head+.ekac-ad+.ekac-card,.ekac-head+.ekac-card{margin-top:-72px;z-index:3;border-color:rgba(255,255,255,.65);box-shadow:0 14px 36px rgba(30,27,75,.22)}

/* HEADINGS */
.ekac h2{position:relative;display:flex;align-items:center;gap:12px;font-size:1.4rem;line-height:1.3;margin:0 0 22px;color:var(--tx);font-weight:800;letter-spacing:-.02em}
.ekac h2::after{content:"";position:absolute;left:0;bottom:-9px;width:42px;height:3px;border-radius:999px;background:linear-gradient(90deg,var(--c),var(--c2))}
.ekac h3{font-size:1.08rem;margin:1.3em 0 .5em;color:var(--tx);font-weight:750;letter-spacing:-.01em}
.ekac-ic{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;flex:none;border-radius:14px;background:linear-gradient(135deg,#eef2ff,#f3e8ff);border:1px solid #e0e7ff;font-size:1.25rem}
.ekac-ic:empty{display:none}
.ekac-small{color:var(--mu);font-size:.9rem;margin:.4em 0}

/* FORM */
.ekac-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.ekac-wide{grid-column:1/-1}
.ekac-field label{display:block;font-weight:700;font-size:.87rem;margin-bottom:8px;color:var(--tx2)}
.ekac input,.ekac select{width:100%;min-height:54px;padding:11px 16px;border:2px solid var(--bd);border-radius:14px;font-size:1rem;background:#fafbff;color:var(--tx);font-family:inherit;transition:border-color .15s,box-shadow .15s,background-color .15s}
.ekac input:hover,.ekac select:hover{border-color:#c7cbe3;background-color:#fff}
.ekac input:focus,.ekac select:focus{outline:0;border-color:var(--c);box-shadow:0 0 0 4px rgba(79,70,229,.12);background-color:#fff}
.ekac input::placeholder{color:#9aa3b8}
.ekac select{appearance:none;-webkit-appearance:none;padding-right:44px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1.5l6 6 6-6' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;cursor:pointer}

/* BUTTONS — no filter; transform only on hover */
.ekac-actions{display:flex;gap:12px;margin-top:24px;flex-wrap:wrap}
.ekac-btn{position:relative;min-height:55px;padding:12px 30px;border:0;border-radius:14px;background:linear-gradient(135deg,var(--c),var(--c2));color:#fff;font-size:1.03rem;font-weight:750;cursor:pointer;box-shadow:0 8px 18px rgba(79,70,229,.3),inset 0 1px 0 rgba(255,255,255,.22);transition:transform .15s ease;font-family:inherit}
.ekac-btn:hover{transform:translateY(-2px)}
.ekac-btn:active{transform:none}
.ekac-alt{background:#f1f3f9;color:var(--tx);box-shadow:inset 0 0 0 1px var(--bd)}
.ekac-alt:hover{background:#e9ecf5}
#ekac-go{flex:1 1 210px}

/* ACCESSIBILITY */
.ekac button:focus-visible,.ekac summary:focus-visible{outline:3px solid #a5b4fc;outline-offset:3px}

/* MESSAGES */
.ekac-error{background:#fff7f7;border:1px solid #fecaca;border-left:5px solid #ef4444;color:#b91c1c;font-weight:650;padding:13px 17px;border-radius:13px;margin:18px 0 0}
.ekac-inline{display:flex;gap:14px;align-items:flex-end;flex-wrap:wrap}
.ekac-inline .ekac-field{flex:1 1 200px}
.ekac-result{font-weight:700;margin:18px 0 0;color:var(--c);font-size:1.03rem}
.ekac-result:empty{display:none}

/* RESULT HERO */
.ekac-hero{position:relative;overflow:hidden;background:radial-gradient(circle at 85% 0%,rgba(251,191,36,.28),transparent 38%),linear-gradient(135deg,#312e81 0%,#4f46e5 45%,#7c3aed 75%,#a21caf 100%);color:#fff;text-align:center;border-radius:24px;padding:42px 22px;margin-bottom:26px;box-shadow:0 12px 32px rgba(76,29,149,.28)}
.ekac-hero .ekac-big{font-size:clamp(1.8rem,6vw,3rem);font-weight:850;line-height:1.12;margin:.3em 0;color:#fde68a;letter-spacing:-.025em}
.ekac-hero p{margin:.4em 0;font-size:1rem;opacity:.96}

/* STATS */
.ekac-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:15px}
.ekac-stat{background:linear-gradient(180deg,#fff,#f8f9ff);border:1px solid var(--bd);border-top:4px solid var(--c);border-radius:16px;padding:17px;box-shadow:0 4px 12px rgba(15,23,42,.05);transition:transform .2s ease}
.ekac-stat:hover{transform:translateY(-3px)}
.ekac-stat:nth-child(3n+2){border-top-color:var(--c2)}
.ekac-stat:nth-child(3n){border-top-color:var(--acc)}
.ekac-stat span{display:block;color:var(--mu);font-size:.76rem;text-transform:uppercase;letter-spacing:.06em;font-weight:700;margin-bottom:4px}
.ekac-stat strong{font-size:1.16rem;font-weight:800;word-break:break-word;color:var(--tx)}

/* LISTS */
.ekac-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ekac-list li{padding:13px 16px 13px 19px;background:var(--soft);border:1px solid var(--bd);border-left:4px solid var(--c);border-radius:12px;transition:transform .2s ease}
.ekac-list li:hover{transform:translateX(4px)}
.ekac-noprint+.ekac-small{margin-top:10px}

/* AD SLOT — reserved height prevents layout shift (CLS) */
.ekac-ad{min-height:90px;margin:0 0 24px;padding:14px 0;text-align:center;clear:both}
.ekac-ad::before{content:"Advertisement";display:block;font-size:.68rem;color:#94a3b8;margin-bottom:7px;letter-spacing:.09em;text-transform:uppercase}

/* FAQ */
.ekac details{border:1px solid var(--bd);border-radius:14px;background:#fafbff;margin-bottom:10px;overflow:hidden}
.ekac summary{cursor:pointer;padding:16px 18px;font-weight:700;color:var(--tx);list-style:none}
.ekac summary::-webkit-details-marker{display:none}
.ekac summary::after{content:"+";float:right;font-size:1.25rem;color:var(--c);font-weight:500}
.ekac details[open] summary::after{content:"\2212"}
.ekac details p{padding:0 18px 17px;margin:0;color:var(--mu)}

/* LINKS */
.ekac a{color:var(--c);text-decoration:none;font-weight:600}
.ekac a:hover{color:var(--c2);text-decoration:underline}

/* ANIMATION — single short, transform/opacity only */
.ekac-out{animation:ekac-in .35s ease-out both}
@keyframes ekac-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* TABLET */
@media(max-width:768px){.ekac-head{padding:44px 18px 100px;border-radius:0 0 30px 30px}.ekac-card{padding:24px}.ekac-head+.ekac-ad+.ekac-card,.ekac-head+.ekac-card{margin-top:-60px}}

/* MOBILE — lighter shadows, no hover motion */
@media(max-width:560px){
.ekac{padding:0 8px 25px;font-size:15.5px}
.ekac-head{margin:0 -8px;padding:36px 15px 88px;border-radius:0 0 26px 26px}
.ekac-head h1{font-size:clamp(2rem,10vw,2.65rem)}
.ekac-head p{font-size:.96rem}
.ekac-badge{font-size:.7rem}
.ekac-chips{gap:7px}
.ekac-chips li{padding:6px 11px;font-size:.78rem}
.ekac-card{padding:20px;border-radius:18px;box-shadow:0 6px 18px rgba(15,23,42,.07)}
.ekac-head+.ekac-ad+.ekac-card,.ekac-head+.ekac-card{margin-top:-52px}
.ekac-form{grid-template-columns:1fr 1fr;gap:12px}
.ekac-form .ekac-field:nth-child(4){grid-column:1/-1}
.ekac input,.ekac select{min-height:51px;padding:10px 12px}
.ekac-actions{gap:10px}
.ekac-btn{flex:1 1 100%;min-height:52px}
.ekac-grid{grid-template-columns:1fr 1fr;gap:10px}
.ekac-stat{padding:14px 13px}
.ekac-stat strong{font-size:1.03rem}
.ekac-hero{padding:32px 16px;border-radius:20px}
.ekac-hero .ekac-big{font-size:clamp(1.65rem,8vw,2.3rem)}
.ekac h2{font-size:1.2rem}
.ekac-ic{width:38px;height:38px;border-radius:12px;font-size:1.1rem}}
@media(hover:none){.ekac-card:hover,.ekac-stat:hover,.ekac-list li:hover,.ekac-btn:hover{transform:none}}
@media(max-width:340px){.ekac-form,.ekac-grid{grid-template-columns:1fr}.ekac-form .ekac-field:nth-child(4){grid-column:auto}.ekac-head h1{font-size:1.9rem}.ekac-card{padding:17px}}

/* REDUCED MOTION */
@media(prefers-reduced-motion:reduce){.ekac-out{animation:none}.ekac-card,.ekac-stat,.ekac-list li,.ekac-btn,.ekac input,.ekac select{transition:none}}

/* PRINT */
@media print{body.ekac-printing *{visibility:hidden}body.ekac-printing #ekac-summary,body.ekac-printing #ekac-summary *{visibility:visible}body.ekac-printing #ekac-summary{position:absolute;left:0;top:0;width:100%}.ekac-noprint{display:none}}
