*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --teal: #2ec4b6; --teal-dark: #1eaa9d;
  --black: #000; --white: #fff;
  --topbar-bg: #111;
  --font: 'DM Sans', sans-serif;
}
body { font-family: var(--font); background: #f5faf9; margin:0; padding:0; }

/* TOPBAR */
.topbar { background:var(--topbar-bg); color:#aaa; font-size:.78rem; padding:0 2rem; display:flex; justify-content:space-between; align-items:center; height:36px; gap:1rem; }
.topbar-left { display:flex; align-items:center; gap:1.5rem; }
.topbar-left a, .topbar-right a { color:#aaa; text-decoration:none; display:flex; align-items:center; gap:.4rem; transition:color .2s; }
.topbar-left a:hover, .topbar-right a:hover { color:var(--teal); }
.topbar-divider { width:1px; height:16px; background:#333; }
.amfi-badge { background:#1a1a1a; border:1px solid #333; border-radius:3px; padding:2px 8px; font-size:.7rem; color:var(--teal); letter-spacing:.05em; }
.topbar-right { display:flex; align-items:center; gap:1.2rem; }
.social-link svg { width:15px; height:15px; fill:#aaa; transition:fill .2s; }
.social-link:hover svg { fill:var(--teal); }

/* HEADER */
header { background:#fff; padding:0 2rem; display:flex; align-items:center; justify-content:space-between; height:70px; position:sticky; top:0; z-index:1000; box-shadow:0 2px 16px rgba(0,0,0,.08); border-bottom:1px solid #ebebeb; }
.logo a { display:block; line-height:0; }
.logo img { height:38px; width:auto; object-fit:contain; }
nav { display:flex; align-items:center; gap:.2rem; }
nav a, .dropdown > a { color:#222; text-decoration:none; font-size:.92rem; font-weight:500; padding:8px 14px; border-radius:5px; transition:background .2s,color .2s; display:flex; align-items:center; gap:5px; white-space:nowrap; }
nav > a:hover { background:#f4f4f4; color:var(--teal); }
.dropdown { position:relative; }
.dropdown > a::after { content:''; display:inline-block; width:0; height:0; border-left:4px solid transparent; border-right:4px solid transparent; border-top:5px solid #999; margin-left:2px; transition:transform .2s; }
.dropdown:hover > a::after { transform:rotate(180deg); border-top-color:var(--teal); }
.dropdown:hover > a { background:#f4f4f4; color:var(--teal); }
.dropdown-menu { display:none; position:absolute; top:calc(100% + 6px); left:0; background:#fff; border:1px solid #e8e8e8; border-radius:8px; min-width:220px; overflow:hidden; box-shadow:0 12px 30px rgba(0,0,0,.1); z-index:200; }
.dropdown:hover .dropdown-menu { display:block; }
.dropdown-menu a { color:#333; font-size:.88rem; font-weight:400; padding:10px 18px; border-radius:0; display:block; transition:background .15s,color .15s; }
.dropdown-menu a:hover { background:#f4fffe; color:var(--teal); }
.dropdown-section-label { color:#aaa; font-size:.72rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; padding:10px 18px 4px; cursor:default; }
.dropdown-menu hr { border:none; border-top:1px solid #f0f0f0; margin:4px 0; }
.header-actions { display:flex; align-items:center; gap:.7rem; }
.btn-register { font-family:var(--font); font-size:.88rem; font-weight:600; color:#333; background:transparent; border:1.5px solid #ccc; padding:7px 18px; border-radius:6px; text-decoration:none; transition:border-color .2s,color .2s; }
.btn-register:hover { border-color:var(--teal); color:var(--teal); }
.btn-signin { font-family:var(--font); font-size:.88rem; font-weight:700; color:#000; background:var(--teal); padding:8px 22px; border-radius:6px; text-decoration:none; border:none; cursor:pointer; transition:background .2s,transform .1s; }
.btn-signin:hover { background:var(--teal-dark); transform:translateY(-1px); }
.hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:4px; }
.hamburger span { display:block; width:24px; height:2px; background:#333; border-radius:2px; transition:all .3s; }
.mobile-nav { display:none; background:#fff; border-top:1px solid #eee; padding:1rem 1.5rem; flex-direction:column; gap:.3rem; box-shadow:0 8px 20px rgba(0,0,0,.08); }
.mobile-nav.open { display:flex; }
.mobile-nav a { color:#333; text-decoration:none; font-size:.92rem; padding:9px 4px; border-bottom:1px solid #f0f0f0; transition:color .2s; display:block; }
.mobile-nav a:hover { color:var(--teal); }
.mobile-nav .mobile-section { color:#bbb; font-size:.72rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; padding:10px 4px 4px; }

/* FOOTER */
footer { background:#f7f8f9; color:#555; font-family:var(--font); padding:60px 0 0; }
.footer-inner { max-width:1200px; margin:0 auto; padding:0 2rem; display:grid; grid-template-columns:2fr 1fr 1fr 1.4fr; gap:3rem; }
.footer-brand .footer-logo { height:36px; width:auto; margin-bottom:1.2rem; display:block; }
.footer-brand p { font-size:.88rem; line-height:1.7; color:#666; margin-bottom:1.4rem; max-width:300px; }
.footer-social { display:flex; gap:10px; }
.footer-social a { display:flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:50%; background:#e8e9ea; border:1px solid #d5d6d8; transition:background .2s,border-color .2s; }
.footer-social a:hover { background:var(--teal); border-color:var(--teal); }
.footer-social a svg { width:15px; height:15px; fill:#555; transition:fill .2s; }
.footer-social a:hover svg { fill:#fff; }
.footer-col h4 { color:#1a1a1a; font-size:.82rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; margin-bottom:1.2rem; padding-bottom:.6rem; border-bottom:2px solid var(--teal); display:inline-block; }
.footer-col ul { list-style:none; display:flex; flex-direction:column; gap:.55rem; }
.footer-col ul li a { color:#555; text-decoration:none; font-size:.88rem; transition:color .2s; display:flex; align-items:center; gap:6px; }
.footer-col ul li a::before { content:'›'; color:var(--teal); font-size:1rem; line-height:1; }
.footer-col ul li a:hover { color:var(--teal); }
.footer-contact-item { display:flex; align-items:flex-start; gap:10px; margin-bottom:1rem; font-size:.88rem; color:#555; }
.footer-contact-item svg { width:16px; height:16px; fill:var(--teal); flex-shrink:0; margin-top:2px; }
.footer-contact-item a { color:#555; text-decoration:none; transition:color .2s; }
.footer-contact-item a:hover { color:var(--teal); }
.footer-amfi { display:inline-block; margin-top:1rem; background:#fff; border:1px solid #ddd; border-left:3px solid var(--teal); border-radius:4px; padding:8px 14px; font-size:.75rem; color:#666; line-height:1.5; }
.footer-amfi strong { color:var(--teal); display:block; font-size:.7rem; letter-spacing:.08em; text-transform:uppercase; }
.footer-bottom-bar { background:#edeef0; }
.footer-bottom { margin-top:50px; border-top:1px solid #dde0e4; padding:20px 2rem; display:flex; justify-content:space-between; align-items:center; max-width:1200px; margin-left:auto; margin-right:auto; flex-wrap:wrap; gap:.5rem; }
.footer-bottom p { font-size:.8rem; color:#888; }
.footer-bottom a { color:#888; text-decoration:none; transition:color .2s; }
.footer-bottom a:hover { color:var(--teal); }
.footer-bottom-links { display:flex; gap:1.5rem; font-size:.8rem; }
.footer-disclaimer { background:#e5e7ea; padding:16px 2rem; text-align:center; font-size:.75rem; color:#888; line-height:1.6; }
@media(max-width:860px){
  nav, .header-actions { display:none; }
  .hamburger { display:flex !important; }
  .topbar { display:none; }
  header { height:60px; padding:0 1.2rem; }
  .footer-inner { grid-template-columns:1fr 1fr; gap:2rem; }
  .footer-brand { grid-column:1 / -1; }
}
@media(max-width:500px){
  .footer-inner { grid-template-columns:1fr; }
  .footer-bottom { flex-direction:column; text-align:center; }
}
#sf-planner-root,#sf-planner-root *{box-sizing:border-box;font-family:'Inter',system-ui,sans-serif}
#sf-planner-root{
  all:initial;display:block;
  --teal:#00B896;--teal-dark:#009478;--teal-deeper:#007A63;
  --teal-faint:rgba(0,184,150,0.07);--teal-light:rgba(0,184,150,0.18);--teal-mid:rgba(0,184,150,0.22);
  --black:#111;--text:#1a1a1a;--sub:#5c6b6e;--border:#e0eeeb;--bg:#f5faf9;--white:#fff;
  --amber:#d4820a;--amber-fill:rgba(212,130,10,0.07);--red:#c0392b;
  font-family:'Inter',system-ui,sans-serif;
  color:#1a1a1a;background:#f5faf9;
  width:100%;min-height:100vh;
  padding:1.25rem 0 3rem;
}
#sf-planner-root .sf-page{width:100%;max-width:100%;padding:0 1.5rem;display:flex;flex-direction:column;gap:1.5rem}
#sf-planner-root .hero{background:linear-gradient(135deg,#111 0%,#1a2e2a 50%,#0f3d32 100%);border-radius:16px;padding:2rem 2.25rem 1.75rem;position:relative;overflow:hidden}
#sf-planner-root .hero::before{content:'';position:absolute;right:-60px;top:-60px;width:280px;height:280px;background:rgba(0,184,150,0.07);border-radius:50%;pointer-events:none}
#sf-planner-root .hero::after{content:'';position:absolute;left:35%;bottom:-80px;width:220px;height:220px;background:rgba(0,184,150,0.04);border-radius:50%;pointer-events:none}
#sf-planner-root .hero-tag{display:inline-flex;align-items:center;gap:6px;background:rgba(0,184,150,0.15);border:1px solid rgba(0,184,150,0.3);border-radius:20px;padding:4px 14px;margin-bottom:1rem}
#sf-planner-root .hero-tag span{font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:rgba(0,184,150,0.95)}
#sf-planner-root .hero h1{font-size:1.9rem;font-weight:700;color:#fff;line-height:1.22;margin-bottom:.5rem;letter-spacing:-.02em}
#sf-planner-root .hero h1 span{color:var(--teal)}
#sf-planner-root .hero p{font-size:13.5px;color:rgba(255,255,255,0.55);line-height:1.7;max-width:540px}
#sf-planner-root .hero-stats{display:flex;flex-wrap:wrap;align-items:stretch;gap:0;margin-top:1.5rem;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.08);border-radius:10px;overflow:hidden}
#sf-planner-root .hstat{flex:1;min-width:100px;padding:.75rem 1rem;border-right:1px solid rgba(255,255,255,0.08)}
#sf-planner-root .hstat:last-child{border-right:none}
#sf-planner-root .hstat-val{font-size:1.1rem;font-weight:700;color:var(--teal);letter-spacing:-.01em}
#sf-planner-root .hstat-lbl{font-size:9.5px;color:rgba(255,255,255,0.4);letter-spacing:.06em;text-transform:uppercase;margin-top:2px}
#sf-planner-root .card{background:#fff;border:1px solid var(--border);border-radius:16px;padding:1.5rem 1.75rem;box-shadow:0 2px 12px rgba(0,0,0,0.04)}
#sf-planner-root .card-head{display:flex;align-items:center;gap:10px;margin-bottom:1.25rem;padding-bottom:1rem;border-bottom:1px solid var(--border)}
#sf-planner-root .card-head-icon{width:34px;height:34px;background:var(--teal-faint);border:1px solid var(--teal-light);border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
#sf-planner-root .card-head-icon i{font-size:17px;color:var(--teal-dark)}
#sf-planner-root .card-head h2{font-size:15px;font-weight:600;color:var(--text)}
#sf-planner-root .card-head p{font-size:12px;color:var(--sub);margin-top:1px}
#sf-planner-root .two-col{display:grid;grid-template-columns:320px 1fr;gap:1.5rem;align-items:start}
@media(max-width:860px){#sf-planner-root .two-col{grid-template-columns:1fr}}
#sf-planner-root .inputs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1.25rem}
@media(max-width:640px){#sf-planner-root .inputs-grid{grid-template-columns:1fr 1fr}}
@media(max-width:400px){#sf-planner-root .inputs-grid{grid-template-columns:1fr}}
#sf-planner-root .ctrl{position:relative}
#sf-planner-root .ctrl label{display:flex;align-items:center;gap:5px;font-size:10.5px;font-weight:600;color:var(--sub);text-transform:uppercase;letter-spacing:.06em;margin-bottom:5px;cursor:default}
#sf-planner-root .info-icon{width:15px;height:15px;border-radius:50%;background:rgba(0,184,150,0.12);border:1.5px solid rgba(0,184,150,0.35);display:inline-flex;align-items:center;justify-content:center;font-size:9px;color:var(--teal-dark);cursor:pointer;flex-shrink:0;font-style:normal;font-weight:700;font-family:'Inter',sans-serif;opacity:.85;transition:all .15s;position:relative;user-select:none}
#sf-planner-root .info-icon:hover{opacity:1}
#sf-planner-root .tooltip{display:none;position:absolute;bottom:calc(100% + 12px);left:50%;transform:translateX(-50%);z-index:99999;background:#fff;color:#1a1a1a;font-size:11.5px;line-height:1.65;padding:10px 13px;border-radius:12px;width:200px;border:1.5px solid rgba(0,184,150,0.3);box-shadow:0 8px 32px rgba(0,0,0,.13),0 2px 8px rgba(0,184,150,.08);pointer-events:none;font-weight:400;letter-spacing:0;white-space:normal}
#sf-planner-root .tooltip::before{content:'';position:absolute;top:100%;left:50%;transform:translateX(-50%);border:7px solid transparent;border-top-color:rgba(0,184,150,0.3)}
#sf-planner-root .tooltip::after{content:'';position:absolute;top:100%;left:50%;transform:translateX(-50%);border:6px solid transparent;border-top-color:#fff;margin-top:-1px}
#sf-planner-root .info-icon.active{opacity:1;background:rgba(0,184,150,0.2);border-color:rgba(0,184,150,0.5)}
#sf-planner-root .inp-box{position:relative;display:flex;align-items:center;margin-bottom:6px}
#sf-planner-root .inp-pre{position:absolute;left:9px;font-size:13px;font-weight:500;color:var(--sub);pointer-events:none;z-index:1}
#sf-planner-root .inp-suf{position:absolute;right:9px;font-size:12px;color:var(--sub);pointer-events:none}
#sf-planner-root input.finp{width:100%;height:38px;border:1.5px solid var(--border);border-radius:8px;font-family:'Inter',sans-serif;font-size:14px;font-weight:600;color:var(--text);background:var(--bg);outline:none;transition:border-color .15s,box-shadow .15s}
#sf-planner-root input.finp:focus{border-color:var(--teal);background:#fff;box-shadow:0 0 0 3px rgba(0,184,150,0.1)}
#sf-planner-root input.finp.pre{padding:0 10px 0 24px}
#sf-planner-root input.finp.suf{padding:0 32px 0 10px}
#sf-planner-root input[type=range]{width:100%;accent-color:var(--teal);cursor:pointer;margin-top:3px}
#sf-planner-root .range-ends{display:flex;justify-content:space-between;font-size:9.5px;color:#a0b8b4;margin-top:3px}
#sf-planner-root .res-row{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin-bottom:1.25rem}
@media(max-width:700px){#sf-planner-root .res-row{grid-template-columns:1fr 1fr}}
#sf-planner-root .rpill{border-radius:10px;padding:12px 14px;border:1.5px solid var(--border);background:var(--bg)}
#sf-planner-root .rpill.hi{background:var(--teal-dark);border-color:var(--teal-dark)}
#sf-planner-root .rpill .rl{font-size:10px;font-weight:500;color:var(--sub);letter-spacing:.04em;text-transform:uppercase;margin-bottom:4px}
#sf-planner-root .rpill .rv{font-size:16px;font-weight:700;color:var(--text)}
#sf-planner-root .rpill.hi .rl{color:rgba(255,255,255,0.6)}
#sf-planner-root .rpill.hi .rv{color:#fff}
#sf-planner-root .rpill.accent .rv{color:var(--teal-dark)}
#sf-planner-root .sec-label{font-size:11px;font-weight:600;color:var(--sub);text-transform:uppercase;letter-spacing:.06em;margin-bottom:.65rem;display:block}
#sf-planner-root .legend-row{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:.75rem}
#sf-planner-root .li{display:flex;align-items:center;gap:5px;font-size:11.5px;color:var(--sub)}
#sf-planner-root .ld{width:10px;height:10px;border-radius:2px;flex-shrink:0}
#sf-planner-root .chart-head-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:.65rem}
#sf-planner-root .su-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--border);border-radius:10px;margin-top:.75rem}
#sf-planner-root .su-table{width:100%;border-collapse:collapse;font-size:12px;min-width:560px}
#sf-planner-root .su-table thead tr{background:var(--teal-faint);border-bottom:1.5px solid var(--teal-light)}
#sf-planner-root .su-table th{padding:8px 12px;font-size:10px;font-weight:600;color:var(--teal-deeper);text-transform:uppercase;letter-spacing:.05em;text-align:right;white-space:nowrap}
#sf-planner-root .su-table th:first-child{text-align:left}
#sf-planner-root .su-table td{padding:8px 12px;border-bottom:1px solid var(--border);text-align:right;color:var(--text)}
#sf-planner-root .su-table td:first-child{text-align:left;font-weight:600;color:var(--sub)}
#sf-planner-root .su-table tbody tr:last-child td{border-bottom:none}
#sf-planner-root .su-table tbody tr:nth-child(even){background:rgba(0,184,150,0.025)}
#sf-planner-root .su-table .td-sip{color:var(--teal-dark);font-weight:700}
#sf-planner-root .su-table .td-corp{font-weight:600}
#sf-planner-root .su-table .td-diff{color:#7c4dff;font-weight:600}
#sf-planner-root .swp-summary{border-radius:12px;background:linear-gradient(135deg,#111 0%,#1a2e2a 60%,#0f3d32 100%);padding:1.35rem;border:1px solid #1a2e2a;height:100%}
#sf-planner-root .ss-label{font-size:10px;font-weight:600;color:rgba(255,255,255,0.5);text-transform:uppercase;letter-spacing:.08em;margin-bottom:.4rem}
#sf-planner-root .ss-val{font-size:30px;font-weight:700;color:#fff;line-height:1.15;margin-bottom:.5rem;letter-spacing:-.02em}
#sf-planner-root .ss-val span{font-size:14px;font-weight:400;color:rgba(255,255,255,0.5);margin-left:3px}
#sf-planner-root .ss-meta{font-size:11.5px;color:rgba(255,255,255,0.55);line-height:2}
#sf-planner-root .ss-meta strong{color:rgba(255,255,255,0.9)}
#sf-planner-root .spill{display:inline-flex;align-items:center;gap:5px;border-radius:6px;padding:5px 10px;font-size:11px;font-weight:500;margin-top:.75rem}
#sf-planner-root .spill.ok{background:rgba(0,184,150,0.18);color:var(--teal)}
#sf-planner-root .spill.warn{background:rgba(212,130,10,0.2);color:#f4c060}
#sf-planner-root .spill.bad{background:rgba(192,57,43,0.2);color:#f08080}
#sf-planner-root .swp-breakdown-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--border);border-radius:10px;margin-top:1rem}
#sf-planner-root .swp-breakdown-table{width:100%;border-collapse:collapse;font-size:12.5px;min-width:500px}
#sf-planner-root .swp-breakdown-table thead tr{background:rgba(0,0,0,0.025);border-bottom:1.5px solid var(--border)}
#sf-planner-root .swp-breakdown-table th{padding:8px 12px;font-size:10.5px;font-weight:600;color:var(--sub);text-transform:uppercase;letter-spacing:.05em;text-align:right}
#sf-planner-root .swp-breakdown-table th:first-child{text-align:left}
#sf-planner-root .swp-breakdown-table td{padding:10px 12px;border-bottom:1px solid var(--border);text-align:right;color:var(--text)}
#sf-planner-root .swp-breakdown-table td:first-child{text-align:left;font-weight:600}
#sf-planner-root .swp-breakdown-table tbody tr:last-child td{border-bottom:none}
#sf-planner-root .swp-breakdown-table tbody tr:hover td{background:rgba(0,184,150,0.04)}
#sf-planner-root .stepup-toggle-wrap{display:inline-flex;align-items:center;gap:9px;padding:7px 14px;background:var(--teal-faint);border:1.5px solid var(--teal-light);border-radius:20px;margin-bottom:1.1rem;cursor:pointer;user-select:none}
#sf-planner-root .stepup-toggle-wrap span{font-size:12.5px;font-weight:600;color:var(--teal-deeper)}
#sf-planner-root .tog{position:relative;width:34px;height:19px;flex-shrink:0}
#sf-planner-root .tog input{opacity:0;width:0;height:0;position:absolute}
#sf-planner-root .tog-track{position:absolute;inset:0;background:var(--teal-mid);border-radius:20px;transition:.2s}
#sf-planner-root .tog input:checked+.tog-track{background:var(--teal)}
#sf-planner-root .tog-thumb{position:absolute;top:3px;left:3px;width:13px;height:13px;background:#fff;border-radius:50%;transition:.2s;pointer-events:none;box-shadow:0 1px 3px rgba(0,0,0,.18)}
#sf-planner-root .tog input:checked~.tog-thumb{left:18px}
#sf-planner-root .stepup-box{background:var(--teal-faint);border:1.5px solid var(--teal-light);border-radius:10px;padding:1rem 1.1rem;margin-bottom:1.1rem;display:none}
#sf-planner-root .stepup-box.show{display:block}
#sf-planner-root .sf-spinner{display:flex;flex-direction:column;flex-shrink:0;height:38px}
#sf-planner-root .sf-spin-btn{width:26px;height:19px;border:1.5px solid var(--border);background:var(--bg);color:var(--sub);font-size:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .12s,color .12s;line-height:1;padding:0;font-family:'Inter',sans-serif;flex:1}
#sf-planner-root .sf-spin-up{border-radius:0 8px 0 0;border-bottom-width:.75px}
#sf-planner-root .sf-spin-dn{border-radius:0 0 8px 0;border-top-width:.75px}
#sf-planner-root .sf-spin-btn:hover{background:var(--teal-faint);color:var(--teal-dark);border-color:var(--teal-light)}
#sf-planner-root .sf-spin-btn:active{background:var(--teal-light)}
@media(max-width:480px){
  #sf-planner-root .sf-page{padding:0 .75rem}
  #sf-planner-root .card{padding:1.1rem 1rem}
  #sf-planner-root .hero{padding:1.5rem 1.25rem}
  #sf-planner-root .hero h1{font-size:1.5rem}
}
