/* Kyrtica India multipage styles */ 
:root{ --bg:#0b0b0b; --card:#141414; --muted:#9aa0a6; --text:#eaecef; --brand:#e5b700; --max:1120px; }
*{box-sizing:border-box} html,body{margin:0;background:var(--bg);color:var(--text);font-family:system-ui,Segoe UI,Roboto,Inter,Arial;line-height:1.6}
a{color:var(--text);text-decoration:none}
.container{max-width:var(--max);margin:0 auto;padding:0 20px}
img{max-width:100%;display:block}
.site-header{position:sticky;top:0;background:rgba(11,11,11,.9);backdrop-filter:saturate(120%) blur(6px);border-bottom:1px solid #1f1f1f;z-index:30}
.nav{display:flex;align-items:center;justify-content:space-between;min-height:64px}
.brand{display:flex;align-items:center;gap:10px;font-weight:800}
.menu{display:flex;gap:18px}.menu a{opacity:.85}.menu a:hover,.menu a.active{opacity:1}
.menu-toggle{display:none;background:transparent;border:1px solid #2a2a2a;color:#fff;padding:6px 10px;border-radius:10px}
.hero{padding:56px 0 30px;border-bottom:1px solid #1f1f1f}
.hero-inner{display:grid;grid-template-columns:1.2fr .8fr;gap:28px}
.hero h1{font-size:2.3rem;margin:0 0 6px}.cta-row{display:flex;gap:12px;margin:12px 0 14px}
.btn{display:inline-block;padding:11px 16px;border-radius:12px;border:1px solid #2a2a2a;background:#151515;box-shadow:0 10px 25px rgba(0,0,0,.3)}
.btn-primary{background:linear-gradient(135deg,var(--brand),#ffd658);color:#111;font-weight:800;border-color:#000}
.btn-ghost{color:#f1f1f1}
.hero-points{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding-left:18px}
.hero-card .card{background:var(--card);padding:18px;border-radius:16px;border:1px solid #262626}
.card-row{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px dashed #2a2a2a}
.card-row.total{border-bottom:0;font-weight:800}
.features{padding:34px 0;border-bottom:1px solid #1f1f1f}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.info-card,.feature,.card{background:var(--card);border:1px solid #262626;border-radius:16px;padding:18px}
.strip{padding:42px 0}
.strip-inner{display:flex;align-items:center;justify-content:space-between;gap:18px;background:linear-gradient(135deg,#111,#1a1a1a);border:1px solid #262626;border-radius:16px;padding:18px}
.cards{padding-bottom:30px;border-bottom:1px solid #1f1f1f}
.page{padding:36px 0}.prose h1{margin-top:0}.muted{color:var(--muted)}
.filters{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0 18px}
.filters select,.filters input{background:#0d0d0d;color:#eee;border:1px solid #2a2a2a;border-radius:10px;padding:10px}
.product{position:relative}.product .price{font-weight:800;margin:8px 0}.product .actions{display:flex;gap:8px}
.badge{position:absolute;top:8px;left:8px;background:#0d0d0d;border:1px solid #2a2a2a;padding:4px 8px;border-radius:999px}
.badge.fast{border-color:#2b7c2b}
.form input,.form textarea{width:100%;background:#0e0e0e;color:#eaecef;border:1px solid #2a2a2a;border-radius:12px;padding:12px}
.site-footer{padding:22px 0;border-top:1px solid #1f1f1f}
.footer-grid{display:flex;align-items:center;justify-content:space-between;gap:18px}
.brand-row{display:flex;align-items:center;gap:10px}
@media (max-width: 900px){.hero-inner{grid-template-columns:1fr}.grid-3{grid-template-columns:1fr}.grid-2{grid-template-columns:1fr}
.strip-inner{flex-direction:column;align-items:flex-start}.menu{display:none;position:absolute;right:14px;top:58px;background:#101010;border:1px solid #262626;border-radius:12px;padding:10px;flex-direction:column;min-width:200px}.menu.show{display:flex}.menu-toggle{display:inline-block}}

/* --- Animations & Modal for Partner page --- */
:root { --overlay: rgba(0,0,0,.5); --modal:#151515; --ring:#2a2a2a; }

/* fade/slide-in on load */
@keyframes fadeUp { from { opacity:0; transform: translateY(8px);} to{opacity:1; transform:none;} }
.animate-in { animation: fadeUp .35s ease-out both; }
.animate-in-delayed { animation: fadeUp .55s ease-out both; }

/* role selector */
.role-selector { display:flex; gap:12px; flex-wrap:wrap; margin:14px 0 20px; }
.role-option { display:flex; align-items:center; gap:8px; background:#101010; border:1px solid var(--ring); border-radius:12px; padding:10px 14px; cursor:pointer; }
.role-option input { accent-color: var(--brand); }

/* Modal */
.modal-backdrop { position: fixed; inset: 0; background: var(--overlay); display:none; align-items: center; justify-content: center; padding: 16px; }
.modal-backdrop.show { display:flex; animation: fadeIn .2s ease-out; }
@keyframes fadeIn { from { opacity:0 } to { opacity:1 } }

@keyframes scaleIn { from { transform: scale(.98); opacity:.0 } to { transform: scale(1); opacity:1 } }
.modal { width: min(760px, 100%); max-height: 90vh; overflow:auto; background: var(--modal); border:1px solid #262626; border-radius: 16px; padding: 18px; box-shadow: 0 20px 60px rgba(0,0,0,.45); animation: scaleIn .18s ease-out; }
.modal-header h2 { margin: 0 0 6px; }
.modal-actions { display:flex; gap:10px; justify-content:flex-end; margin-top: 8px; }
.modal-close { position:absolute; top:10px; right:10px; background:#0e0e0e; border:1px solid #2b2b2b; color:#eee; border-radius:10px; padding:6px 10px; cursor:pointer; }

/* Smooth highlight for focused inputs */
.form input:focus, .form textarea:focus { outline: none; border-color:#3a3a3a; box-shadow: 0 0 0 3px rgba(229,183,0,.15); transition: box-shadow .15s ease; }

/* Cards slight lift */
.info-card { transition: transform .18s ease, box-shadow .18s ease; }
.info-card:hover { transform: translateY(-3px); box-shadow: 0 16px 30px rgba(0,0,0,.35); }


/* --- Validation hints & Toast --- */
.error-hint { color: #ffb3b3; font-size: .85rem; margin-top: 6px; display:none; }
.input-error { border-color: #7a2b2b !important; box-shadow: 0 0 0 3px rgba(255,0,0,.1) !important; }
.toast-root { position: fixed; z-index: 100; right: 16px; bottom: 16px; display: grid; gap: 10px; }
.toast { background:#141414; border:1px solid #2a2a2a; border-left:4px solid #5bb98a; padding:12px 14px; border-radius:12px; box-shadow: 0 12px 28px rgba(0,0,0,.35); animation: toastIn .2s ease-out; }
.toast.error { border-left-color:#e55; }
@keyframes toastIn { from { opacity:0; transform: translateY(6px);} to { opacity:1; transform:none;} }
/* ==== Partner modal, animations, validation & toast (add-only) ==== */
:root { --overlay: rgba(0,0,0,.5); --modal:#151515; --ring:#2a2a2a; }

@keyframes fadeUp { from { opacity:0; transform: translateY(8px);} to{opacity:1; transform:none;} }
.animate-in { animation: fadeUp .35s ease-out both; }
.animate-in-delayed { animation: fadeUp .55s ease-out both; }

.modal-backdrop { position: fixed; inset: 0; background: var(--overlay); display:none; align-items: center; justify-content: center; padding: 16px; z-index: 999; }
.modal-backdrop.show { display:flex; animation: fadeIn .2s ease-out; }
@keyframes fadeIn { from { opacity:0 } to { opacity:1 } }

@keyframes scaleIn { from { transform: scale(.98); opacity:.0 } to { transform: scale(1); opacity:1 } }
.modal { width: min(760px, 100%); max-height: 90vh; overflow:auto; background: var(--modal); border:1px solid #262626; border-radius: 16px; padding: 18px; box-shadow: 0 20px 60px rgba(0,0,0,.45); animation: scaleIn .18s ease-out; position: relative; }
.modal-header h2 { margin: 0 0 6px; }
.modal-actions { display:flex; gap:10px; justify-content:flex-end; margin-top: 8px; }
.modal-close { position:absolute; top:10px; right:10px; background:#0e0e0e; border:1px solid #2b2b2b; color:#eee; border-radius:10px; padding:6px 10px; cursor:pointer; }

.form input,.form textarea,.form select { width:100%; background:#0e0e0e; color:#eaecef; border:1px solid #2a2a2a; border-radius:12px; padding:12px }
.form textarea{ resize:vertical }
.form input:focus,.form textarea:focus,.form select:focus{ outline:none; border-color:#3a3a3a; box-shadow:0 0 0 3px rgba(229,183,0,.15); transition: box-shadow .15s ease; }
.grid-2 > .full{ grid-column: 1 / -1; }

.error-hint { color: #ffb3b3; font-size: .85rem; margin-top: 6px; display:none; }
.input-error { border-color: #7a2b2b !important; box-shadow: 0 0 0 3px rgba(255,0,0,.1) !important; }

.toast-root { position: fixed; z-index: 1000; right: 16px; bottom: 16px; display: grid; gap: 10px; }
.toast { background:#141414; border:1px solid #2a2a2a; border-left:4px solid #5bb98a; padding:12px 14px; border-radius:12px; box-shadow: 0 12px 28px rgba(0,0,0,.35); animation: toastIn .2s ease-out; }
.toast.error { border-left-color:#e55; }
@keyframes toastIn { from { opacity:0; transform: translateY(6px);} to { opacity:1; transform:none;} }